当我试图在swiftUI中为"textfield“创建自己的修饰符时，会出现一个错误

Question

我试图在swiftUI中为"textfield“创建自己的修饰符。我在扩展中创建了以下修饰符。

extension TextField{
    public func LoginInputStyle(_ flg:String = "1") -> TextField{
        
        if(flg == "1"){
            return self.font(.system(size: 16, design: .rounded))
                .frame(maxWidth: 300)
                .textFieldStyle(RoundedBorderTextFieldStyle()) as! TextField<Label>
        }
        return self.font(.system(size: 16, design: .rounded))
            .frame(maxWidth: 300)
            .textFieldStyle(RoundedBorderTextFieldStyle()) as! TextField<Label>
    }
}


struct NewLogin: View {
    @State public var mail:String = ""
    var body:some View{
       VStack(){
          TextField("input mailaddress",text: $mail).LoginInputStyle()
       }
    }
}

当我构建修饰符时，它会因以下错误而停止

无法将'SwiftUI.ModifiedContent>，SwiftUI._FlexFrameLayout>、SwiftUI.TextFieldStyleModifier>‘(0x7f9ea6833d48)类型的值转换为“SwiftUI.TextField”

我怎么才能解决这个问题？提前谢谢你。

Answer 1

要创建您自己的修饰符，请使用ViewModifier尝试这种方法

struct NewLogin: View {
    @State public var mail: String = ""
    
    var body: some View {
       VStack() {
          TextField("input mailaddress",text: $mail)
               .modifier(TextFieldModifier(flg: "2"))
       }
    }
    
}

struct TextFieldModifier: ViewModifier {
    var flg: String = "1"
    
    func body(content: Content) -> some View {
        if(flg == "1") {
            content
                .font(.system(size: 16, design: .rounded))
                .frame(maxWidth: 300)
                .textFieldStyle(RoundedBorderTextFieldStyle())
                .foregroundColor(.blue)
        } else {
            content
                .font(.system(size: 16, design: .rounded))
                .frame(maxWidth: 300)
                .textFieldStyle(RoundedBorderTextFieldStyle())
                .foregroundColor(.red)
        }
    }

}

Answer 2

作为工作狗的答案的另一种选择，您可以扩展View来创建修饰符--它可以避免在代码中编写“修饰符”。

修饰语：

extension View {
    
    @ViewBuilder
    func loginInputStyle(_ flg: String = "1") -> some View {
        
        if flg == "1" {
            self
                .font(.system(size: 16, design: .rounded))
                .frame(maxWidth: 300)
                .textFieldStyle(RoundedBorderTextFieldStyle())
        } else {
            self
                .font(.system(size: 26, design: .rounded))
                .frame(maxWidth: 300)
                .textFieldStyle(RoundedBorderTextFieldStyle())
        }
    }
}

在调用视图中：

    @State public var mail:String = ""

    var body:some View{
       VStack {
           TextField("input mailaddress", text: $mail)
                .loginInputStyle()
           TextField("input mailaddress", text: $mail)
                .loginInputStyle("2")
       }
    }