SwiftUI(5)Gradient-渐变

线性渐变

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