点击导航栏中的barItem如何带来新的内容页面

Question

[![在此处输入图像描述][1]][1]这是主页面，它有一个包含 4 个 barItems 的导航栏。

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             Title="CheckList"
             x:Class="mmy.View.MainPage">    

    <ContentPage.ToolbarItems>
        <ToolbarItem Name="MenuItem1" Order="Primary"  Icon="itemIcon1.png" Priority="0" />
        <ToolbarItem Name="MenuItem2" Order="Primary"  Icon="itemIcon2.png" Priority="1" />
        <ToolbarItem Name="MenuItem1" Order="Primary"  Icon="itemIcon3.png" Priority="2" />
        <ToolbarItem Name="MenuItem2" Order="Primary"  Icon="itemIcon4.png" Priority="3" />

    </ContentPage.ToolbarItems>

    <ContentPage.Content>

        <StackLayout Orientation="Vertical">
            <Label Text="MainPage"/>             
        </StackLayout>        

    </ContentPage.Content>
</ContentPage>


  The Navigation Bar will look like below:

        -------------------------------------------------------
        Main      barItem1  |  barItem2  | barItem3 | barItem4
        -------------------------------------------------------

         Item1_Content

说，我在导航栏中有 4 个栏项

我想做以下事情：

1. 当用户点击 barItem2 时，

a) 它将引入一个 Item2_Content，它将替换 Item1_Content。 （我不确定是否有这样的用户界面）

b) barItem（1 到 4）仍然保留在导航栏中。

这可行吗？

你能帮我实现这样的用户需求吗？

谢谢

更新： --(1) - 从 P1 开始：

private async void BtnLogin_Clicked(object sender, EventArgs e)
{
  NavigationPage NP = new NavigationPage(new MainPage())
  {
       BarBackgroundColor = Color.White,
       BarTextColor = Color.DarkGray
 };
}

--(2) 我为 (3)

创建了一个新页面调用 RepairSvc

--(3) 在 MainPage : 它有一个来自 (1)

的导航栏

点击图标="itemIcon1.png"

   <ToolbarItem Name="MenuItem1" Order="Primary"  Icon="itemIcon1.png" Command="Item1Command" Priority="0" />

     Code Behind :

     [XamlCompilation(XamlCompilationOptions.Compile)]
        public partial class MainPage : ContentPage
        {
           public ICommand Item1Command { get; private set; }

            public MainPage()
            {
               InitializeComponent();

                this.Item1Command = new Command((sender) =>
                {
                    Navigation.PushAsync(new RepairSvc());
                });           
            }

        }

Answer 1

为您的工具栏分配一个命令

<ToolbarItem Name="MenuItem1" Order="Primary"  Icon="itemIcon1.png" Priority="0" Command="Item1Command" />

在你的代码隐藏中

   this.Item1Command = new Command((sender) =>
        {
            Navigation.PushAsync(new MyPage());
        });
    }

    public ICommand Item1Command { get; private set; }