Xamarin.Forms多列表GUI

Question

ListView是创建表的正确选项，类似这样？

单元格的内容是纯文本，但我需要能够显示类似的下拉菜单中的细胞接触与几个最常用的选项和文本字段的自定义项。 最多有80到100行数据，通常少得多。

Answer 1

ListView确实是近似表格的最佳方法。下面是一个例子...

 <ListView x:Name="listViewm" ItemsSource="{Binding MyItems}"> 
      <ListView.Header> 
       <Grid BackgroundColor="Black"> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="1*"></ColumnDefinition> 
         <ColumnDefinition Width="1*"></ColumnDefinition> 
         <ColumnDefinition Width="1*"></ColumnDefinition> 
         <ColumnDefinition Width="1*"></ColumnDefinition> 
        </Grid.ColumnDefinitions> 
        <Label Text="Switch" HorizontalOptions="Fill" Grid.Column="0" FontSize="Medium" FontAttributes="Bold" BackgroundColor="MediumBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/> 
        <Label Text="Addend 1" HorizontalOptions="Fill" Grid.Column="1" FontSize="Medium" FontAttributes="Bold" BackgroundColor="MediumBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/> 
        <Label Text="Addend 2" HorizontalOptions="Fill" Grid.Column="2" FontSize="Medium" FontAttributes="Bold" BackgroundColor="MediumBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/> 
        <Label Text="Result" HorizontalOptions="Fill" Grid.Column="3" FontSize="Medium" FontAttributes="Bold" BackgroundColor="MediumBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/> 
       </Grid> 
      </ListView.Header> 

      <ListView.ItemTemplate> 
       <DataTemplate> 
        <ViewCell> 
         <Grid BackgroundColor="Black"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="1*"></ColumnDefinition> 
           <ColumnDefinition Width="1*"></ColumnDefinition> 
           <ColumnDefinition Width="1*"></ColumnDefinition> 
           <ColumnDefinition Width="1*"></ColumnDefinition> 
          </Grid.ColumnDefinitions> 
          <Label Grid.Column="0" Text ="{Binding Switch}" HorizontalOptions="Fill" BackgroundColor="LightBlue" HorizontalTextAlignment="Center" Margin="1"></Label> 
          <Label Grid.Column="1" Text ="{Binding Addend1}" HorizontalOptions="Fill" BackgroundColor="LightBlue" HorizontalTextAlignment="Center" Margin="1"></Label> 
          <Label Grid.Column="2" Text ="{Binding Addend2}" HorizontalOptions="Fill" BackgroundColor="LightBlue" HorizontalTextAlignment="Center" Margin="1"></Label> 
          <Label Grid.Column="3" Text ="{Binding Result}" HorizontalOptions="Fill" BackgroundColor="LightBlue" HorizontalTextAlignment="Center" Margin="1"></Label> 
         </Grid> 
        </ViewCell> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 

这是在视图模型的代码...

public class MyItem : INotifyPropertyChanged 
{ 
    bool _switch = false; 
    public bool Switch 
    { 
     get 
     { 
      return _switch; 
     } 
     set 
     { 
      if (_switch != value) 
      { 
       _switch = value; 
       PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Switch")); 
      } 
     } 

    } 
    public int Addend1 { get; set; } 
    public int Addend2 { get; set; } 
    public int Result 
    { 
     get 
     { 
      return Addend1 + Addend2; 
     } 
    } 
    public string Summary 
    { 
     get 
     { 
      return Addend1 + " + " + Addend2 + " = " + Result; 
     } 
    } 
    public event PropertyChangedEventHandler PropertyChanged; 
} 

// ...

public MyItems ObservableCollection<MyItem> { get; set; } 

// ...

 MyItems = new ObservableCollection<MyItem>(); 
     MyItems.Add(new MyItem() { Switch = true, Addend1 = 1, Addend2 = 2 }); 
     MyItems.Add(new MyItem() { Switch = false, Addend1 = 1, Addend2 = 2 }); 
     MyItems.Add(new MyItem() { Switch = true, Addend1 = 2, Addend2 = 3 }); 
     MyItems.Add(new MyItem() { Switch = false, Addend1 = 2, Addend2 = 3 }); 

这会导致一张表看起来像这样...

不知道为什么列之间的排水沟是如此之广。

您可以在ViewCell.ContextActions上定义菜单项。