SwiftUI:如何在动态列表或 LazyVStack

问题描述

我想在 Lazyvstack 中获取视图的框架。嵌入在 ScrollView 中的 Lazyvstack 显示聊天消息(文本和图像)。

因为内容是动态调整大小的,所以我无法使用 GeometryReader 代理。将 GeometryReader 放入我的 Lazyvstack 会破坏布局。 (我假设是因为动态调整大小。)

是否有其他方法可以获取 Lazyvstack 中视图的框架?

下面是我想做的事情的简单表示。理想情况下,我希望在 MessageView 中有一个 GeometryReader,但这会弄乱垂直间距。

struct ChatView: View {
    var body: some View {
        GeometryReader { geometry in
            ScrollView {
                Lazyvstack {
                    ForEach(messages,id: \.id) { message in
                        MessageView(message: message)
                    }
                }
            }
        }
    }
}

struct MessageView: View {
    
    var message: Message
    
    var body: some View {
        // GeometryReader here is not possible with dynamic row heights
        if message.text != nil {
            Text(message.text!)
        } else if message.imageData != nil {
            Image(uiImage: UIImage(data: message.imageData!))  // <-- Get frame of this Image
        }
    }
}

将 MessageView 合并到 ChatView 中是不可取的,因为 MessageView 涉及很多视图,需要是一个独立的结构。

解决方法

您需要在要测量的帧的视图背景中使用 GeometryReader,例如

var body: some View {
    if message.text != nil {
        Text(message.text!)
    } else if message.imageData != nil {
        Image(uiImage: UIImage(data: message.imageData!))
          .background(GeometryReader { gp in
             // gp.frame(in: .global)   // << eg. frame in global coordinates
          })
    }
}

另见https://stackoverflow.com/a/62466397/12299030