如何在WPF中实现与图片效果一致的渐变画刷?(附WinForm实现参考代码)
匹配WinForm PathGradientBrush效果的WPF RadialGradientBrush实现
首先,咱们先明确你WinForm代码的核心渐变逻辑:
你用PathGradientBrush实现的是从矩形右下角的中心颜色(应该是红色,从你的WPF代码推测),平滑过渡到矩形四个边缘的黑色的效果——中心点严格落在矩形的右下角,渐变覆盖整个矩形区域。
接下来看你当前的WPF代码,方向是对的,但几个关键参数需要调整才能完全对齐WinForm的效果:
- 中心点与渐变原点:WinForm里的
CenterPoint = new PointF(x2, y2)是矩形的右下角,对应WPFRelativeToBoundingBox模式下的坐标(1, 1),而不是你设置的(0.7, 0.7) - 半径范围:如果把
RadiusX和RadiusY设为0.7,渐变只会覆盖矩形的一部分。要让渐变覆盖从右下角到左上角的整个矩形,需要把半径设为√2(约1.414)——这是相对模式下矩形对角线长度的一半,刚好能覆盖整个区域 - 渐变停止的对应关系:保持红色在渐变起始位置(偏移0),黑色在结束位置(偏移1),对应WinForm的
CenterColor和SurroundColors
调整后的完整代码如下:
// 构建渐变停止点:中心红色,边缘黑色 var gradientStops = new GradientStopCollection { new GradientStop(Colors.Red, 0), new GradientStop(Colors.Black, 1) }; // 创建径向渐变画刷,匹配WinForm效果 var brush = new RadialGradientBrush(gradientStops) { MappingMode = BrushMappingMode.RelativeToBoundingBox, // 中心和渐变原点都设为右下角,对应WinForm的CenterPoint(x2,y2) Center = new Point(1, 1), GradientOrigin = new Point(1, 1), // 半径设为√2,确保渐变覆盖整个矩形 RadiusX = Math.Sqrt(2), RadiusY = Math.Sqrt(2), // 保持默认SpreadMethod=Pad,和WinForm PathGradientBrush的行为一致 SpreadMethod = GradientSpreadMethod.Pad };
额外说明
如果你的场景需要使用绝对坐标(而非相对模式),只需要做以下调整:
- 将
MappingMode改为BrushMappingMode.Absolute - 将
Center和GradientOrigin设为矩形的右下角绝对坐标:new Point(x2, y2) - 将
RadiusX和RadiusY设为矩形对角线长度的一半:Math.Sqrt(Math.Pow(x2 - x1, 2) + Math.Pow(y2 - y1, 2)) / 2
这样就能完全复现你WinForm代码中的渐变效果啦~
内容的提问来源于stack exchange,提问作者genesis5068
相关产品推荐
相关产品推荐

