如何在WPF中绘制“软”线（可能使用LinearGradientBrush）？

Question

无论斜率如何，我都试图绘制一条柔和边缘的线条。

这是我到目前为止的代码：

<Line   HorizontalAlignment="Stretch" VerticalAlignment="Center"
        Stretch="Uniform" StrokeThickness="5" X1="0" Y1="0" X2="1" Y2="0">
    <Shape.Stroke>
        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
            <GradientStop Color="Transparent" Offset="0" />
            <GradientStop Color="Green" Offset="0.5" />
            <GradientStop Color="Transparent" Offset="1" />
        </LinearGradientBrush>
    </Shape.Stroke>
</Line>

这对我来说很有意义，因为线条是水平的，线性渐变是垂直的，边缘是透明的，线条的中间是纯绿色。

结果令人愉快： 放大，这样你就可以看到渐变： http://img225.imageshack.us/img225/5027/horizontalsoftlinezoomeb.png

但是，当线不再是水平线时，渐变是基于线的边界矩形计算的，而不是根据线本身的几何形状计算的。结果是垂直阴影的斜线，而不是垂直于线的渐变：

有谁知道WPF如何处理软边缘？我在谷歌或MSDN上找不到任何东西，我知道有一种方法可以做到这一点......

Answer 1

好吧，我不知道这是否适用于您的场景，但您只需使用LayoutTransform旋转水平线，渐变就可以了。

<Line   HorizontalAlignment="Stretch" VerticalAlignment="Center"
    Stretch="Uniform" StrokeThickness="5" X1="0" Y1="0" X2="1" Y2="0">
<Shape.Stroke>
    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
        <GradientStop Color="Transparent" Offset="0" />
        <GradientStop Color="Green" Offset="0.5" />
        <GradientStop Color="Transparent" Offset="1" />
    </LinearGradientBrush>
</Shape.Stroke>
    <Line.LayoutTransform>
        <RotateTransform Angle="40"/>
    </Line.LayoutTransform>

Answer 2

尝试使用形状而不是线条

<Path Data="M0,0 L25,25 z" Fill="#FFF4F4F5" StrokeThickness="5" Canvas.Left="122" Canvas.Top="58">
<Path.Stroke>
    <LinearGradientBrush EndPoint="1.135,0.994" StartPoint="-0.177,-0.077">
        <GradientStop Color="Black"/>
        <GradientStop Color="#FF68A8FF" Offset="1"/>
    </LinearGradientBrush>
</Path.Stroke>

然而，

Answer 3

您可以通过增加厚度和减少颜色色调来堆叠许多路径，将一个路径绘制在另一个路径上。

对于具有相同几何的所有路径，您应该将Element Binding用于其中一个的Data属性。

如果需要，很可能一些代码隐藏对于动态生成路径和颜色渐变很有用。

Answer 4

你可以在'LinearGradientBrush'上设置MappingMode="Absolute"。然后您的画笔开始/结束坐标不是相对于边界框。当然，你必须紧缩一些三角函数来获得正确的分数......

https://docs.microsoft.com/en-us/dotnet/api/system.windows.media.gradientbrush.mappingmode?view=netframework-4.7.2#System_Windows_Media_GradientBrush_MappingMode