在 UWP 中将 Obserable 集合绑定到 MenuFlyoutSubItem [英] Bind Obserable Collection to MenuFlyoutSubItem in UWP

问题描述

目前我得到属性Items"没有可访问的 setter.如何修改此控件以允许我将集合绑定到它，并且可能只是将集合中对象的属性设置为项目的文本属性?

Currently I get "The property "Items" does not have an accessible setter." How could I modify this control to allow me to bind a collection to it and maybe just set on of the properties of the objects in the collection to the text property of the items?

        <AppBarButton x:Name="Button" Icon="Add" Label="stuff">
            <AppBarButton.Flyout>
                <MenuFlyout>
                    <MenuFlyoutItem Text="b1" ></MenuFlyoutItem>
                    <MenuFlyoutItem Text="b2" ></MenuFlyoutItem>
                    <MenuFlyoutItem Text="b3" ></MenuFlyoutItem>
                    <MenuFlyoutItem Text="b4" ></MenuFlyoutItem>
                    <MenuFlyoutItem Text="b5" ></MenuFlyoutItem>
                    <MenuFlyoutSubItem x:Name="bb1" Items="{Binding MyList}" />
                </MenuFlyout>
            </AppBarButton.Flyout>
        </AppBarButton>

推荐答案

您不能这样做.如果您查看文档，你会看到Items只有一个getter，所以不能给它设置collection.您可以获取集合引用，然后例如向其中添加 项，但在显示浮出控件之前，这似乎一直有效.之后没有应用任何更改(尽管我现在没有太多时间来玩它).这是一些代码，我在其中尝试了一些带有附加属性的内容:

You cannot do this. If you take a look at documentation, you will see that Items has only a getter, so cannot set collection to it. You can get collection reference and then for example Add items to it, but it seems that this works until the flyout is shown. After that no changes are applied (though I don't have much time now to play with it). Here is some code, where I've tried something with attached property:

<StackPanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Button Content="click">
        <Button.Flyout>
            <MenuFlyout>
                <MenuFlyoutItem Text="b1"/>
                <MenuFlyoutItem Text="b2"/>
                <MenuFlyoutSubItem Name="mysub" local:MenuExtension.MyItems="{Binding Options}" Text="Choosable items"/>
            </MenuFlyout>
        </Button.Flyout>
    </Button>
    <Button Content="modify" Click="Button_Click"/>
</StackPanel>

public static class MenuExtension
{
    public static List<MenuFlyoutItem> GetMyItems(DependencyObject obj)
    { return (List<MenuFlyoutItem>)obj.GetValue(MyItemsProperty); }

    public static void SetMyItems(DependencyObject obj, List<MenuFlyoutItem> value)
    { obj.SetValue(MyItemsProperty, value); }

    public static readonly DependencyProperty MyItemsProperty =
        DependencyProperty.Register("MyItems", typeof(List<MenuFlyoutItem>), typeof(MenuExtension),
        new PropertyMetadata(new List<MenuFlyoutItem>(), (sender, e) =>
        {
            Debug.WriteLine("Filling collection");
            var menu = sender as MenuFlyoutSubItem;
            menu.Items.Clear();
            foreach (var item in e.NewValue as List<MenuFlyoutItem>) menu.Items.Add(item);
        }));
}

public sealed partial class MainPage : Page,INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;
    public void RaiseProperty(string name) => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));

    public List<MenuFlyoutItem> Options { get; set; } = new List<MenuFlyoutItem>
    {
        new MenuFlyoutItem {Text="Start item" },
        new MenuFlyoutItem {Text="Start item" },
        new MenuFlyoutItem {Text="Start item" }
    };

    public MainPage()
    {
        this.InitializeComponent();
        DataContext = this;
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        Options = new List<MenuFlyoutItem> { new MenuFlyoutItem { Text = "Modified" } };
        RaiseProperty(nameof(Options));
//      mysub.Items.Add(new MenuFlyoutItem { Text = "modified" }); // even this cannot be done
    }
} 

也许你可以玩一些模板，绑定按钮然后交换整个弹出窗口，或者尝试不同的东西

Maybe you can play with some templates, bind in button and then exchange the whole flyout, or try something different

这篇关于在 UWP 中将 Obserable 集合绑定到 MenuFlyoutSubItem的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！