轮播视图中的中心项目答案

【问题标题】：center item in carouselView轮播视图中的中心项目
【发布时间】：2021-05-21 09:46:07
【问题描述】：

我正在努力让我的项目在轮播视图中居中，这听起来很简单，原因与项目总是在开始时开始的原因相同。我需要一次显示一个项目。

 <StackLayout  x:Name="innerStack"     
                  HorizontalOptions="CenterAndExpand">
        <Label Text="tesyt"
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand"></Label>
        <CarouselView HorizontalScrollBarVisibility="Never" BackgroundColor="Blue" 
              
                      x:Name="carousel" 
                      HorizontalOptions="CenterAndExpand"
                      VerticalOptions="CenterAndExpand"
                      HeightRequest="500"
                      
        >   <CarouselView.ItemsLayout>
                <LinearItemsLayout Orientation="Horizontal" ItemSpacing="0"/>
            </CarouselView.ItemsLayout>
          
            <CarouselView.ItemsSource    >
                <x:Array Type="{x:Type Label}">
                    <Label Text="tesyt" TextColor="Green" Margin="10,0,0,0"   
                     ></Label>
                    <Label Text="tesyt" TextColor="Brown"></Label>
                </x:Array>
            </CarouselView.ItemsSource>
        </CarouselView>
    
    </StackLayout>

【问题讨论】：

你试过SnapPoints吗？

标签： xamarin.forms

【解决方案1】：

我很难让我的项目在轮播视图中居中。

如果你想在carouselview中设置item center，你可以为carouselview datatemplate中的item设置HorizontalOptions="CenterAndExpand"和VerticalOptions="CenterAndExpand"。

我发现carouselview.itemsource有一些错误，你可以先参考x:Array markup extension，你也可以看看下面的代码：

<CarouselView
            x:Name="carousel"
            BackgroundColor="Blue"
            HeightRequest="500"
            HorizontalOptions="CenterAndExpand"
            HorizontalScrollBarVisibility="Never"
            VerticalOptions="CenterAndExpand">
            <CarouselView.ItemsLayout>
                <LinearItemsLayout ItemSpacing="20" Orientation="Horizontal" />
            </CarouselView.ItemsLayout>

            <CarouselView.ItemsSource>
                <x:Array Type="{x:Type x:String}">
                    <x:String>mono</x:String>
                    <x:String>monodroid</x:String>
                    <x:String>monotouch</x:String>
                    <x:String>monorail</x:String>
                    <x:String>monodevelop</x:String>
                    <x:String>monotone</x:String>
                    <x:String>monopoly</x:String>
                    <x:String>monomodal</x:String>
                    <x:String>mononucleosis</x:String>
                </x:Array>
            </CarouselView.ItemsSource>
            <CarouselView.ItemTemplate>
                <DataTemplate>
                    <StackLayout>
                        <Frame
                            Margin="20"
                            BorderColor="Red"
                            CornerRadius="5"
                            HasShadow="True"
                            HeightRequest="50"
                            HorizontalOptions="Center"
                            VerticalOptions="CenterAndExpand">
                            <Label
                                HorizontalOptions="CenterAndExpand"
                                Text="{Binding .}"
                                VerticalOptions="CenterAndExpand" />
                        </Frame>


                    </StackLayout>
                </DataTemplate>
            </CarouselView.ItemTemplate>
        </CarouselView>

【讨论】：