自定义 TextField 在 SwiftUI 代码中的 VStack 中不起作用
Customized TextField not working in VStack in SwiftUI code
我自定义了文本域并把它放在VStack中,但是当我点击文本域时它没有反应。
但是如果我把它放在 VStack 之外它会很好用。
请检查代码并给出解决此问题的任何答案。
提前致谢。
struct LoginView: View {
@State var email = ""
@State var password = ""
var body: some View {
NavigationView {
VStack {
// email
CustomTextField(placeholder: "Working", text: $email, icon: Image(systemName: "envelope.fill"))
VStack {
Text("SIGN IN")
.font(.title)
.padding()
.padding(.top, 16)
// email
CustomTextField(placeholder: "Not working", text: $email, icon: Image(systemName: "envelope.fill"))
// password
CustomTextField(placeholder: "Password", text: $password, icon: Image(systemName: "lock.fill"))
}
.background(Color.blue)
.shadow(color: Color.gray, radius: 5)
.padding(.init(top: 40, leading: 40, bottom: 0, trailing: 40))
}
.background(Color(AppColors.shared.themeColor))
.edgesIgnoringSafeArea(.all)
} // navigation
.navigationBarHidden(true)
.navigationBarBackButtonHidden(true)
.navigationBarTitle("")
} // body
} // end view
这里是自定义文本框 =====
struct CustomTextField: View {
var placeholder: String
@Binding var text: String
var icon: Image
var height: CGFloat = 45
var body: some View {
HStack(spacing: 10) {
TextField(placeholder, text: $text)
.multilineTextAlignment(.leading)
.accentColor(Color.black)
.foregroundColor(Color.black)
.padding(.init(top: 0, leading: 20, bottom: 0, trailing: 0))
icon.padding(.init(top: 0, leading: 0, bottom: 0, trailing: 24))
}
.background(Color.red)
.frame(height: height)
.clipShape(RoundedRectangle(cornerRadius: height/2))
.overlay(RoundedRectangle(cornerRadius: height/2).stroke(Color.secondary, lineWidth: 1))
.padding(.init(top: 0, leading: 40, bottom: 0, trailing: 40))
}
}
您不应将 .shadow()
应用于 VStack
。相反,您可以将它分别应用于每个元素。
我自定义了文本域并把它放在VStack中,但是当我点击文本域时它没有反应。 但是如果我把它放在 VStack 之外它会很好用。 请检查代码并给出解决此问题的任何答案。 提前致谢。
struct LoginView: View {
@State var email = ""
@State var password = ""
var body: some View {
NavigationView {
VStack {
// email
CustomTextField(placeholder: "Working", text: $email, icon: Image(systemName: "envelope.fill"))
VStack {
Text("SIGN IN")
.font(.title)
.padding()
.padding(.top, 16)
// email
CustomTextField(placeholder: "Not working", text: $email, icon: Image(systemName: "envelope.fill"))
// password
CustomTextField(placeholder: "Password", text: $password, icon: Image(systemName: "lock.fill"))
}
.background(Color.blue)
.shadow(color: Color.gray, radius: 5)
.padding(.init(top: 40, leading: 40, bottom: 0, trailing: 40))
}
.background(Color(AppColors.shared.themeColor))
.edgesIgnoringSafeArea(.all)
} // navigation
.navigationBarHidden(true)
.navigationBarBackButtonHidden(true)
.navigationBarTitle("")
} // body
} // end view
这里是自定义文本框 =====
struct CustomTextField: View {
var placeholder: String
@Binding var text: String
var icon: Image
var height: CGFloat = 45
var body: some View {
HStack(spacing: 10) {
TextField(placeholder, text: $text)
.multilineTextAlignment(.leading)
.accentColor(Color.black)
.foregroundColor(Color.black)
.padding(.init(top: 0, leading: 20, bottom: 0, trailing: 0))
icon.padding(.init(top: 0, leading: 0, bottom: 0, trailing: 24))
}
.background(Color.red)
.frame(height: height)
.clipShape(RoundedRectangle(cornerRadius: height/2))
.overlay(RoundedRectangle(cornerRadius: height/2).stroke(Color.secondary, lineWidth: 1))
.padding(.init(top: 0, leading: 40, bottom: 0, trailing: 40))
}
}
您不应将 .shadow()
应用于 VStack
。相反,您可以将它分别应用于每个元素。