zoukankan      html  css  js  c++  java
  • SwiftUI 渐变色

    • 渐变探索
    // 线性渐变
    LinearGradient(gradient: Gradient(colors: [.red,.green]), startPoint: UnitPoint.topLeading, endPoint: UnitPoint.bottomTrailing)
                .frame( 200, height: 200)
    // 角度渐变
    AngularGradient(gradient: Gradient(colors: [.red,.green]), center: UnitPoint.center).frame( 200, height: 200)
    
    // 半径渐变
    RadialGradient(gradient: Gradient(colors: [.red,.green]), center: UnitPoint.center, startRadius:1, endRadius: 100)
                .frame( 200, height: 200)    }

    LinearGradien:

    使用LinearGradien绘制线形颜色渐变的背景。 示例代码:

    Text("SwifUI Gradient")
        .font(.system(size: 36))
        .padding()
        .foregroundColor(.white)
        .background(LinearGradient(gradient: Gradient(colors: [.orange, .red, .purple]), startPoint: .topLeading, endPoint: .bottomTrailing))
    
    }

    AngularGradient:

    使用AngularGradient绘制角度颜色渐变的背景。 示例代码:

    VStack{
        Text("SwifUI Gradient")
        .font(.system(size: 36))
        .padding()
        .foregroundColor(.white)
        .background(AngularGradient(gradient: Gradient(colors: [.orange, .red, .purple]), center: UnitPoint(x: 0.5, y: 0.5), angle: Angle.init(degrees: -45)))
    
        Text("SwifUI Gradient")
        .font(.system(size: 36))
        .padding()
        .foregroundColor(.white)
        .background(AngularGradient(gradient: Gradient(colors: [.orange, .red, .purple]), center: UnitPoint(x: 0.5, y: 0.5), startAngle: Angle.init(degrees: 0), endAngle: Angle.init(degrees: 0)))
    
    }

    RadialGradient:

    使用RadialGradient绘制径向颜色渐变的背景。 示例代码:

    Text("SwifUI Gradient")
        .font(.system(size: 36))
        .padding()
        .foregroundColor(.white)
        .background(RadialGradient(gradient: Gradient(colors: [.orange, .red, .purple]), center: .init(x: 0.5, y: 0.5), startRadius: CGFloat(10), endRadius: CGFloat(120)))
    
    }
  • 相关阅读:
    第221题:最大正方形
    第238题:除自身以外数组的乘积
    简单易懂的拓扑排序
    第207题 课程表
    第198题:打家劫舍
    第四章 初始化与清理
    【笔记】jquery判断两个日期之间相差多少天
    【笔记】spring定时器时间配置实例
    【笔记】jquery加减乘除及科学计算法处理
    string 日期相加和相减
  • 原文地址:https://www.cnblogs.com/liuxiaokun/p/12676824.html
Copyright © 2011-2022 走看看