How to implement MenuItem in Xamarin Forms - Shell

Issue

I am programming an app and would like to implement two menuItems within a shell. The problem is that I just get black background when I start the app. Thank you very much !!!

Here is the XAML File from Shell:

<?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> 

Here is the Code File from 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
        }
    }

Here is the Code File from App:

public partial class App : Application
    {

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

        protected override void OnStart()
        {
         
        }

        protected override void OnSleep()
        {
          
        }

        protected override void OnResume()
        {
            
        }
    }

Solution

Try this ,it is starting with Page1. Change it to your own page that you want to start with.

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

After this you can add the 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"/>

Here the documentation https://docs.microsoft.com/nl-nl/xamarin/xamarin-forms/app-fundamentals/shell/

If You want to hide the Startpage or HomePage button in the Flyout use this

FlyoutItemIsVisible="False" 

Add this to the ShellItem.

  <ShellItem Route="Startpage" FlyoutItemIsVisible="False" >
    <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"/>

Startpage :

Answered By - Bas H