在.net maui中,可用lineargradientbrush(设startpoint/endpoint)和radialgradientbrush(设center/radius)通过xaml配置渐变背景,支持background、shape.fill等属性,需至少一个gradientstop且可复用与调色。

在 .NET MAUI 中,用 GradientBrush(如 LinearGradientBrush 或 RadialGradientBrush)定义渐变背景非常直接,核心是设置好渐变方向、颜色节点和控件绑定位置。不需要写后台代码,XAML 就能完成全部配置。
LinearGradientBrush:从左到右的线性渐变
这是最常用的方式,适合按钮、卡片或页面背景。关键属性是 StartPoint 和 EndPoint,它们使用归一化坐标(0.0–1.0),左上角为 (0,0),右下角为 (1,1)。
- 水平渐变:设
StartPoint="0,0.5"、EndPoint="1,0.5" - 垂直渐变:设
StartPoint="0.5,0"、EndPoint="0.5,1" - 对角渐变:设
StartPoint="0,0"、EndPoint="1,1"
每个颜色停靠点用 GradientStop 定义,Offset 表示该颜色在渐变轴上的位置(0.0 = 起点,1.0 = 终点):
RadialGradientBrush:中心发散的径向渐变
适合营造光晕、焦点突出或拟物化效果。默认圆心在控件中心(0.5,0.5),半径按控件尺寸比例计算(最大值为 1.0)。
- 控制圆心:用
Center属性,例如Center="0.5,0.5" - 控制半径大小:用
Radius,例如Radius="0.8" - 颜色过渡逻辑与线性一致,
Offset="0.0"是圆心色,Offset="1.0"是边缘色
示例(柔和中心亮光):
哪里可以设置 GradientBrush?
所有支持 Brush 类型的属性都能用,常见位置包括:
-
VisualElement.Background(任意控件背景,如Grid、ContentPage、Button) -
Shape.Fill和Shape.Stroke(用于Rectangle、Ellipse等图形) -
Border.Background和Border.Stroke -
Shadow.Brush(给阴影上色,较少用但支持)
注意:Background 属性直接接受 Brush 实例,无需额外包装 —— XAML 解析器会自动识别并实例化。
小技巧和避坑提醒
实际用的时候容易忽略几个细节:
- 渐变不生效?检查是否漏了至少一个
GradientStop——IsEmpty为 true 时画笔无效 - 颜色太刺眼?建议选色差适中(比如 RGB 各通道变化在 50–150 区间),避免纯黑→纯白突变
- 想复用渐变?把
LinearGradientBrush定义在ResourceDictionary里,用{StaticResource MyGradient}引用 - 透明度要可控?十六进制颜色前两位就是 Alpha,例如
#80FF6A11表示半透橙红
基本上就这些。渐变本身不复杂,但配色和方向选对了,UI 的质感立刻不一样。










