如何避免iOS 16+中靠近屏幕底部的.popover内容被截断？

现象本质 #

你遇到的是SwiftUI在iOS 16+中使用presentationCompactAdaptation(.popover)时的布局计算异常问题——系统未正确评估触发按钮上方的可用空间，错误地将popover定位到按钮下方导致内容截断；而最底部的按钮5因系统能明确判断上方空间充足，所以定位正常。这属于框架布局逻辑的bug，并非预期行为。

修复方案 #

可以通过手动指定popover的锚点或布局约束，强制系统按预期位置渲染，以下是两种实用方案：

方案1：指定attachmentAnchor强制锚点位置 #

修改PopoverButton，通过attachmentAnchor明确将popover的锚点设为按钮顶部，让弹窗始终显示在按钮上方：

struct PopoverButton: View {
    @State private var isPresented = false
    var text: String
    
    var body: some View {
        Button(action: { isPresented = true }) {
            Text(text)
        }
        // 利用item绑定配合attachmentAnchor控制弹窗锚点
        .popover(item: $isPresented.map { $0 ? () : nil }, attachmentAnchor: .point(.top)) { _ in
            VStack {
                Text("Some Line of Text 1")
                Text("Some Line of Text 2")
                Text("Some Line of Text 3")
                Text("Some Line of Text 4")
                Text("Some Line of Text 5")
                Text("Some Line of Text 6")
                Text("Some Line of Text 7")
                Text("Some Line of Text 8")
                Text("Some Line of Text 9")
            }
            .presentationCompactAdaptation(.popover)
        }
    }
}

方案2：结合preferredContentSize与presentationAnchor #

如果需要更灵活的尺寸控制，可手动设置弹窗首选尺寸，并强制锚点位置：

struct PopoverButton: View {
    @State private var isPresented = false
    var text: String
    
    var body: some View {
        Button(action: { isPresented = true }) {
            Text(text)
        }
        .popover(isPresented: $isPresented) {
            VStack {
                Text("Some Line of Text 1")
                Text("Some Line of Text 2")
                Text("Some Line of Text 3")
                Text("Some Line of Text 4")
                Text("Some Line of Text 5")
                Text("Some Line of Text 6")
                Text("Some Line of Text 7")
                Text("Some Line of Text 8")
                Text("Some Line of Text 9")
            }
            .frame(width: 200)
            .preferredContentSize(CGSize(width: 200, height: 300))
            .presentationCompactAdaptation(.popover)
            .presentationAnchor(.top)
        }
    }
}

补充说明 #

若上述方案仍有边缘场景问题，可通过UIViewRepresentable桥接UIPopoverPresentationController做更底层的配置，但这种方式复杂度较高，仅在必要时使用。

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