xamarin forms 主细节。 单击图标工具栏项时如何突出显示不同的菜单标题

Question

我已经在跨平台 xamarin forms 开始了一个新项目，我选择了“master-detail”作为模板。 因此，您可以在 MainPage.xaml 上看到模板，屏幕左侧的菜单使用“MenuPage”，主要内容使用“产品”。

   <MasterDetailPage.Master>
    <views:MenuPage />
</MasterDetailPage.Master>

<MasterDetailPage.Detail>
    <NavigationPage>
        <NavigationPage.Icon>
            <OnPlatform x:TypeArguments="FileImageSource">
                <On Platform="iOS" Value="tab_feed.png"/>
            </OnPlatform>
        </NavigationPage.Icon>
        <x:Arguments>
            <views:Product />
        </x:Arguments>
    </NavigationPage>
</MasterDetailPage.Detail>

使用左侧菜单选项的导航都按计划进行。 但是，我已将购物车图像添加到产品页面上的工具栏项。

 <ContentPage.ToolbarItems>
    <ToolbarItem Name="ImageShoppingCart" Icon="shoppingcart.png" Priority="0" Order="Primary" Activated="ShoppingCartIs_Clicked"/>
    </ContentPage.ToolbarItems>

因此，从产品页面中，是否可以模拟单击 MenuPage 中列表视图上的“购物”

<StackLayout VerticalOptions="FillAndExpand">
    <ListView x:Name="ListViewMenu" HasUnevenRows="True">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Label Text="{Binding Title}" FontSize="20" Grid.Column="1"  Grid.Row="0"/>
                    </Grid>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</StackLayout>

我问这个是因为我在 product.cs 页面上尝试过解决方法单击购物车时调用 ShoppingCartIs_Clicked ：

   private async void ShoppingCartIs_Clicked(object sender, EventArgs e)
        {
            await RootPage.NavigateFromMenu(1);//1 being the id of shopping cart, which is then used to create a new Navigation page(shopping cart) and set master 'Detail' to this page
        }

所以。 这有效并显示了购物车页面。 但是，当您单击左侧的菜单时。 菜单上第一个选项的原始“产品”仍然突出显示。 那么如何在菜单上突出显示购物车标题呢？ 我是否以某种方式使菜单页面上的列表视图成为全局并在产品页面上调用它？

 ListViewMenu.SelectedItem = menuItems[1];

这可能已经结束了，但我已经设置了一个全局变量“newPage”，如果它是在 Menupage 中设置的，那么设置 selectedItem

 private async void ShoppingCartIs_Clicked(object sender, EventArgs e)
    {

        App.NewPageToLoad = "Shopping";
        MenuPage tempMenu = new MenuPage();
        await RootPage.NavigateFromMenu(1);
    }

//然后在menyuPage

if (App.NewPageToLoad != null)
        {
            if (App.NewPageToLoad.Contains("Shopping"))
            {

                ListViewMenu.SelectedItem = menuItems[1];
            }
        }

这不会突出显示菜单列表上的“购物”图标。

有没有更简单的方法来做到这一点？ 谢谢

更新感谢@Junior 的帮助，但不幸的是我们还没有到那里。 我已经尝试了您的建议，但没有奏效。

所以我尝试使用ListViewMenu.SelectedItem = menuItems[1];' 进行测试以在应用程序初始加载时手动将“购物”设置为选中，这可以正常工作...但是我尝试按照您在 Flayout(MenuPage) 上的建议重新分配它，但它尚未在应用程序上更新。

另外值得注意的是，作为重新加载 MenuPage 时的测试，我将 ListView 更改为使用新列表“menuItems2”填充，其中我将标题更改为包含“2”，但是当应用程序加载时，它显示了上一个列表。 所以看起来 ListView 在加载新的 MenuPage 时没有正确填充？ 这可以解释为什么ListViewMenu.SelectedItem = menuItems[3]; 菜单上没有突出显示不同的标题？ 尽管代码如此不确定为什么它不起作用。 还以为我可能需要重置母版页，这会重新加载它，这也不起作用谢谢你到目前为止的帮助

menuItems2 = new List<HomeMenuItem>
            {
                new HomeMenuItem {Id = MenuItemType.Products, Title="Products 2", Icon =  "back_nav.png", Name = "test" },
                new HomeMenuItem {Id = MenuItemType.Shopping, Title="Shopping Cart 2", Icon =  "back_nav.png"},
                new HomeMenuItem {Id = MenuItemType.Browse, Title="Browse 2", Icon =  "back_nav.png"},
                new HomeMenuItem {Id = MenuItemType.About, Title="About 2", Icon =  "back_nav.png"},
            };

                    ListViewMenu.ItemsSource = menuItems2;  
ListViewMenu.SelectedItem = menuItems[3];

Answer 1

好的，您可以使用MessagingCenter将所需的弹出项发送到Flayout页面。

在产品页面发送消息：

MessagingCenter.Send<object,int>(this, "Hi", (int)MenuItemType.About);

在Flayout页面中接收消息：

MessagingCenter.Subscribe<object,int>(this, "Hi", (senders,arg) =>
{
    ListViewMenu.SelectedItem = menuItems[arg];
});

此外，只有使用它才能将页面从产品导航到购物车。

以上示例代码基于此示例项目。

效果：