Xamarin CarouselView PeekAreaInsets 和 LinearGradientBrush 不工作答案

【问题标题】：Xamarin CarouselView PeekAreaInsets and LinearGradientBrush not workingXamarin CarouselView PeekAreaInsets 和 LinearGradientBrush 不工作
【发布时间】：2022-11-25 08:25:07
【问题描述】：

PeekAreaInsets 是 Thickness 类型，我试图使轮播视图的横向项目具有更小的高度。但似乎声明 PeekAreaInsets="20,100" 不起作用。

此外，我正在尝试在项目的一半背景上声明渐变，但应用不正确。所以我在这里试图实现这个功能感到双重困惑......有没有人遇到过这个问题？谢谢大家

<CarouselView ItemsSource="{Binding ListOfGames}" PeekAreaInsets="20,100" HeightRequest="190" IsSwipeEnabled="True" Loop="True" >
                <CarouselView.ItemTemplate>
                    <DataTemplate>
                        <Frame Grid.Row="0" CornerRadius="10" Margin="0" Padding="0" HasShadow="False" HeightRequest="190" WidthRequest="340" BackgroundColor="Transparent">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*"/>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <Label Grid.Row="1" Text="{Binding Campaign}" FontFamily="Lato-Regular" FontSize="21" TextColor="White"/>
                                <Label Grid.Row="2" Text="{Binding Section}" FontFamily="Lato-Regular" FontSize="13" TextColor="White"/>
                            </Grid>
                            <Frame.Background>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                    <GradientStopCollection>
                                        <GradientStop Color="Transparent" Offset="0.5" />
                                        <GradientStop Color="#b3000000" Offset="1.0" />
                                    </GradientStopCollection>
                                </LinearGradientBrush>
                            </Frame.Background>
                        </Frame>
                    </DataTemplate>
                </CarouselView.ItemTemplate>
            </CarouselView>

【问题讨论】：

您只想将它应用于布局的一半，但实际上您显然是将它应用于整个布局的框架，对吗？
StartPoint=0,0 和 EndPoint=0,1 与 OffSet=0.5 属性相结合表示渐变垂直并从整个帧的 50% 开始，是的。但不知何故渐变不是线性渐变的颜色，它更像是一开始就变成灰色。
我认为您误解了这是如何工作的让我添加一个示例

标签： .net xamarin xamarin.forms lineargradientbrush xamarin.forms.carouselview

【解决方案1】：

我已经对其进行了测试，发现您的 PeekAreaInsets 属性默认使用值 20。不管怎样，CarouselView 的PeekAreaInsets 属性默认会使用一个参数，可能是因为CarouselView 中默认可见的相邻项是对称的，所以你可能需要这样设置一个值：

 <CarouselView ItemsSource="{Binding ListOfGames}"
          PeekAreaInsets="100">
...
 </CarouselView>

详情请参考文档：“https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/carouselview/layout#partially-visible-adjacent-items”。

【讨论】：

【解决方案2】：

所以基本上你误解了偏移的概念，当你设置一个 GradientStop 的偏移量时，它会立即开始与第一个 GradientStop 的颜色合并。

因此，例如以下面的代码为例：

<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
        <GradientStop Color="Blue"
                      Offset="0.5" />
        <GradientStop Color="Green"
                      Offset="0.7" />
        <GradientStop Color="Red"
                      Offset="1.0" />
</LinearGradientBrush>

因此，如果您看到上面的图像，它会立即开始与 0.5 和 0.7 处的颜色合并，这样您就可以让您的代码按照您想要的方式工作，在我看来，您的代码将如下所示：

   <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
        <GradientStop Color="Transparent"
                      Offset="0.5" />
        <GradientStop Color="Transparent"
                      Offset="0.6" />
        <GradientStop Color="#b3000000"
                      Offset="1.0" />
    </LinearGradientBrush>

【讨论】：