关于Xamarin论坛的这个问题 https://forums.xamarin.com/discussion/20517/curved-corners-in-tableview-cells Craig Dunn教授如何用框架创建一个单元格。
我想在每个单元格之间添加空格。
目前,细胞似乎是胶合的,ViewCell
没有空间属性。
谢谢!
答案 0 :(得分:8)
您只需要进一步自定义MenuCell
的布局即可实现此目的。
下面显示的是一个版本,它使用另一个Xamarin.Forms.Frame
在每个项目之间创建一个间距,并进行其他一些修改: -
XAML页面: -
<ListView x:Name="lstItems" />
XAML代码隐藏: -
lstItems.ItemTemplate = new DataTemplate(typeof(Classes.MenuCell));
lstItems.ItemsSource = new string[] { "Apples", "Bananas", "Pears", "Oranges" };
ViewCell类: -
public class MenuCell : ViewCell
{
public MenuCell()
{
Label objLabel = new Label
{
YAlign = TextAlignment.Center,
TextColor = Color.Yellow,
};
objLabel.SetBinding(Label.TextProperty, new Binding("."));
StackLayout objLayout = new StackLayout
{
Padding = new Thickness(20, 0, 0, 0),
Orientation = StackOrientation.Horizontal,
HorizontalOptions = LayoutOptions.StartAndExpand,
Children = { objLabel }
};
Frame objFrame_Inner = new Frame
{
Padding = new Thickness(15, 15, 15, 15),
HeightRequest = 36,
OutlineColor = Color.Accent,
BackgroundColor = Color.Blue,
Content = objLayout,
};
Frame objFrame_Outer = new Frame
{
Padding = new Thickness(0, 0, 0, 10),
Content = objFrame_Inner
};
View = objFrame_Outer;
}
}
将导致以下结果: -
答案 1 :(得分:3)
我的xaml示例:
<ListView BackgroundColor="Gray" SeparatorVisibility="None" ItemsSource="{Binding Shipments}" x:Name="lstShipments" RowHeight="60">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Padding="0,0,0,1">
<Grid VerticalOptions="Fill" BackgroundColor="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="60"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Grid.Row="0" Text="{Binding DestinationCountry}" FontSize="16" />
<Image Grid.Column="1" Grid.Row="0" Source="box32.png" />
<Label Grid.Column="0" Grid.Row="1" Text="{Binding ExchangeOfficeDestinationTitle}" FontSize="16" />
<Label Grid.Column="1" Grid.Row="1" Text="{Binding ShipmentNum}" FontSize="10" />
</Grid>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>