How to draw a Horizontal line between items in Xamarin master menu?

Question

How to separate two items by line in Xamarin Forms MenuItems like this pic:

I mean, in the same menu items, I want to draw a horizontal line between two groups of items (not between every item and the other, which done by SeparatorVisibility="Default").

Here is cs code:

using System;
using Xamarin.Forms;
namespace GMG
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class MasterDetailPage1Master : ContentPage
    {
        public ListView ListView;
        public MasterDetailPage1Master()
        {
            InitializeComponent();
            BindingContext = new MasterDetailPage1MasterViewModel();
            ListView = MenuItemsListView;
        }
        class MasterDetailPage1MasterViewModel : INotifyPropertyChanged
        {
            public ObservableCollection<MasterDetailPage1MenuItem> MenuItems { get; set; }
            public MasterDetailPage1MasterViewModel()
            {
                MenuItems = new ObservableCollection<MasterDetailPage1MenuItem>(new[]
                {
                    new MasterDetailPage1MenuItem { Id = 0, Title = "Hospitals", Icon="hosp.png", TargetType= typeof(Hospitals) },
                    new MasterDetailPage1MenuItem { Id = 1, Title = "Clinics", Icon="cli.png",TargetType= typeof(Clinics) },
                    new MasterDetailPage1MenuItem { Id = 2, Title = "Pharmacies", Icon="pha.png", TargetType= typeof(Pharma) },
                    new MasterDetailPage1MenuItem { Id = 3, Title = "Labs", Icon="lab2.png", TargetType= typeof(Labs) },
                    new MasterDetailPage1MenuItem { Id = 4, Title = "MainPage",  Icon="home.png", TargetType= typeof(MasterDetailPage1Detail) },
                    new MasterDetailPage1MenuItem { Id = 5, Title = "Call us",  Icon="cont.png" },
                    new MasterDetailPage1MenuItem { Id = 6, Title = "Rating App",  Icon="rate.png" },

                });
            }
            #region INotifyPropertyChanged Implementation
            public event PropertyChangedEventHandler PropertyChanged;
            void OnPropertyChanged([CallerMemberName] string propertyName = ""){
                if (PropertyChanged == null)
                    return;
                PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName));
}}}}

This is Xaml Code:

<StackLayout>
        <StackLayout>
            <Label Text="GMG"/>
        </StackLayout>
        <ListView x:Name="MenuItemsListView"
                  RowHeight="55"
                  ItemsSource="{Binding MenuItems}">
      <ListView.ItemTemplate>
        <DataTemplate>
          <ViewCell>
            <StackLayout>
              <Label Text="{Binding Title}"/>
                <Image Source="{Binding Icon}"/>
            </StackLayout>             
          </ViewCell>         
        </DataTemplate>
      </ListView.ItemTemplate>
    </ListView>      
  </StackLayout>
</ContentPage>

Answer 1

Your XAML code will be something like this

<StackLayout>
    <StackLayout>
        <Label Text="GMG"/>
    </StackLayout>
    <ListView x:Name="MenuItemsListView"
              RowHeight="55"
              ItemsSource="{Binding MenuItems}">
  <ListView.ItemTemplate>
    <DataTemplate>
      <ViewCell>
<StackLayout Orientation="Vertical">
        <StackLayout Orientation="Horizontal">
          <Label Text="{Binding Title}"/>
            <Image Source="{Binding Icon}"/>
        </StackLayout>
<BoxView HeightRequest="1" Color="#00000" IsVisible="{Binding IsSeparatorVisible}"/>
</StackLayout>              
      </ViewCell>         
    </DataTemplate>
  </ListView.ItemTemplate>
 </ListView>      
</StackLayout>

And in your code it should be like set the IsSeparatorVisible to true/false for showing/hiding the line

    new MasterDetailPage1MenuItem { Id = 0, Title = "Hospitals", Icon="hosp.png",IsSeparatorVisible = true, TargetType= typeof(Hospitals) },
                new MasterDetailPage1MenuItem { Id = 1, Title = "Clinics", Icon="cli.png",IsSeparatorVisible = false,TargetType= typeof(Clinics) },

Answer 2

I got here searching, "How to put a horizontal line in my XAML code?" If that's all you want, just put this in:

               <BoxView 
                   HeightRequest="1"
                   Color="LightGray"
                   Margin ="40, 0, 40, 0"/>

Answer 3

Sorry my bad, you have to put a BoxView inside the listview and set its visibility e.g.

<BoxView HeightRequest="1" Color="#00000" IsVisible="{Binding IsSeparatorVisible"/> and make it true when for example your title reached e.g. Inbox. You can do this by looping through the collection you have created and set it there.