UITextFields没有显示在结构中，如何解决？

问题描述

我试图在我的应用程序上使用某种类型的提交表单，但是由于某种原因，我无法放置UItextfields。我在此结构的开头声明了它们，但是在显示时我得到了错误：

“类型'（）'不符合'视图'；只有struct / enum / class类型可以符合协议”

import SwiftUI
import UIKit

/// Shows a list of inspiring quotes/bio
struct FeatureView: View {
    
    @State private var userEmail: UITextField = UITextField(frame: CGRect(x:10,y:320,width:300.00,height:30.00))
    
    private var instagramName: UITextField = UITextField(frame: CGRect(x:10,height:30.00))
    
    var body: some View {
        VStack {
            HStack {
                VStack(alignment: .leading) {
                    Text("Get Featured").font(.largeTitle).bold()
                    Spacer()
                    Text("1. Submit your information below")
                    Spacer()
                    Text("2. On the 1st and 14th we choose a new account to feature")
                    Spacer()
                    Text("3. Get notified by e-mail if your account is chosen!")
                    Spacer()
                }
                Spacer()
                userEmail.placeholder = "email"
                userEmail.addSubview(userEmail)
            }.padding(EdgeInsets(top: 20,leading: 20,bottom: 0,trailing: 20))
            
        }
    }
}

我只是想暂时显示一个可编辑的电子邮件字段，但最终我希望有5-6个不同的字段，所有这些字段都包含我可以让用户提交的信息

解决方法

您必须使用TextField。如果要使用UIKit，则必须将UITextField包装到UIViewRepresentable中。

这里是使用TextField的方式，您需要创建两个@State属性来跟踪每个TextField的文本：

import SwiftUI

/// Shows a list of inspiring quotes/bio
struct FeatureView: View {

    @State private var emailText: String = ""
    @State private var instagramNameText: String = ""

    var body: some View {
        VStack {
            HStack {
                VStack(alignment: .leading) {
                    Text("Get Featured").font(.largeTitle).bold()
                    Spacer()
                    Text("1. Submit your information below")
                    Spacer()
                    Text("2. On the 1st and 14th we choose a new account to feature")
                    Spacer()
                    Text("3. Get notified by e-mail if your account is chosen!")
                    Spacer()
                }
                Spacer()
            }.padding(EdgeInsets(top: 20,leading: 20,bottom: 0,trailing: 20))

            VStack {
                TextField("Email",text: $emailText)
                    .frame(width: 300,height: 30)
                    .padding(.leading,10)
                TextField("Instagram name",text: $instagramNameText)
                    .frame(width: 300,10)
            }
        }
    }
}

以下是将UIViewRepresentable包裹起来以使用UITextField的方法：

import SwiftUI

/// Shows a list of inspiring quotes/bio
struct FeatureView: View {

    private let emailTextField = CustomWrappedTextField(customPlaceholder: "Email")
    private let instagramTextField = CustomWrappedTextField(customPlaceholder: "Instagram name")

    var body: some View {
        VStack {
            HStack {
                VStack(alignment: .leading) {
                    Text("Get Featured").font(.largeTitle).bold()
                    Spacer()
                    Text("1. Submit your information below")
                    Spacer()
                    Text("2. On the 1st and 14th we choose a new account to feature")
                    Spacer()
                    Text("3. Get notified by e-mail if your account is chosen!")
                    Spacer()
                }
                Spacer()
            }.padding(EdgeInsets(top: 20,trailing: 20))

            VStack {
                emailTextField
                instagramTextField
            }
        }
    }
}

final class CustomWrappedTextField: UIViewRepresentable {

    typealias UIViewType = UITextField

    let customPlaceholder: String

    init(customPlaceholder: String) {
        self.customPlaceholder = customPlaceholder
    }

    func makeUIView(context: Context) -> UITextField {

        let customTextField = UITextField(frame: CGRect(x: 10,y: 320,width: 300.00,height: 30.00))

        customTextField.placeholder = customPlaceholder

        return customTextField
    }

    func updateUIView(_ uiView: UITextField,context: Context) {

    }
}