1. SwiftUI动态视图替换键盘的实现思路
在iOS应用开发中，键盘交互一直是影响用户体验的关键因素。传统处理方式往往只关注键盘的显示/隐藏，而忽略了键盘区域这个宝贵空间的再利用可能性。Notion等应用展示了一种创新思路：当键盘收起时，在原键盘位置动态展示功能视图，实现无缝的交互过渡。
这种技术方案的核心在于三个关键点：
- 精确获取键盘的实时高度和显示状态
- 使用SwiftUI的布局系统保留键盘的空间占位
- 通过状态管理实现视图的动态切换
提示：在SwiftUI中实现这一效果比UIKit更简洁，得益于其声明式语法和强大的状态管理能力。但需要注意SwiftUI 3.0(iOS 15+)以上版本才能获得完整的API支持。
2. 键盘高度获取与状态管理
2.1 键盘通知监听实现
获取键盘高度是整个过程的基础。我们需要建立一个Combine订阅来监听键盘通知：
swift复制import Combine
class KeyboardHeightPublisher: ObservableObject {
@Published var keyboardHeight: CGFloat = 0
private var cancellables = Set<AnyCancellable>()
init() {
let willShow = NotificationCenter.default
.publisher(for: UIResponder.keyboardWillShowNotification)
.compactMap { notification in
(notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? CGRect)?.height
}
let willHide = NotificationCenter.default
.publisher(for: UIResponder.keyboardWillHideNotification)
.map { _ in CGFloat(0) }
Publishers.Merge(willShow, willHide)
.subscribe(on: DispatchQueue.main)
.assign(to: \.keyboardHeight, on: self)
.store(in: &cancellables)
}
}
这段代码创建了一个可观察对象，它会：
- 在键盘显示时提取键盘高度
- 在键盘隐藏时将高度重置为0
- 在主线程更新@Published属性
2.2 @FocusState的应用技巧
SwiftUI 3.0引入的@FocusState是管理键盘显示的核心工具：
swift复制struct ContentView: View {
@StateObject private var keyboard = KeyboardHeightPublisher()
@FocusState private var isInputActive: Bool
@State private var showAlternativeView = false
var body: some View {
VStack {
TextField("输入内容", text: .constant(""))
.focused($isInputActive)
if showAlternativeView {
AlternativeView()
.frame(height: keyboard.keyboardHeight)
.transition(.move(edge: .bottom))
}
}
.animation(.default, value: keyboard.keyboardHeight)
}
}
这里的关键点：
- 使用focused修饰符绑定文本框的焦点状态
- 当键盘高度变化时触发动画效果
- 替代视图的高度与键盘高度保持一致
3. 视图替换的完整实现方案
3.1 布局结构与动画处理
完整的视图替换需要精心设计布局结构：
swift复制VStack(spacing: 0) {
// 主内容区域
ScrollView {
// 你的主要内容
}
// 动态底部区域
Group {
if isInputActive && !showAlternativeView {
Color.clear
.frame(height: keyboard.keyboardHeight)
} else if showAlternativeView {
AlternativeView()
.frame(height: keyboard.keyboardHeight)
}
}
.animation(.interactiveSpring(), value: keyboard.keyboardHeight)
}
这种布局结构确保了：
- 键盘显示时有正确的占位空间
- 视图切换时保持平滑过渡
- 不会影响主内容区域的布局
3.2 状态转换逻辑
视图替换的核心状态管理：
swift复制func toggleView() {
if isInputActive {
// 当前显示键盘，准备切换
isInputActive = false
DispatchQueue.main.asyncAfter(deadline: .now() + 0.25) {
showAlternativeView = true
}
} else if showAlternativeView {
// 当前显示替代视图，切换回键盘
showAlternativeView = false
DispatchQueue.main.asyncAfter(deadline: .now() + 0.25) {
isInputActive = true
}
} else {
// 初始状态，直接显示键盘
isInputActive = true
}
}
注意：使用DispatchQueue.main.asyncAfter是为了确保键盘完全收起后再显示替代视图，避免动画冲突。
4. 实战问题与解决方案
4.1 键盘高度获取不准确
在某些设备或系统版本上可能会遇到键盘高度获取不准确的问题。解决方案：
swift复制// 在键盘高度Publisher中添加安全区域调整
.compactMap { notification in
guard let frame = notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? CGRect else {
return nil
}
return frame.height - UIApplication.shared.windows.first?.safeAreaInsets.bottom ?? 0
}
4.2 动画闪烁问题
当快速切换视图时可能出现动画闪烁。优化方案：
swift复制.animation(.interactiveSpring(response: 0.3, dampingFraction: 0.7, blendDuration: 0.8), value: keyboard.keyboardHeight)
调整动画参数可以显著改善视觉效果。
4.3 多文本框处理
当有多个文本框时，需要扩展状态管理：
swift复制enum FocusField {
case primary, secondary
}
@FocusState private var focusedField: FocusField?
然后在切换逻辑中明确指定当前焦点字段。
5. 高级应用场景
5.1 结合自定义输入视图
可以将此技术与SwiftUI的UIViewRepresentable结合，实现更复杂的输入体验：
swift复制struct CustomInputView: UIViewRepresentable {
@Binding var text: String
func makeUIView(context: Context) -> UITextView {
let view = UITextView()
view.delegate = context.coordinator
return view
}
// 其他实现细节...
}
5.2 键盘工具栏集成
在键盘上方添加工具栏：
swift复制TextField("", text: $text)
.toolbar {
ToolbarItemGroup(placement: .keyboard) {
Button("完成") { isInputActive = false }
}
}
5.3 多平台适配
通过条件编译实现跨平台支持：
swift复制#if os(iOS)
// iOS特定实现
#elseif os(macOS)
// macOS实现
#endif
6. 性能优化建议
- 减少不必要的重绘：在替代视图中使用EquatableView优化性能
- 内存管理：确保在视图消失时取消所有Combine订阅
- 延迟加载：对于复杂的替代视图，考虑使用LazyView模式
- 键盘缓存：对于频繁切换的场景，可以缓存键盘高度
swift复制.onDisappear {
keyboard.cancellables.forEach { $0.cancel() }
}
7. 测试要点
在实际项目中，需要重点测试以下场景：
- 不同iOS版本下的行为一致性
- 各种键盘类型（全键盘、数字键盘等）的高度获取
- 横竖屏切换时的布局表现
- 与其他系统组件（如Alert、Sheet）的交互
- 低内存情况下的稳定性
我在实际项目中使用这种技术时发现，最常遇到的问题是在iPad分屏模式下键盘高度的计算。解决方案是额外监听UIApplication.didChangeStatusBarOrientationNotification，并在方向变化时重新计算布局。