问题描述
<Grid Margin="0,20,0">
<Grid.RowDeFinitions>
<RowDeFinition />
</Grid.RowDeFinitions>
<Grid.ColumnDeFinitions>
<ColumnDeFinition Width="130"/>
<ColumnDeFinition/>
</Grid.ColumnDeFinitions>
<CarouselView x:Name="GamesCarouselView" Margin="25,5,0" HeightRequest="120" Grid.ColumnSpan="2" >
<CarouselView.ItemsLayout>
<LinearItemsLayout Orientation="Horizontal"/>
</CarouselView.ItemsLayout>
<CarouselView.ItemTemplate>
<DataTemplate>
<ImageButton BackgroundColor="#fafafa" Source="{Binding .}" CornerRadius="13" BorderColor="#1976d3" BorderWidth="4"/>
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
</Grid>
CarouselView中照片的宽度占据了屏幕的整个长度。我该如何调整大小?
解决方法
在DataTemplate中使用网格(或所需的布局),然后添加具有所需对齐方式和尺寸的Image / ImageButton:
<Grid Margin="0,20,0">
<Grid.RowDefinitions>
<!--One RowDefinition in * si useless by the way -->
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="130"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<CarouselView x:Name="GamesCarouselView" Margin="25,5,0" HeightRequest="120" Grid.ColumnSpan="2" >
<CarouselView.ItemsLayout>
<LinearItemsLayout Orientation="Horizontal"/>
</CarouselView.ItemsLayout>
<CarouselView.ItemTemplate>
<DataTemplate>
<Grid>
<ImageButton HorizontalOptions="Center" WidthRequest="100" BackgroundColor="#fafafa" Source="{Binding .}" CornerRadius="13" BorderColor="#1976d3" BorderWidth="4"/>
</Grid>
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
</Grid>