线性渐变
RoundedRectangle(cornerRadius: 10)
.fill(
// 线性渐变 colors 色值 数组 startPoint启点 endPoint 终点 [ leading:左 trailing:右 top:上 bottom:下 topLeading:左上 topTrailing:右上 bottomTrailing:左下 bottomLeading:右下
LinearGradient(colors: [Color.blue,Color.red,Color.orange], startPoint: .leading, endPoint: .trailing)
)
.frame(width: 300, height: 200)
image.png
圆形渐变
左上为起点
// 圆形渐变 center 中心点
RoundedRectangle(cornerRadius: 10)
.fill(
RadialGradient(colors: [Color.blue,Color.red], center: .topLeading, startRadius:100, endRadius: 300)
)
.frame(width: 300, height: 200)
image.png
// 角度渐变
RoundedRectangle(cornerRadius: 10).fill(
AngularGradient(colors: [Color.blue,Color.red], center: .center,angle: .degrees(90))
).frame(width: 300,height: 200)
image.png
