Xamarin表单-使用渐变从ShadowView中删除条带

p8h8hvxi  于 2023-03-16  发布在  其他
关注(0)|答案(1)|浏览(98)


我在我的应用程序中有一个阴影视图,我已经尝试使用LinearGradient实现它,如下所示。

<LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
      <GradientStop Color="#D7D7DA" Offset="0.05"/>      
      <GradientStop Color="#D7D7D9" Offset="0.1"/>       
      <GradientStop Color="#D8D8DA" Offset="0.40"/>       
      <GradientStop Color="#DBDBDD" Offset="0.45"/>       
      <GradientStop Color="#DDDDDF" Offset="0.50"/>       
      <GradientStop Color="#DFDFE1" Offset="0.55"/>       
      <GradientStop Color="#E0E0E2" Offset="0.60"/>       
      <GradientStop Color="#E4E4E6" Offset="0.65"/>       
      <GradientStop Color="#E6E6E8" Offset="0.70"/>       
      <GradientStop Color="#E9E9EB" Offset="0.75"/>       
      <GradientStop Color="#ECECEE" Offset="0.80"/>       
      <GradientStop Color="#EEEEF0" Offset="0.85"/>       
      <GradientStop Color="#F4F4F6" Offset="0.95"/>       
      <GradientStop Color="Transparent" Offset="1.0"/>    
</LinearGradientBrush>

即使在遵循上述多个梯度的方法之后,我们仍然可以看到一些水平线出现。
除了用更多的渐变打破视图样式之外,还有什么平滑过渡的想法吗?
我已经应用了上述(多重梯度停止),条带减少到一定程度,但仍然存在。我想实现平滑过渡,从顶部到底部没有条带线。

dtcbnfnu

dtcbnfnu1#

您可以使用以下代码:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="forms.MainPage">
    <StackLayout>
        <Frame BorderColor="Transparent" 
               HeightRequest="200" 
               WidthRequest="500">
            <Frame.Background>
                <LinearGradientBrush EndPoint="0,1">
                    <GradientStop Color="#D7D7DA" Offset="0.05" />
                    <GradientStop Color="Transparent" Offset="1.0" />
                </LinearGradientBrush>
            </Frame.Background>
        </Frame>
    </StackLayout>
</ContentPage>

效果很好,另外你可以去掉BorderColor="Transparent"来看框架的边框,加上BackgroundColor="Tan"来看shadowview的效果:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="forms.MainPage" 
             BackgroundColor="tan">

相关问题