xaml - 自定义 CommandBar 到 PickerFlyout

Question

默认情况下PickerFlyout，commandbar已经完成和取消按钮。是否可以以编程方式禁用完成按钮？如果没有，有没有办法添加自定义命令栏并替换默认命令栏？

在给出的答案的帮助下，我尝试从 PickerFlyoutBase 编写自定义选择器。但现在我无法在 xaml 中将内容添加到弹出窗口。给我错误说 custompicker 不支持直接内容

<Button>
     <Button.Flyout>
                        <local:custompicker>
                            <TextBlock Margin="20" FontSize="30" Text="MyPickerFlyout Test" />
                        </local:custompicker>

                    </Button.Flyout>
    </Button


 public class custompicker:PickerFlyoutBase
        {
            private AppBar OriginalAppBar;

        private CommandBar MyCommandBar;

        private Page CurrentPage;

        public custompicker()
        {
            var cancelButton = new AppBarButton();
            cancelButton.Icon = new SymbolIcon(Symbol.Cancel);
            cancelButton.Label = "Cancel";
            cancelButton.Click += (s, e) =>
            {
                this.Hide();
            };

            MyCommandBar = new CommandBar();
            MyCommandBar.PrimaryCommands.Add(cancelButton);

            this.Closed += MyPickerFlyout_Closed;
            this.Opening += MyPickerFlyout_Opening;
            this.Placement = Windows.UI.Xaml.Controls.Primitives.FlyoutPlacementMode.Full;
        }

        private void MyPickerFlyout_Opening(object sender, object e)
        {
            CurrentPage = (Windows.UI.Xaml.Window.Current.Content as Frame).Content as Page;
            if (CurrentPage != null)
            {
                OriginalAppBar = CurrentPage.BottomAppBar;

                CurrentPage.BottomAppBar = MyCommandBar;
            }
        }

        private void MyPickerFlyout_Closed(object sender, object e)
        {
            if (CurrentPage != null)
            {
                CurrentPage.BottomAppBar = OriginalAppBar;
            }
        }

        }

score 1 · Accepted Answer

PickerFlyout类有一个ConfirmationButtonsVisible 属性，我们可以使用这个属性来禁用“完成”和“取消”按钮。

但是没有办法只禁用“完成”按钮。我们必须实现一个自定义的“PickerFlyout”。下面是一个基于的简单自定义“PickerFlyout” Flyout，您可以参考它来实现自己的。

public class MyPickerFlyout : Flyout
{
    private AppBar OriginalAppBar;

    private CommandBar MyCommandBar;

    private Page CurrentPage;

    public MyPickerFlyout()
    {
        var cancelButton = new AppBarButton();
        cancelButton.Icon = new SymbolIcon(Symbol.Cancel);
        cancelButton.Label = "Cancel";
        cancelButton.Click += (s, e) =>
        {
            this.Hide();
        };

        MyCommandBar = new CommandBar();
        MyCommandBar.PrimaryCommands.Add(cancelButton);

        this.Closed += MyPickerFlyout_Closed;
        this.Opening += MyPickerFlyout_Opening;
        this.Placement = Windows.UI.Xaml.Controls.Primitives.FlyoutPlacementMode.Full;
    }

    private void MyPickerFlyout_Opening(object sender, object e)
    {
        CurrentPage = (Windows.UI.Xaml.Window.Current.Content as Frame)?.Content as Page;
        if (CurrentPage != null)
        {
            OriginalAppBar = CurrentPage.BottomAppBar;

            CurrentPage.BottomAppBar = MyCommandBar;
        }
    }

    private void MyPickerFlyout_Closed(object sender, object e)
    {
        if (CurrentPage != null)
        {
            CurrentPage.BottomAppBar = OriginalAppBar;
        }
    }
}

然后您可以在 XAML 中使用它，例如：

<Button Content="Show Picker">
    <Button.Flyout>
        <local:MyPickerFlyout Closed="PickerFlyout_Closed">
            <TextBlock Margin="20" FontSize="30" Text="MyPickerFlyout Test" />
        </local:MyPickerFlyout>
    </Button.Flyout>
</Button>

它看起来像：

xaml - 自定义 CommandBar 到 PickerFlyout

1 回答 1

Related

Reference