如何在 Xamarin Forms - Shell 中实现 MenuItem

Question

我正在编写一个应用程序，并希望在 shell 中实现两个 menuItems。 问题是我在启动应用程序时只是得到黑色背景。 非常感谢 ！！！

这是来自 Shell 的 XAML 文件：

<?xml version="1.0" encoding="utf-8" ?>
<Shell
    x:Class="MyApp.MainShell"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    BackgroundColor="#9da7d6"
    IconImageSource="NoWifiPic">

    <MenuItem Text="Rate" IconImageSource="RatingStar.png" Clicked="MenuItem_Clicked"/>
    <MenuItem Text="Support" IconImageSource="Feedback.png" Clicked="MenuItem_Clicked_1"/>

</Shell> 

这是 Shell 的代码文件：

public partial class MainShell : Shell
    {
        public MainShell()
        {
            InitializeComponent();
        }

      
      
        private void MenuItem_Clicked(object sender, EventArgs e)
        {
            //Code
        }

        private async void MenuItem_Clicked_1(object sender, EventArgs e)
        {
           //Code
        }
    }

这是来自 App 的代码文件：

public partial class App : Application
    {

        public App()
        {
            InitializeComponent();
            MainPage = new MainShell();
        }

        protected override void OnStart()
        {
         
        }

        protected override void OnSleep()
        {
          
        }

        protected override void OnResume()
        {
            
        }
    }

Answer 1

试试这个，它从Page1开始。 将其更改为您想要开始的您自己的页面。

<ShellItem Route="Startpage">
    <ShellContent ContentTemplate="{DataTemplate local:Page1}" Route="home" />
</ShellItem>

在此之后，您可以添加 MenuItems

 <ShellItem Route="Startpage">
<ShellContent ContentTemplate="{DataTemplate local:Page1}" Route="home" />
</ShellItem>

<MenuItem Text="Rate" IconImageSource="RatingStar.png" Clicked="MenuItem_Clicked"/>
<MenuItem Text="Support" IconImageSource="Feedback.png" Clicked="MenuItem_Clicked_1"/>

这里的文档https://docs.microsoft.com/nl-nl/xamarin/xamarin-forms/app-fundamentals/shell/

Answer 2

谢谢你的努力。 我的问题是我不仅有两个 MenuItems，而且还有一个重定向到主页的第三个按钮。 您的屏幕截图实际上正是我需要的，但目前还没有。 这是屏幕截图：

这是我的代码：

Shell xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:MyApp"
             x:Class="MyApp.MyShell">

    
       <ShellItem Route="Startpage">
        <ShellContent ContentTemplate="{DataTemplate local:MainPage}" Route="home"/>
    </ShellItem>
 

    <MenuItem Text="Rate" IconImageSource="RatingStar.png" Clicked="MenuItem_Clicked"/>

    <MenuItem Text="Support" IconImageSource="Feedback.png" Clicked="MenuItem_Clicked_1"/>

</Shell>

Answer 3

在 FlyoutItem 对象之前声明的任何 MenuItem 对象将出现在浮出控件中的 FlyoutItem 对象之前，在 FlyoutItem 对象之后声明的任何 MenuItem 对象将出现在浮出控件中的 FlyoutItem 对象之后。

我们不仅可以添加 MenuItem。 当您打开应用程序时，我们需要一个 ShellContent 来显示默认页面，但 MenuItem 除外。 但是我们可以像@Bas H所说的那样用FlyoutItemIsVisible属性隐藏它。

 <FlyoutItem FlyoutItemIsVisible="False"  x:Name="aboutItem">
    <ShellContent Title="Test2" ContentTemplate="{DataTemplate local:ItemsPage}"></ShellContent>
</FlyoutItem>
<MenuItem Text="Rate" IconImageSource="tab_about.png" Clicked="MenuItem_Clicked"/>
<MenuItem Text="Support" IconImageSource="tab_about.png" Clicked="MenuItem_Clicked"/>

如果您将FlyoutItemIsVisible设置为 false 并且仍将按钮视为屏幕截图，则可以尝试卸载并重新安装该应用程序。