在 SwiftUI 中使用三元运算符会导致类型不匹配错误，为什么？

Question

我目前一直在使用这个 Environment 变量来调整我的应用程序上的 Dark 和 Light 模式。

@Environment(.colorScheme) var colorScheme

我遇到的问题是使用 var 有条件地设置按钮样式。这种方法效果很好。

if colorScheme == .dark {
                    Button("Create Account", action: {
                        
                    }).buttonStyle(CinderDarkButtonStyle(geometry: geometry))
                } else {
                    Button("Create Account", action: {
                        
                    }).buttonStyle(CinderLightButtonStyle(geometry: geometry))
                }

但是，这样做会导致我在一个相对简单的用户界面上到处重复代码。每当我尝试以这种方式执行此操作时，都会出现错误，指出我的类型不匹配。

Button("Create Account", action: {
                            //DO SOME ACTION
                        }).buttonStyle(
colorScheme == .dark ? 
     CinderDarkButtonStyle(geometry: geometry) :
     CinderLightButtonStyle(geometry: geometry)
)

Answer 1

除了@Don 所说的额外)，CinderDarkButtonStyle 和CinderLightButtonStyle 是不同的结构。它们不是同一类型。

您可以做一个返回不透明类型的自定义函数，如this answer 中所述。试试这样的：

struct ContentView: View {
    @State var colorScheme = ColorScheme.dark

    var body: some View {
        GeometryReader { geometry in
            Button("Create Account", action: {
                //DO SOME ACTION
            })
            .buttonStyle(for: colorScheme, geometry: geometry) /// use custom buttonStyle function
        }
    }
}

extension Button {
    @ViewBuilder
    func buttonStyle(for colorScheme: ColorScheme, geometry: GeometryProxy) -> some View {
        switch colorScheme {
        case .light:
            buttonStyle(CinderDarkButtonStyle(geometry: geometry))
        case .dark:
            buttonStyle(CinderLightButtonStyle(geometry: geometry))
        }
    }
}

以上在buttonStyle(CinderDarkButtonStyle(geometry: geometry)) 和buttonStyle(CinderLightButtonStyle(geometry: geometry)) 修饰符之间切换，基于colorScheme。

Answer 2

您收到错误是因为 CinderDarkButtonStyle 和 CinderLightButtonStyle 实际上是不同的类型。而且，ButtonStyle 具有关联类型，因此您不能直接转换为 ButtonStyle。

如果这是一个普通的View 而不是ButtonStyle，您可以使用AnyView 进行一些类型擦除，以便类型等效。

在这种情况下，将关于在自定义按钮样式中显示哪种按钮样式的逻辑移动似乎会更简洁：

struct MyTestView : View {
    var body: some View {
        GeometryReader { geometry in
            Button("Create Account", action: {
                //DO SOME ACTION
            })
            .buttonStyle(CinderButtonStyle(geometry: geometry))
        }
    }
}

struct CinderButtonStyle : ButtonStyle {
    var geometry : GeometryProxy
    @Environment(\.colorScheme) private var colorScheme
    
    @ViewBuilder func makeBody(configuration: Configuration) -> some View {
        switch colorScheme {
        case .dark:
            darkBody(configuration: configuration)
        case .light:
            lightBody(configuration: configuration)
        @unknown default:
            lightBody(configuration: configuration)
        }
    }
    
    @ViewBuilder func lightBody(configuration: Configuration) -> some View {
        configuration.label //light modifications
    }
    
    @ViewBuilder func darkBody(configuration: Configuration) -> some View {
        configuration.label //dark modifications
    }
}

---

更新，使用视图修饰符：

struct CinderButtonStyle : ButtonStyle {
    var geometry : GeometryProxy
    @Environment(\.colorScheme) private var colorScheme
    
    @ViewBuilder func makeBody(configuration: Configuration) -> some View {
        switch colorScheme {
        case .dark:
            lightAndDarkModifications(configuration: configuration)
                .modifier(DarkModifier())
        default:
            lightAndDarkModifications(configuration: configuration)
                .modifier(LightModifier())
        }
    }
    
    @ViewBuilder func lightAndDarkModifications(configuration: Configuration) -> some View {
        configuration.label
    }
}

struct DarkModifier : ViewModifier {
    func body(content: Content) -> some View {
        content
    }
}

struct LightModifier : ViewModifier {
    func body(content: Content) -> some View {
        content
    }
}