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

问题描述

我有一个 UWP 应用，我在其中使用了 CustomMediaTransportControls.在这些控件中，我在命令栏中添加了一些额外的按钮 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 尝试过，但该按钮从未出现在 UI 上.我知道主要命令会溢出的事实是因为我从命令栏的 模板样式 中明确地将更多按钮设置为可见，然后我在 UI 中看到它，但它不是理想的，因为它即使在溢出中没有任何内容时也会出现.所以我把它改回了以前的默认绑定值.

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.

此外，我使用重新模板化的命令栏样式，因为我想将主要命令按钮的水平对齐设置为中心.

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.

更新 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 命令栏一起使用?我什至尝试了没有任何自定义样式的默认传输控件，并且只是使用 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?

使用实时属性浏览器，我可以确认更多按钮的可见性设置为折叠状态，如果我在属性浏览器中将其设置为可见，我可以看到该按钮，现在我不明白为什么它会折叠?即使我将溢出按钮可见性设置为在我的 xaml 样式中可见?

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 事件中得到了以下 2 个控件

I got following 2 controls in my Loaded event of the control

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");
}

并且我在我的自定义媒体传输控件的 OnApplyTemplate() 方法中订阅了 CommandBar 的 DynamicOverflowItemsChanging 事件.

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 菜单中的项目数，并相应地控制了更多按钮的可见性.这显然是一种解决方法，但如果有人找到 MediaTransportControls 命令栏出现此错误的正确原因，请在此帖子上发布另一个答案.

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屋！