如何修复SwiftUI中SFSafariViewController抽屉底部的间隙？

出现底部间隙的核心原因是SFSafariViewController默认会保留底部安全区间距，与SwiftUI的sheet容器适配逻辑冲突。以下是具体修复方案：

修改后的完整代码 #

import SwiftUI
import SafariServices

struct SFSafariView: UIViewControllerRepresentable {
    let url: URL
    
    func makeUIViewController(context: Context) -> SFSafariViewController {
        let safariVC = SFSafariViewController(url: url)
        // 让Safari控制器布局延伸至安全区域外，消除底部间隙
        safariVC.edgesForExtendedLayout = .all
        // 强制设置控制器尺寸为屏幕大小，确保占满抽屉空间
        safariVC.preferredContentSize = UIScreen.main.bounds.size
        // 可选：设置关闭按钮为底部样式，贴合抽屉交互习惯
        safariVC.dismissButtonStyle = .done
        return safariVC
    }
    
    func updateUIViewController(_ uiViewController: SFSafariViewController, context: Context) {}
}

struct SafariDrawerView: View {
    @State private var showUrl = false
    var body: some View {
        Button("打开Safari抽屉") {
            showUrl.toggle()
        }
        .buttonStyle(BorderlessButtonStyle())
        .sheet(isPresented: $showUrl) {
            SFSafariView(url: URL(string: "https://github.com")!)
                .edgesIgnoringSafeArea(.bottom) // SwiftUI层面忽略底部安全区
        }
    }
}

#Preview {
    SafariDrawerView()
}

关键修复点说明 #

• 配置SFSafariViewController布局：通过edgesForExtendedLayout = .all让控制器的布局延伸到安全区域之外，覆盖默认的底部空白。
• 强制设置尺寸：preferredContentSize = UIScreen.main.bounds.size确保Safari控制器占满整个抽屉的可用空间，避免自适应产生的间隙。
• SwiftUI层面适配：给sheet内的SFSafariView添加.edgesIgnoringSafeArea(.bottom)，双重保障消除底部间距。
• 修正初始状态：将showUrl初始值设为false，符合“点击按钮打开抽屉”的需求（原代码默认直接显示抽屉）。

若仍存在间隙，可尝试额外添加safariVC.modalPresentationCapturesStatusBarAppearance = true，确保状态栏样式不影响布局。

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