如何在SwiftUI视图外部通过修饰符覆盖样式且无需传递初始化参数？

哈哈，这个问题我之前也碰到过——内部视图硬编码了样式，外部想改又不想动初始化参数，确实头疼！别担心，用SwiftUI的环境变量（Environment）就能完美解决，不用给InView加任何新的属性，纯靠外部修饰符就能覆盖内部样式。

具体步骤如下： #

首先，我们需要为InView的样式定义专属的环境键，这样外部可以通过修饰符轻松传递自定义值：

// 定义背景色的环境键，默认值设为原来的红色
private struct InViewBackgroundColorKey: EnvironmentKey {
    static let defaultValue: Color = .red
}

// 定义垂直内边距的环境键，默认值对应Text默认padding的垂直大小
private struct InViewVerticalPaddingKey: EnvironmentKey {
    static let defaultValue: CGFloat = 16
}

// 扩展EnvironmentValues，方便我们读取和设置这些环境值
extension EnvironmentValues {
    var inViewBackgroundColor: Color {
        get { self[InViewBackgroundColorKey.self] }
        set { self[InViewBackgroundColorKey.self] = newValue }
    }
    
    var inViewVerticalPadding: CGFloat {
        get { self[InViewVerticalPaddingKey.self] }
        set { self[InViewVerticalPaddingKey.self] = newValue }
    }
}

// 给View扩展两个自定义修饰符，让外部调用更直观
extension View {
    func inViewBackgroundColor(_ color: Color) -> some View {
        environment(\.inViewBackgroundColor, color)
    }
    
    func inViewVerticalPadding(_ value: CGFloat) -> some View {
        environment(\.inViewVerticalPadding, value)
    }
}

接下来修改InView，把原来硬编码的样式替换成从环境中读取的值：

struct InView: View {
    // 从环境中获取自定义的背景色和内边距
    @Environment(\.inViewBackgroundColor) private var bgColor
    @Environment(\.inViewVerticalPadding) private var verticalPadding
    
    var body: some View {
        Text("abc")
            .padding(.vertical, verticalPadding)
            .background(in: RoundedRectangle(cornerRadius: 10))
            .backgroundStyle(bgColor)
    }
}

现在你在MyView里就能直接用这两个自定义修饰符来覆盖样式了，完全不用改动InView的初始化方法：

struct MyView: View {
    var body: some View {
        InView()
            .inViewBackgroundColor(.green) // 改成你想要的绿色背景
            .inViewVerticalPadding(5) // 设置更小的垂直内边距
    }
}

这个方案的优势： #

• 完全保留InView原有的接口，不需要添加任何初始化参数，视图结构更干净
• 自带默认值回退，如果外部不设置修饰符，InView会自动使用原来的红色背景和默认内边距
• 自定义修饰符命名直观，其他开发者一看就知道是控制InView的样式

另外，如果你只是临时需要快速覆盖，也可以直接使用environment修饰符直接传递，比如：

InView()
    .environment(\.inViewBackgroundColor, .green)

不过自定义修饰符的可读性更强，更推荐使用前者。

内容来源于stack exchange