ios - SwiftUI .popover 框架大小不正确

Question

在 iOS 16.4 中，我们现在可以在 .popover 中使用 .presentationCompactAdaptation(.none) 在 iOS 上实现真正的弹出框(紧凑屏幕尺寸)。

SomeView()
    .popover(isPresented: $isPopoverOpen) {
        Text("Hello world!")
            .fixedSize(horizontal: false, vertical: true)
            .padding()
            .presentationCompactAdaptation(.none)
    }

这会给我们类似的东西:

太棒了，它按预期工作了!

当弹出窗口中的 Text() 跨越多行时，就会出现问题。由于某种原因，弹出窗口的高度只会增长到一定高度(使用非动态 .body 字体约 3 行)。下面是使用一些 Lorem Ipsum 文本来说明该问题。请注意，由于弹出框高度太短，末端如何被剪掉:

如何使弹出窗口适合 Text() 内容？我可以静态定义高度，但我希望弹出窗口能够完美适合内容。

Answer 1

您可以使用此 approach 获取 Text 元素的高度.

为此，您可以获取文本的高度并设置您收到的高度。 这就是代码的样子

struct ContentLengthPreference: PreferenceKey {
    static var defaultValue: CGFloat { 0 }
    
    static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {
        value = nextValue()
    }
}

struct ContentView: View {
    @State private var isPopoverOpen = true
    @State var textHeight: CGFloat = 0 // <-- this
    
    var body: some View {
        Text("Hello, World!")
            .popover(isPresented: $isPopoverOpen) {
                Text("""
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                        """
                )
                .overlay(
                    GeometryReader { proxy in
                        Color
                            .clear
                            .preference(key: ContentLengthPreference.self,
                                        value: proxy.size.height) // <-- this
                    }
                )
                .onPreferenceChange(ContentLengthPreference.self) { value in // <-- this
                    DispatchQueue.main.async {
                        print (value)
                        self.textHeight = value
                    }
                }
                .fixedSize(horizontal: false, vertical: true)
                .frame(height: textHeight)
                .padding()
                .presentationCompactAdaptation(.none)
                
            }
    }
}

带有长文本的弹出框

带有短文本的弹出框

祝你编码愉快!