我们以设置一个角标的背景色为为例
struct Badge: ViewModifier {
@Environment(\.badgeColor) var badgeColor
func body(content: Content) -> some View {
content
.font(.caption)
.foregroundColor(.white)
.padding(.horizontal, 5)
.padding(.vertical, 2)
.background(
Capsule(style: .continuous)
.fill(badgeColor)
)
}
}
代码中的 badgeColor 就是自定义的环境变量
1.实现 EnvironmentKey 协议
enum BadgeColorKey: EnvironmentKey {
static var defaultValue: Color = .blue
}
2.给自定义键添加 set 和 get 方法
extension EnvironmentValues {
var badgeColor: Color {
get {
self[BadgeColorKey.self]
}
set {
self[BadgeColorKey.self] = newValue
}
}
}
3.给 View 添加扩展
extension View {
func badgeColor(_ color: Color) -> some View {
environment(\.badgeColor, color)
}
}
4.使用
VStack {
Text(3000, format: .number)
.modifier(Badge())
Text("Test")
.modifier(Badge())
}
.badgeColor(.cyan)
效果图