Skip to content
目录

组合徽章的前景和背景

设计稿要求在徽章的背景上旋转并重复多次山峰的形状。

我们来定义一个新的旋转类型,并利用 ForEach 视图让山峰形状的多个副本保持相同的设置 。

第 1 步

创建一个新的 SwiftUI View,名为 Badge

第 2 步

BadgeBackground 方法放在 Badgebody 属性中。

第 3 步

在 Badge.swift 中,用一个 ZStack 把徽章的 symbol 叠加在徽章的背景上。

现在的效果跟设计稿的相比,徽章的符号太大。

第 4 步

通过读取周围的几何图形并缩放符号来修改徽章符号的大小。

第 5 步

添加 ForEach 视图来旋转并显示徽章符号的副本。

完整的 360° 旋转分为八个部分,通过重复山峰符号来创建一个类似太阳的样式。

第 6 步

为了保持项目的条理性,在进入下一个教程之前,将你在本教程中添加的所有新文件收集到一个徽章组。

组合徽章的前景和背景 has loaded