我在 SwiftUI 中开发了一个自定义文本字段,它具有一个浮动标签作为占位符。当用户开始点击 textField 时,标签会向上移动。
在我的登录视图中,我将我的 TextFields 居中。问题是,当用户触摸 textField 内部时,键盘会弹出并使当前 textField 的占位符以及所有其他 textField 的占位符进行奇怪的移动,然后移回其初始位置。
这是我的观点代码:
var body: some View {
GeometryReader { geometry in
ScrollView {
ZStack {
VStack {
if !isTextFieldEditing {
imageTE
}
Spacer()
}
VStack {
TETextField("ei_apple_login_mail_address", text: $viewModel.email)
.keyboardType(.emailAddress)
.textContentType(.emailAddress)
.textInputAutocapitalization(.never)
.padding(.top, .medium)
.disabled(!viewModel.isTextFieldActive)
TESecureField("ei_apple_login_password", text: $viewModel.password)
.keyboardType(.default)
.textContentType(.password)
.textInputAutocapitalization(.never)
.padding(.top, .regular)
.disabled(!viewModel.isTextFieldActive)
HStack {
Spacer()
NavigationFlowLink(isActive: $viewModel.showPasswordRecovery) {
ResetPasswordNavigationFlow(context: .passwordRecovery)
} label: {
Text("ei_apple_login_forgot_password")
}
.font(.footnote)
.foregroundColor(.appleBlue)
}
Button(action: login) {
Text("ei_apple_login_cta")
.loading(viewModel.isLoading)
}
.disabled(viewModel.isLoading)
.buttonStyle(.primary)
.padding([.top, .bottom], .large)
.disabled(!viewModel.formIsValid)
.customAlert(
"ei_common_alert_reactivate_account_title",
message: "ei_common_alert_reactivate_account_desc",
isPresented: $viewModel.showAccountDeactivatedAlert
) {
CustomAlertButton(
"ei_common_alert_reactivate_account_cta",
role: .destructive,
action: reactivateAccount
)
CustomAlertButton("alert_title_cancel", role: .cancel) { }
}
}
.frame(maxWidth: .infinity, maxHeight: .infinity)
.frame(minHeight: geometry.size.height)
.padding(EdgeInsets(horizontal: .medium, vertical: .regular))
}
}
.background(Color.background1.ignoresSafeArea())
.foregroundColor(.body)
.navigationBarBackButtonDisplayMode(.minimal)
.navigationBarTitleDisplayMode(.inline)
.customNavigationTitle("ei_apple_login_title")
.toast(viewModel.toastMessage, isPresented: $viewModel.showToast, kind: viewModel.toastKind)
.onChange(of: viewModel.didFinishLogin, perform: onFinish)
}
.onTapGesture {
// Hide keyboard when user touch the view
UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
}
.onReceive(NotificationCenter.default.publisher(for: UIResponder.keyboardWillShowNotification)) { _ in
// Hide TE logo when keyboard apears
withAnimation(.easeOut(duration: 0.2)) {
isTextFieldEditing = true
}
}
.onReceive(NotificationCenter.default.publisher(for: UIResponder.keyboardWillHideNotification)) { _ in
// show TE logo when keyboard disapears
withAnimation {
isTextFieldEditing = false
}
}
}
这个问题似乎只出现在 iOS 16.2 的 iPhone Pro 和 Pro Max 上,较小的设备上不会出现。我想知道是否有人遇到过类似的问题或对如何解决它有任何建议。任何帮助将不胜感激。谢谢!