UWP命令栏的更多按钮未与DynamicOverflowEnabled一起显示 [英] UWP commandbar more button not showing up with DynamicOverflowEnabled

问题描述

我有一个正在使用 CustomMediaTransportControls 的UWP应用。这些控件中的
我已经在命令栏 PrimaryCommands 中添加了一些额外的按钮，并根据文档应该设置了 IsDynamicOverflowEnabled = true 当屏幕尺寸不足以覆盖所有按钮时，自动将主要命令发送到溢出菜单。并应根据每个appbarButton上的 MediaTransportControlsHelper.DropoutOrder 属性将其删除。

I have a UWP app in which I am using CustomMediaTransportControls. within those controls I've added some extra buttons within the commandbar PrimaryCommands and have set IsDynamicOverflowEnabled=true according to the docs it should automatically send the primary commands to the overflow menu when the screen size is not enough for all the buttons. and it should drop them out according to MediaTransportControlsHelper.DropoutOrder property on each appbarButton.

问题

当屏幕尺寸较小时，控件似乎按预期进入了溢出菜单，但由于更多，我无法访问或看到它们按钮从不可见，这很奇怪，因为我尝试设置 OverflowButtonVisibility = visible 甚至使用 Auto 进行了尝试，但是该按钮从未显示用户界面。我知道主要命令将要溢出的事实是因为我从命令栏的模板化样式中明确地将more按钮设置为可见，然后在用户界面中看到了它，但没有之所以理想，是因为即使溢出中没有任何内容，它也会显示出来。因此，我将其更改为默认绑定值。

When screen size is less the controls seem to go into overflow menu as expected, but I cant access or see them because the More button is never visible, which is strange because I have tried to set OverflowButtonVisibility=visible and even tried it with Auto but that button never shows up on the UI. the fact that I know that primary commands are going to overflow is because I explicitly set the more button to visible, from within the templated style of the commandbar and then I see it in the UI, but its not ideal because it shows up even when it doesn't have anything in the overflow. so I changed it back to default binding value as it was before.

我还使用了重新模板化的命令栏样式，因为我想设置主绑定的horizo​​ntalAlignment

Also I am using re-templated style of the commandbar because I wanted to set the horizontalAlignment of the primary command buttons as center.

在第一张图片中，您可以看到所有控件都在显示

但是在这里，当我将窗口调整为较小的大小时，我看到的控件较少但是没有溢出菜单（更多）按钮。

还要注意，应用程序项目将创建者更新作为最低目标，因此DynamicOverflow应该可以正常运行，因为它是在周年更新中引入的。

Also note that app project has creators update as minimum target so DynamicOverflow should work because it was introduced in Anniversary update.

Upda te 1

在下面的图片中，您可以看到我在页面上添加了一个普通命令栏，即使没有溢出按钮，它也会显示更多按钮。

In the picture below you can see I added a normal command bar to the page and it shows the more button even when there is no overflow buttons. obviously it is shown for the labels I guess.

，在这里您可以看到在调整大小后，more按钮的确添加了多余的按钮。

and here you can see that upon resizing, the more button does get the extra buttons in it.

所以问题是，为什么它不能与MediaTransportControls命令栏一起使用？我什至尝试了没有任何自定义样式的默认transportcontrols，只是使用is..buttonvisible启用了它的所有按钮，我也遇到了同样的错误。以及在哪个阶段可以阻止此功能？

So the question is, why isn't it working with MediaTransportControls commandbar? I even tried default transportcontrols without any custom styling and just enabled all the buttons on it with is..buttonvisible and I got the same bug there as well. and which stage is this feature being prevented? and how can I override the behaviour?

使用Live属性浏览器，我可以确认更多按钮的可见性设置为折叠，如果我将其设置为可见，属性浏览器，我可以看到该按钮，现在我不明白的是它为什么会折叠？即使在我以xaml样式将overflowbuttonvisibility设置为可见的情况下？

With Live property explorer I can confirm that the visibility of more button is set to collapsed and if I set it to visible right there in property explorer I can see the button, now what I don't understand is why is it collapsed? even when I set overflowbuttonvisibility to visible in my xaml style?

推荐答案

在大量使用自定义控件后，我不得不动态地覆盖该行为并创建一些我自己的行为以使其起作用。

After a lot of playing with my custom control I had to dynamically override the behaviour and create a little of my own behaviour in order to make this work.

我在 Loaded 控件的事件

private void FluentMtc_Loaded(object sender, RoutedEventArgs e)
{
    //secondaryItemControl to check how many items are in overflow menu
    _secondarycontrols = (CommandBarOverflowPresenter)(((Popup)this.FindDescendantByName("OverflowPopup")).Child).FindDescendantByName("SecondaryItemsControl");
    //to toggle visibility of more button
    _moreButton = (Button)this.FindDescendantByName("MoreButton");
}

我订阅了 DynamicOverflowItemsChanging 我的自定义媒体传输控件的 OnApplyTemplate（）方法中的CommandBar事件。

And I subscribed to DynamicOverflowItemsChanging event of the CommandBar within my OnApplyTemplate() method of my custom media transport controls.

    protected override void OnApplyTemplate()
    {

        var barr = (CommandBar)GetTemplateChild("MediaControlsCommandBar");

        //the event to control the dynamicoverflow automatically.
        barr.DynamicOverflowItemsChanging += (s, e) =>
        {
            if (_secondarycontrols.Items.Count == 0 && e.Action == CommandBarDynamicOverflowAction.AddingToOverflow)
                _moreButton.Visibility = Visibility.Visible;
            else if (_secondarycontrols.Items.Count == 1 && e.Action == CommandBarDynamicOverflowAction.RemovingFromOverflow)
                _moreButton.Visibility = Visibility.Collapsed;
        };

        //base implementation
        base.OnApplyTemplate();
    }

您可以看到在事件中我动态检查了其中的项目数secondayoverflow菜单，并相应地控制more按钮的可见性。显然，这是一种解决方法，但如果有人找到MediaTransportControls命令栏为何存在此bug的正当理由，请务必在此帖子上发布另一个答案。

As you can see that within the event I dynamically check the number of items in secondayoverflow menu and control visibility of the more button accordingly. This is obviously a workaround, but if anyone find a proper reason as of why MediaTransportControls commandbar has this bug, please do post another answer on this post.

还要注意，FindDescendent方法来自 uwp社区工具包扩展 nuget程序包。

Also note that FindDescendent methods are coming from uwp community toolkit extensions nuget package.

这篇关于UWP命令栏的更多按钮未与DynamicOverflowEnabled一起显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！