如何在 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 並且仍將按鈕視為屏幕截圖，則可以嘗試卸載並重新安裝該應用程序。