iOS / SwiftUI 输入法(键盘)布局处理总结(AI版)

文章目录

📘 iOS / SwiftUI 输入法(键盘)处理总结


一、问题背景

在 iOS / SwiftUI 开发中,常见输入法问题:

  • 输入框切换时键盘闪烁
  • 键盘弹出/收起动画不自然
  • 无法像 Android WindowInsetsAnimation 一样平滑跟随

二、输入框切换闪烁问题

❌ 错误原因

swift 复制代码
focusedField = nil
focusedField = .password

解决办法

swift 复制代码
enum Field {
    case username
    case password
}

@FocusState private var focusedField: Field?

TextField("用户名", text: $username)
    .focused($focusedField, equals: .username)

SecureField("密码", text: $password)
    .focused($focusedField, equals: .password)

❗ 注意

不要先设为 nil

不要手动关闭键盘

使用系统焦点切换

键盘动画(类似 Android Insets)

uikit

swift 复制代码
@objc func keyboardWillChangeFrame(_ notification: Notification) {
    guard let userInfo = notification.userInfo else { return }
    
    let duration = userInfo[UIResponder.keyboardAnimationDurationUserInfoKey] as? Double ?? 0.25
    let curveRaw = userInfo[UIResponder.keyboardAnimationCurveUserInfoKey] as? UInt ?? 0
    let curve = UIView.AnimationOptions(rawValue: curveRaw << 16)
    
    let frame = userInfo[UIResponder.keyboardFrameEndUserInfoKey] as? CGRect ?? .zero
    let keyboardHeight = UIScreen.main.bounds.height - frame.origin.y
    
    UIView.animate(withDuration: duration, delay: 0, options: curve) {
        self.bottomConstraint.constant = keyboardHeight
        self.view.layoutIfNeeded()
    }
}

swiftUI

  1. 推荐
swift 复制代码
.safeAreaInset(edge: .bottom) {
    Color.clear.frame(height: 0)
}
  1. combine
swift 复制代码
class KeyboardObserver: ObservableObject {
    @Published var height: CGFloat = 0
    
    private var cancellables = Set<AnyCancellable>()
    
    init() {
        NotificationCenter.default.publisher(for: UIResponder.keyboardWillChangeFrameNotification)
            .map { notification -> CGFloat in
                let frame = notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? CGRect ?? .zero
                return UIScreen.main.bounds.height - frame.origin.y
            }
            .assign(to: \.height, on: self)
            .store(in: &cancellables)
    }
}

struct ContentView: View {
    @StateObject var keyboard = KeyboardObserver()
    
    var body: some View {
        VStack {
            Spacer()
            
            TextField("输入", text: .constant(""))
                .textFieldStyle(.roundedBorder)
        }
        .padding(.bottom, keyboard.height)
        .animation(.easeOut(duration: 0.25), value: keyboard.height)
    }
}
相关推荐
烂蜻蜓3 分钟前
Flask入门教程(二十七):Session Interface API——自定义Session存储后端
网络·ios·flask
用户38034165882971 小时前
VideoToolbox 硬编解码的十个坑:为什么它几乎从不报错
ios
bcbnb1 小时前
Flutter-Notebook代码混淆:Android与iOS平台安全配置
后端·ios
2501_915106322 小时前
第一次开发 iPhone App,可能碰到的问题,解决办法
ide·vscode·ios·objective-c·个人开发·swift·敏捷流程
2501_915106323 小时前
iOS数据采集技术详解:从性能监控到崩溃分析的全链路实践
android·ios·小程序·https·uni-app·iphone·webview
末代iOS程序员华仔18 小时前
iOS 5.6 条例解决方法
flutter·ios·swift
末代iOS程序员华仔1 天前
Guideline 5.6 - Developer Code of Conduct
flutter·ios·swift
2501_915918411 天前
Flutter项目配置iOS混淆的详细步骤与工具推荐
android·flutter·ios·小程序·uni-app·cocoa·iphone
凡泰AI1 天前
如何通过小程序多端框架,让一个小程序同时运行在iOS、安卓、鸿蒙和微信客户端,实现开发层面的降本增效
android·ios·微信小程序·小程序·harmonyos
2501_915106322 天前
安卓抓包软件2026,免证书抓包 应用层抓包 代理抓包全解析
网络协议·计算机网络·网络安全·ios·adb·https·udp