如何调整网格中CarouselView的大小?

问题描述

我有一个网格。一行是CarouselView。

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