在 UWP XAML 中动态绑定 NavigationViewItem && NavigationViewItemHeader

Question

我想在我的NavigationView 中动态填充NavigationViewItems 和NavigationViewItemHeaders。但是，我不能让它工作。看起来我的ListView只占用了一项的空间。如何动态创建新项目？

MainMenu.xaml

<NavigationView x:Name="NavViewTester"
                ItemInvoked="NavViewTester_ItemInvoked"Loaded="NavViewTester_Loaded" 
                IsPaneToggleButtonVisible="True" IsPaneOpen="True">
     <NavigationView.MenuItems>
         <NavigationViewItemHeader Content="My Books">
         </NavigationViewItemHeader>
     </NavigationViewItemHeader>  

         <Grid x:Name="BooksGrid">

            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"  />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="320" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <ListView
                x:Name="NavigationListView"
                Grid.Row="1"
                ItemTemplate="{StaticResource NavigationListViewItemTemplate}"
                ItemsSource="{x:Bind books.getBooks()}" 
                IsItemClickEnabled="True"
                ItemClick="NavigationListView_ItemClick"
                >
                <ListView.ItemContainerStyle>
                    <Style TargetType="ListViewItem">
                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                    </Style>
                </ListView.ItemContainerStyle>
            </ListView>

        </Grid>   
     </NavigationView.MenuItems>

我也尝试过NavigationViewList 而不是我的ListView，但它没有帮助。

Answer 1

但我也有一个 MenuItemHeader 使用你的后消失 解决方案

从列表中动态获取NavigationViewItem 和NavigationViewItemHeader。您需要将IEnumerable 类型设置为它们的基类NavigationViewItemBase。对我来说效果很好

<NavigationView  MenuItemsSource="{x:Bind Items,Mode=OneWay}"/>

//C#代码

 public sealed partial class MainPage : Page
 {
        public  IEnumerable<NavigationViewItemBase> Items { get; set; }
        private readonly NavigationViewItem Item1 = new NavigationViewItem() { Icon = new FontIcon() { Glyph = "\uEC06" }, Content = "Item1" };
        private readonly NavigationViewItem Item2 = new NavigationViewItem() { Icon = new FontIcon() { Glyph = "\uE13C" }, Content = "Item2" };
        private readonly NavigationViewItemHeader Header1 = new NavigationViewItemHeader() { Content = "Header1" };
        private readonly NavigationViewItem Item3 = new NavigationViewItem() { Icon = new FontIcon() { Glyph = "\uEC06" }, Content = "Item3" };
        private readonly NavigationViewItem Item4 = new NavigationViewItem() { Icon = new FontIcon() { Glyph = "\uE13C" }, Content = "Item4" };
        private readonly NavigationViewItemHeader Header2 = new NavigationViewItemHeader() { Content = "Header2" };
        public MainPage()
        {
            Items = GetItems();
            this.InitializeComponent();            
        }
        private IEnumerable<NavigationViewItemBase> GetItems()
        {
            yield return Header1;
            yield return Item1;
            yield return Item2;
            yield return Header2;
            yield return Item3;
            yield return Item4;
        }
  }

Answer 2

查看MenuItemsSource 依赖属性，它在NavigationView 类上定义。

MainPage.cs ：

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();

        myItems = new List<string> { "item1", "item2", "item3" };
    }

    List<string> myItems { get; set; }
}

MainPage.xaml:

<NavigationView
    x:Name="NavView"
    MenuItemsSource="{x:Bind myItems}">
</NavigationView>

为了简单起见，使用x:Bind进行绑定，使用默认的OneTime模式似乎比较合适。