XAML 在另一个线性渐变画笔上应用线性渐变画笔

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

我有一个这样的CSS:

background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), linear-gradient(0deg, #532EAB 0.47%, #8D44DE 47.92%, #B163FF 100%);

其在背景上应用两个线性梯度。
现在我想用<LinearGradientBrush>在WPF上实现这一点。
我尝试的是把所有的<GradientStop>加到一个<LinearGradientBrush>里面,这样只给了我一个渐变错误的图层。

<Setter Property="Background">
    <Setter.Value>
        <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
            <GradientStop Offset="0" Color="#532EAB"/>
            <GradientStop Offset="0.4792" Color="#8D44DE"/>
            <GradientStop Offset="1" Color="#B163FF"/>
            <GradientStop Color="#33000000" Offset="0" />
            <GradientStop Color="#33000000" Offset="1" />
            <LinearGradientBrush.RelativeTransform>
                <TransformGroup>
                    <RotateTransform Angle="-90" CenterY="0.5" CenterX="0.5"/>
                </TransformGroup>
            </LinearGradientBrush.RelativeTransform>
        </LinearGradientBrush>
    </Setter.Value>
</Setter>

对于WPF中类似于上述css的背景,有没有解决方案?

mjqavswn

mjqavswn1#

要合并两个或多个渐变笔刷,你可以使用嵌套网格的VisualBrush,你可以为每个网格设置Background。你还需要设置VisualBrush中元素的大小。半透明笔刷必须在最里面的网格旁边。
您的CSS可能如下所示:

<VisualBrush xmlns:PresentationOptions="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options" PresentationOptions:Freeze="true">
    <VisualBrush.Visual>
        <Grid
                Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Mode=OneWay}" 
                Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Mode=OneWay}">
            <Grid.Background>
                <LinearGradientBrush StartPoint="0.5,1" EndPoint="0.5,0" PresentationOptions:Freeze="true">
                    <GradientStop Offset="0" Color="#532EAB"/>
                    <GradientStop Offset="0.0047" Color="#532EAB"/>
                    <GradientStop Offset="0.4792" Color="#8D44DE"/>
                    <GradientStop Offset="1" Color="#B163FF"/>
                </LinearGradientBrush>
            </Grid.Background>
            <Grid>
                <Grid.Background>
                    <LinearGradientBrush StartPoint="0.5,1" EndPoint="0.5,0" PresentationOptions:Freeze="true">
                        <GradientStop Color="#33000000" Offset="0"/>
                        <GradientStop Color="#33000000" Offset="1" />
                    </LinearGradientBrush>
                </Grid.Background>
            </Grid>
        </Grid>
    </VisualBrush.Visual>                
</VisualBrush>

相关问题