不能 Select SwiftUI TextField
Can't Select SwiftUI TextField
我无法 select 并在我的文本字段中输入任何文本。如果我将它们移出当前的 VStack 并将它们放入第一个 VStack,它们将按预期工作。它们下面的按钮在它们所在的位置工作得很好,所以看起来好像文本字段在任何东西后面。
这是我当前的布局。
import SwiftUI
struct ContentView: View {
@State var emailAddress = ""
@State private var password = ""
@State var showingAlert = false
@State var error = ""
@State var showCollections = false
var body: some View {
ZStack(alignment: .top) {
LinearGradient(gradient: Gradient(colors: [.blue, .white,]), startPoint: .bottom, endPoint: .top)
.edgesIgnoringSafeArea(.all)
VStack(alignment: .leading) {
Text("Title")
.font(.largeTitle)
.frame(width: UIScreen.main.bounds.size.width - 40, height: 100, alignment: .center)
.foregroundColor(.blue)
ZStack(alignment: .top) {
Color.white
VStack(alignment: .leading) {
TextField("Email", text: $emailAddress, onEditingChanged: { edit in
}, onCommit: {
})
.frame(width: UIScreen.main.bounds.size.width - 80, height: 41, alignment: .center)
.textFieldStyle(.plain)
.background(Color.init(red: 211.0/255.0, green: 211.0/255.0, blue: 211.0/255.0))
.textContentType(.emailAddress)
.cornerRadius(10)
.multilineTextAlignment(.center)
.padding(.top, 15)
.padding(.bottom, 10)
.foregroundColor(.blue)
SecureField("Password", text: $password)
.frame(width: UIScreen.main.bounds.size.width - 80, height: 41, alignment: .center)
.textFieldStyle(.plain)
.background(Color.init(red: 211.0/255.0, green: 211.0/255.0, blue: 211.0/255.0))
.textContentType(.password)
.cornerRadius(10)
.multilineTextAlignment(.center)
.foregroundColor(.blue)
Button(action: signIn) {
Text("Sign In")
.foregroundColor(.white)
}
.frame(width: UIScreen.main.bounds.size.width - 80, height: 50, alignment: .center)
.background(Color.blue)
.cornerRadius(20, antialiased: true)
Button(action: createAccount) {
Text("Don't have an account? Create one.")
.foregroundColor(.blue)
}
.frame(width: UIScreen.main.bounds.size.width - 80, height: 50, alignment: .center)
Button(action: forgotPassword) {
Text("Forgot password?")
.foregroundColor(.blue)
}
.frame(width: UIScreen.main.bounds.size.width - 80, height: 50, alignment: .center)
}
}
.frame(width: UIScreen.main.bounds.size.width - 40, height: 250, alignment: .center)
.cornerRadius(20)
}
}
}
func signIn() {
}
func createAccount() {
}
func forgotPassword() {
}
}
#if DEBUG
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
#endif
确实发生了一些奇怪的事情,但是,您可以通过在 TextField
和 SecureField
上使用 zIndex()
来解决它:
TextField("Email", text: $emailAddress, onEditingChanged: { edit in }, onCommit: { })
.frame(width: UIScreen.main.bounds.size.width - 80, height: 41, alignment: .center)
.textFieldStyle(.plain)
.background(Color.init(red: 211.0/255.0, green: 211.0/255.0, blue: 211.0/255.0))
.textContentType(.emailAddress)
.cornerRadius(10)
.multilineTextAlignment(.center)
.padding(.top, 15)
.padding(.bottom, 10)
.foregroundColor(.blue)
.zIndex(1)
SecureField("Password", text: $password)
.frame(width: UIScreen.main.bounds.size.width - 80, height: 41, alignment: .center)
.textFieldStyle(.plain)
.background(Color.init(red: 211.0/255.0, green: 211.0/255.0, blue: 211.0/255.0))
.textContentType(.password)
.cornerRadius(10)
.multilineTextAlignment(.center)
.foregroundColor(.blue)
.zIndex(1)
我无法 select 并在我的文本字段中输入任何文本。如果我将它们移出当前的 VStack 并将它们放入第一个 VStack,它们将按预期工作。它们下面的按钮在它们所在的位置工作得很好,所以看起来好像文本字段在任何东西后面。
这是我当前的布局。
import SwiftUI
struct ContentView: View {
@State var emailAddress = ""
@State private var password = ""
@State var showingAlert = false
@State var error = ""
@State var showCollections = false
var body: some View {
ZStack(alignment: .top) {
LinearGradient(gradient: Gradient(colors: [.blue, .white,]), startPoint: .bottom, endPoint: .top)
.edgesIgnoringSafeArea(.all)
VStack(alignment: .leading) {
Text("Title")
.font(.largeTitle)
.frame(width: UIScreen.main.bounds.size.width - 40, height: 100, alignment: .center)
.foregroundColor(.blue)
ZStack(alignment: .top) {
Color.white
VStack(alignment: .leading) {
TextField("Email", text: $emailAddress, onEditingChanged: { edit in
}, onCommit: {
})
.frame(width: UIScreen.main.bounds.size.width - 80, height: 41, alignment: .center)
.textFieldStyle(.plain)
.background(Color.init(red: 211.0/255.0, green: 211.0/255.0, blue: 211.0/255.0))
.textContentType(.emailAddress)
.cornerRadius(10)
.multilineTextAlignment(.center)
.padding(.top, 15)
.padding(.bottom, 10)
.foregroundColor(.blue)
SecureField("Password", text: $password)
.frame(width: UIScreen.main.bounds.size.width - 80, height: 41, alignment: .center)
.textFieldStyle(.plain)
.background(Color.init(red: 211.0/255.0, green: 211.0/255.0, blue: 211.0/255.0))
.textContentType(.password)
.cornerRadius(10)
.multilineTextAlignment(.center)
.foregroundColor(.blue)
Button(action: signIn) {
Text("Sign In")
.foregroundColor(.white)
}
.frame(width: UIScreen.main.bounds.size.width - 80, height: 50, alignment: .center)
.background(Color.blue)
.cornerRadius(20, antialiased: true)
Button(action: createAccount) {
Text("Don't have an account? Create one.")
.foregroundColor(.blue)
}
.frame(width: UIScreen.main.bounds.size.width - 80, height: 50, alignment: .center)
Button(action: forgotPassword) {
Text("Forgot password?")
.foregroundColor(.blue)
}
.frame(width: UIScreen.main.bounds.size.width - 80, height: 50, alignment: .center)
}
}
.frame(width: UIScreen.main.bounds.size.width - 40, height: 250, alignment: .center)
.cornerRadius(20)
}
}
}
func signIn() {
}
func createAccount() {
}
func forgotPassword() {
}
}
#if DEBUG
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
#endif
确实发生了一些奇怪的事情,但是,您可以通过在 TextField
和 SecureField
上使用 zIndex()
来解决它:
TextField("Email", text: $emailAddress, onEditingChanged: { edit in }, onCommit: { })
.frame(width: UIScreen.main.bounds.size.width - 80, height: 41, alignment: .center)
.textFieldStyle(.plain)
.background(Color.init(red: 211.0/255.0, green: 211.0/255.0, blue: 211.0/255.0))
.textContentType(.emailAddress)
.cornerRadius(10)
.multilineTextAlignment(.center)
.padding(.top, 15)
.padding(.bottom, 10)
.foregroundColor(.blue)
.zIndex(1)
SecureField("Password", text: $password)
.frame(width: UIScreen.main.bounds.size.width - 80, height: 41, alignment: .center)
.textFieldStyle(.plain)
.background(Color.init(red: 211.0/255.0, green: 211.0/255.0, blue: 211.0/255.0))
.textContentType(.password)
.cornerRadius(10)
.multilineTextAlignment(.center)
.foregroundColor(.blue)
.zIndex(1)