在SwiftUI 中Shape是非常重要且核心的协议，常用于创建简单的几何图形，可以应用到界面设计、动画和遮罩中。SwiftUI 提供了多种内置形状，并允许自定义自己的形状。
什么是 Shape？
Shape 是一个协议，代表一个可绘制的二维图形。
通过实现 Shape 协议的唯一要求方法 path(in:)，返回一个 Path，来定义图形的轮廓。
Shape 自身只定义形状，不包含颜色、填充、描边等样式，这些通过调用 .fill(), .stroke() 等修饰符来添加。
Shape协议定义：
protocol Shape: View {
func path(in rect: CGRect) -> Path
}path(in rect: CGRect) -> Path：需要实现该方法，返回你想绘制的路径，路径会被限制在传入的 rect 里。
使用示例
1、自定义圆形Shape
struct MyCircle: Shape {
func path(in rect: CGRect) -> Path {
return Path(ellipseIn: rect)
}
}使用并设置填充颜色：
MyCircle()
.fill(Color.red)
.frame(width: 100, height: 100)设置描边：
MyCircle()
.stroke(Color.blue, lineWidth: 3)
.frame(width: 100, height: 100)2、三角形
struct Triangle: Shape {
func path(in rect: CGRect) -> Path {
Path { path in
path.move(to: CGPoint(x: rect.midX, y: rect.minY)) // 顶点
path.addLine(to: CGPoint(x: rect.minX, y: rect.maxY)) // 左下角
path.addLine(to: CGPoint(x: rect.maxX, y: rect.maxY)) // 右下角
path.closeSubpath() // 闭合路径
}
}
}设置描边：
Triangle()
.stroke(Color.blue, lineWidth: 2)
.frame(width: 100, height: 100)
SwiftUI 常用的Shape
以下是 SwiftUI 中常用的Shape及其用途：
1、Circle：圆形，半径由父视图的大小决定。
2、Ellipse：椭圆，长宽比由父视图的大小决定。
3、Rectangle：矩形，边长由父视图的大小决定。
4、RoundedRectangle：圆角矩形，支持设置圆角半径。
5、Capsule：胶囊形状，是圆角矩形的特例，长宽比决定形状。
6、Path：自定义路径，支持绘制复杂图形（如多边形、曲线等）。
7、PolygonShape：多边形，可以自定义边的数量（需要第三方库或手动实现）。
8、Line ：线条（通常需要结合 Path 实现）。
9、Arc：弧形，可以通过自定义角度绘制（需要结合 Path 实现）。
10、Star：星形，需要自定义实现。
11、Triangle：三角形（需要自定义实现或使用 Path）。
常用Shape示例
1、Circle（圆形）
Circle()
.fill(Color.red) // 填充颜色
.frame(width: 100, height: 100) // 设置大小
2、Rectangle（矩形）
Rectangle()
.fill(Color.green)
.frame(width: 100, height: 50)
3、RoundedRectangle（圆角矩形）
RoundedRectangle(cornerRadius: 20)
.stroke(Color.blue, lineWidth: 2) // 边框颜色
.frame(width: 100, height: 50)
4、Capsule（胶囊形状）
Capsule()
.fill(Color.orange)
.frame(width: 150, height: 50)
5、Ellipse（椭圆）
Ellipse()
.fill(Color.purple)
.frame(width: 120, height: 80)
结合形状的修饰符
形状可以与修饰符一起使用，增加灵活性：
1、fill()：填充颜色。
2、stroke(lineWidth:)：设置边框。
3、clipShape()：使用形状作为遮罩。
4、overlay()：在形状上添加叠加内容。
5、trim(from:to:)：显示形状的一部分。
总结
Shape协议，通过实现path(in:)方法返回路径。
可以使用fill()、stroke()等修饰符控制颜色、边框。
相关文章
SwiftUI绘制圆弧路径的trim()修饰符：https://fangjunyu.com/2025/02/24/swiftui%e7%bb%98%e5%88%b6%e5%9c%86%e5%bc%a7%e8%b7%af%e5%be%84%e7%9a%84trim%e4%bf%ae%e9%a5%b0%e7%ac%a6/
