SwiftUI—使用径向渐变制作从原点向外扩散的渐变颜色

简介: SwiftUI—使用径向渐变制作从原点向外扩散的渐变颜色

使用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))) //创建一个径向渐变,起点半径为10,终点半径为120
}


2466108-593f785c9dda6d5e.webp.jpg



目录
相关文章
|
10月前
Echarts线性渐变、径向渐变、纹理填充
Echarts线性渐变、径向渐变、纹理填充
|
图形学
浅谈Unity之ShaderGraph-等高线和高程渐变设色
ShaderGraph实现等高线和高程渐变设色
|
9月前
cavans图形绘制(直线、矩形、原型、贝塞尔曲线、渐变背景) 2
cavans图形绘制(直线、矩形、原型、贝塞尔曲线、渐变背景) 2
|
9月前
Qt绘图(线条、椭圆、矩形、图片滚动)
Qt绘图(线条、椭圆、矩形、图片滚动)
551 3
|
8月前
|
前端开发
canvas系列教程02——圆、弧线、圆角矩形、曲线(气泡、心形、N叶草)、扇形
canvas系列教程02——圆、弧线、圆角矩形、曲线(气泡、心形、N叶草)、扇形
123 0
|
9月前
cavans图形绘制(直线、矩形、原型、贝塞尔曲线、渐变背景) 1
cavans图形绘制(直线、矩形、原型、贝塞尔曲线、渐变背景)
【Three.js入门】灯光与阴影、平行光阴影属性、聚光灯的属性和应用
【Three.js入门】灯光与阴影、平行光阴影属性、聚光灯的属性和应用
433 1
SVG 线性渐变 和 径向渐变
SVG 线性渐变 和 径向渐变
223 0
|
API
使用Threejs创建几何体并添加材质、光源、阴影、动画,添加坐标轴
使用Threejs创建几何体并添加材质、光源、阴影、动画,添加坐标轴
515 0
使用Threejs创建几何体并添加材质、光源、阴影、动画,添加坐标轴