SwiftUI如何实现无需UIKit适配、与键盘顶部对齐的悬浮视图

以下为纯SwiftUI实现的无依赖方案，支持iOS 15+所有设备，横竖屏、浮动键盘等场景均可精准对齐键盘顶部，无需使用Toolbar hack或UIKit相关逻辑：

完整可运行代码 #

import SwiftUI

struct KeyboardFloatingViewDemo: View {
    /// 管理输入框焦点状态
    @FocusState private var isInputActive: Bool
    /// 输入框内容绑定
    @State private var inputText = ""
    
    var body: some View {
        NavigationStack {
            List {
                // 示例业务列表内容，可替换为你的页面布局
                ForEach(0..<20) { index in
                    Text("示例列表项 \(index + 1)")
                }
            }
            .navigationTitle("待办清单")
            // 核心修饰符：底部安全区嵌入视图，自动适配键盘高度
            .safeAreaInset(edge: .bottom) {
                // 自定义悬浮视图内容，可按需修改样式
                HStack(spacing: 12) {
                    TextField("输入新待办内容", text: $inputText)
                        .focused($isInputActive)
                        .textFieldStyle(.roundedBorder)
                    
                    Button("添加") {
                        // 此处替换为你的业务逻辑
                        inputText = ""
                        isInputActive = false
                    }
                    .buttonStyle(.borderedProminent)
                }
                .padding()
                .background(.regularMaterial)
                // 可选：添加和键盘弹出同步的动画
                .animation(.easeInOut(duration: 0.2), value: isInputActive)
            }
        }
    }
}

#Preview {
    KeyboardFloatingViewDemo()
}

核心实现说明 #

• 依赖SwiftUI原生的safeAreaInset(edge: .bottom)修饰符，系统会自动将该区域跟随键盘安全区偏移，无需手动监听键盘通知计算高度，对齐精度完全由系统保证
• 支持所有设备尺寸、横竖屏切换、iPad浮动键盘、外接键盘等所有键盘相关场景
• 符合SwiftUI官方设计规范，不属于hack用法，后续系统版本兼容性更高

实现效果参考 #

内容的提问来源于stack exchange，提问作者Justin Comstock