SwiftUI TextField & SecureField

Simulator Screen Shot - iPhone 11 - 2020-07-29 at 21.13.22.png

TextField 文本输入框
SecureField 密码输入框

数据绑定
@State var username: String = ""
@State var password: String = ""

键盘消失处理

#if canImport(UIKit)
extension View {
    func hideKeyboard() {
        UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
    }
}
#endif

struct ContentView: View {
    @State var username: String = ""
    @State var password: String = ""

    var body: some View {
            
            VStack {
                Text("fanfou.one")
                    .font(.largeTitle)
                    .bold()
                    .frame(maxWidth: .infinity, alignment: .leading)
                    .padding(EdgeInsets.init(top: 16, leading: 16, bottom: 10, trailing: 10))
                    .foregroundColor(.blue)
                Spacer().frame(width: 100, height: 80)
                
                VStack {
                    Text("账号")
                        .font(.callout)
                        .bold()
                        .frame(maxWidth: .infinity, alignment: .leading)
                    TextField("请输入饭否账号", text: $username)
                        .textFieldStyle(RoundedBorderTextFieldStyle())
                    Spacer()
                        .frame(width: 100, height: 16, alignment: .center)
                    Text("密码")
                        .font(.callout)
                        .bold()
                        .frame(maxWidth: .infinity, alignment: .leading)
                    SecureField("请输入密码", text: $password)
                        .textFieldStyle(RoundedBorderTextFieldStyle())
                        
                }.padding()
                
                
                Spacer().frame(width: 100, height: 60)
                
                Button(action: {
                   
                }) {
                    Text("登录")
                        .fontWeight(.bold)
                        .bold()
                        .foregroundColor(.white)
                }
                .frame(width: UIScreen.main.bounds.width - 32, height: 44, alignment: .center)
                .background(Color.blue)
                .cornerRadius(22)
                
                
                
                Spacer()
            }
            .onTapGesture {
                print("tap")
                self.hideKeyboard()
            }
    }
        
}