wpf - 两端带有固定宽度渐变的 LinearGradientBrush

我想使用 LinearGradientBrush 用渐变填充 Canvas 上的矩形范围。问题是，无论矩形有多大，我都希望矩形两侧的渐变效果相同。

我想画的是这样的:

这是我的第一次尝试:

LinearGradientBrush brush = new LinearGradientBrush();
brush.SpreadMethod = GradientSpreadMethod.Reflect;
brush.GradientStops.Add(new GradientStop((Color)ColorConverter.ConvertFromString("#FF0000FF"), 0.0));
brush.GradientStops.Add(new GradientStop((Color)ColorConverter.ConvertFromString("#22FFFFFF"), 0.25));
brush.GradientStops.Add(new GradientStop((Color)ColorConverter.ConvertFromString("#22FFFFFF"), 0.75));
brush.GradientStops.Add(new GradientStop((Color)ColorConverter.ConvertFromString("#FF0000FF"), 1.00));
brush.StartPoint = new Point(0, 0);
brush.EndPoint = new Point(1, 0);

Rectangle rect = new Rectangle();
rect.Width = 100;
rect.Height = 100;
rect.Fill = brush;
Canvas.SetLeft(rect, 50);
Canvas.SetTop(rect, 50);
MyCanvas.Children.Add(rect);

Rectangle rect2 = new Rectangle();
rect2.Width = 300;
rect2.Height = 100;
rect2.Fill = brush;
Canvas.SetLeft(rect2, 50);
Canvas.SetTop(rect2, 200);
MyCanvas.Children.Add(rect2);

不太对；矩形越大，渐变出现的越宽:

我尝试将 MappingMode 设置为 Absolute，但这也不起作用。

LinearGradientBrush brush = new LinearGradientBrush();
brush.MappingMode = BrushMappingMode.Absolute;
brush.SpreadMethod = GradientSpreadMethod.Reflect;

brush.GradientStops.Add(new GradientStop((Color)ColorConverter.ConvertFromString("#FF0000FF"), 0.0));
brush.GradientStops.Add(new GradientStop((Color)ColorConverter.ConvertFromString("#22FFFFFF"), 0.25));

brush.StartPoint = new Point(0, 0);
brush.EndPoint = new Point(50, 0);   //I want the gradient to be across 50 pixels

Rectangle rect = new Rectangle();
//Everything else is the same

这给了我看起来像这样的东西:

这是很远的路。
有什么建议么？

最佳答案

实现此目的的一种方法是创建一个 custom control 。
在 Grid 上用 3 个矩形组合它；

1 列，50px 宽，矩形填充线性渐变

1 列“内容”矩形填充剩余部分

1 列，50px 宽，矩形填充线性渐变。

关于wpf - 两端带有固定宽度渐变的 LinearGradientBrush，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14962087/