Question

如何在Xamarin Forms MenuItems中逐行分隔两个项目，如下图：

我的意思是，在相同的菜单项中，我想在两组项目之间画一条水平线（不是在每个项目和另一项之间，由SeparatorVisibility="Default"完成）。

这是cs代码：

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));
}}}}

这是Xaml代码：

<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

您的XAML代码将是这样的

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

在您的代码中，它应该像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

抱歉，我不好，您必须在列表视图中放置一个BoxView并设置其可见性，例如

<BoxView HeightRequest="1" Color="#00000" IsVisible="{Binding IsSeparatorVisible"/>并在例如您的标题到达时将其设为真收件箱。您可以通过循环创建的集合并在那里设置它来完成此操作。

Answer 3

我在这里搜索“如何在XAML代码中放置一条水平线？” 如果仅此而已，只需将其放入：

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

如何在Xamarin主菜单中的项目之间绘制水平线？

3 个答案: