3、SwiftUI 实现精美旋转加载动画全解析

SwiftUI 实现精美旋转加载动画全解析

1. 绘制静态旋转器

首先，我们的任务是在屏幕上绘制静态旋转器。这有助于我们了解如何组合形状视图，也为未来设计自己的形状动画提供思路。

1.1 绘制多个叶子

要绘制多个叶子，我们需要找到添加初始叶子的代码行 Leaf() 并删除它，然后插入一个循环来创建与 leavesCount 常量数量相同的叶子：

ForEach(0..<leavesCount) { index in 
  Leaf() 
}

1.2 旋转叶子

为了让多个叶子在屏幕上更清晰地显示，我们需要将每个叶子相对于前一个叶子稍微旋转。首先，在 Leaf 类型中添加一个属性来设置胶囊形状的旋转：

let rotation: Angle

Swift 会自动为 Leaf 视图生成一个 Leaf(rotation:) 初始化器，我们需要相应地调整创建叶子的代码。在 ForEach 闭包中，将 Leaf() 替换为：

Leaf(rotation: Angle(degrees: 
  (Double(index) / Double(sel