Xaml Xamarin表单中心集合查看内容
我有个问题。我创建了一个如下所示的页面: 现在我希望CollectionView的内容居中。我已经试过设置HorizontalOptions=Center,但没有成功 以下是该部分的代码:Xaml Xamarin表单中心集合查看内容,xaml,xamarin,xamarin.forms,xamarin.android,xamarin.ios,Xaml,Xamarin,Xamarin.forms,Xamarin.android,Xamarin.ios,我有个问题。我创建了一个如下所示的页面: 现在我希望CollectionView的内容居中。我已经试过设置HorizontalOptions=Center,但没有成功 以下是该部分的代码: <StackLayout HorizontalOptions="CenterAndExpand"> <CollectionView ItemsSource="{Binding coinDataList}" ItemsLayout="HorizontalList" Margin="0"
<StackLayout HorizontalOptions="CenterAndExpand">
<CollectionView ItemsSource="{Binding coinDataList}" ItemsLayout="HorizontalList" Margin="0" HorizontalOptions="CenterAndExpand" BackgroundColor="Red">
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid RowSpacing="0" Margin="20,0,20,0" HorizontalOptions="CenterAndExpand" Padding="0">
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="5" />
<RowDefinition Height="20" />
<RowDefinition Height="10" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Label Grid.Row="0" VerticalOptions="CenterAndExpand" HorizontalOptions="Center" Text="{Binding Coin}" FontAttributes="Bold" TextColor="#00D8FF" FontSize="18"/>
<Label Grid.Row="2" VerticalOptions="CenterAndExpand" HorizontalOptions="Center" Text="{Binding Price, StringFormat='{0:F2}'}" TextColor="White" FontSize="18"/>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
如何做到这一点?您可以通过将BindableLayout与水平方向的StackLayout结合使用来实现这一点。它的性能不如CollectionView,但从您的UI来看,ItemSource集合中似乎没有太多的项目,但当项目较少时,您需要UI是动态的、间隔均匀且居中的。随着项目列表的增长,UI将更像水平列表视图 因此,这里是最小的工作XAML,您可以修改它以适应您的项目。为了简单起见,我在XAML中添加了所有内容,没有代码隐藏,因此您可以将这个XAML直接插入内容页并进行测试
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:generic="clr-namespace:System.Collections.Generic;assembly=netstandard"
mc:Ignorable="d"
x:Class="Playground.MainPage">
<ContentPage.Resources>
<ResourceDictionary>
<generic:List x:Key="SymbolNames" x:TypeArguments="x:String">
<x:String>BTC</x:String>
<x:String>LTC</x:String>
<x:String>ETH</x:String>
<x:String>OT1</x:String>
<x:String>OT2</x:String>
<x:String>OT3</x:String>
<x:String>OT4</x:String>
<x:String>OT5</x:String>
<x:String>OT6</x:String>
</generic:List>
</ResourceDictionary>
</ContentPage.Resources>
<ScrollView Orientation="Horizontal" HeightRequest="60" VerticalOptions="Start">
<StackLayout BindableLayout.ItemsSource="{Binding Source={StaticResource SymbolNames}}" Orientation="Horizontal">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Label Text="{Binding}" HorizontalOptions="CenterAndExpand" VerticalOptions="Center" Margin="10"/>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</ScrollView>
</ContentPage>
3个项目时的UI:
多个溢出项时的UI:
随着项目数量的增加会发生什么?它怎么会居中呢?没想到xD。。。。你有什么建议吗?从概念上讲,我认为你不能将内容集中在滚动容器中-就像你不能将垂直列表垂直居中一样好吧,我在看旋转视图,但我有一个快速的问题。例如,是否可以同时显示3个项目?我不知道为什么不使用具有2列的垂直列表/集合?