SwiftUI中VoiceOver字幕面板开启时底部元素无法完整显示求助

可以通过动态调整ScrollView的安全区忽略设置，兼顾UI/UX需求和VoiceOver字幕面板开启时的元素显示完整度，具体实现如下：

核心思路 #

监听VoiceOver字幕面板的开启状态，当字幕面板激活时，让ScrollView不再忽略底部安全区；当字幕面板关闭时，恢复忽略底部安全区的设置，以此适配两种场景。

代码实现 #

import SwiftUI

struct ContentView: View {
    // 自定义网格列（根据你的实际布局需求调整）
    private let gridColumns = [GridItem(.flexible()), GridItem(.flexible())]
    // 存储字幕面板的实时状态
    @State private var isCaptionEnabled = UIAccessibility.isClosedCaptioningEnabled
    
    var body: some View {
        ScrollView {
            LazyVGrid(columns: gridColumns) {
                // 替换为你的实际列表元素
                ForEach(1...20, id: \.self) { index in
                    Text("Item \(index)")
                        .frame(height: 100)
                        .background(Color.blue.opacity(0.2))
                        .cornerRadius(8)
                }
            }
            .padding()
        }
        // 动态切换安全区忽略规则
        .ignoresSafeArea(edges: isCaptionEnabled ? [] : .bottom)
        // 监听字幕状态变化通知
        .onAppear {
            NotificationCenter.default.addObserver(
                forName: UIAccessibility.closedCaptioningStatusDidChangeNotification,
                object: nil,
                queue: .main
            ) { _ in
                isCaptionEnabled = UIAccessibility.isClosedCaptioningEnabled
            }
        }
        .onDisappear {
            // 页面销毁时移除监听，避免内存泄漏
            NotificationCenter.default.removeObserver(
                self,
                name: UIAccessibility.closedCaptioningStatusDidChangeNotification,
                object: nil
            )
        }
    }
}

原理说明 #

• UIAccessibility.isClosedCaptioningEnabled：系统提供的属性，直接判断当前是否开启了字幕/隐藏式字幕面板。
• UIAccessibility.closedCaptioningStatusDidChangeNotification：字幕状态切换时系统发送的通知，用于实时同步界面设置。
• 动态调整.ignoresSafeArea的edges参数：字幕开启时，ScrollView尊重底部安全区，内容不会被字幕面板遮挡；字幕关闭时，恢复忽略底部安全区的规则，保持原有UI布局。

验证方式 #

1. 打开iOS设置 → 辅助功能 → 字幕与隐藏式字幕 → 开启“样式”或在视频界面打开字幕面板。
2. 检查页面底部元素是否完整显示；关闭字幕面板后，确认UI布局保持符合需求的状态。

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