类似 SwiftUI FlowLayout 的视图溢出 VStack 中的其他视图

问题描述

我在 StackOverflow 上发现了一些关于创建灵活布局 (FlowLayout) 的问题，比如通常会显示标签，根据文本使用不同的按钮宽度，如有必要，可以在多行中显示。

代码类似于：

@State var buttonStrings:[String]=[String]()


init()
{
    self.buttonStrings=createStrings()
}


private func item(for text: String) -> some View {
    
Button(action:{doSomething()})
{
Text(text)
}

}

private func generateContent(in g: GeometryProxy) -> some View {
        var width = CGFloat.zero
        var height = CGFloat.zero

        return ZStack(alignment: .topLeading) {
            ForEach(self.buttonStrings,id: \.self) { string in
                self.item(for: string)
                    .padding([.horizontal,.vertical],4)
                    .alignmentGuide(.leading,computeValue: { d in
                        if (abs(width - d.width) > g.size.width)
                        {
                            width = 0
                            height -= d.height
                        }
                        let result = width
                        if string == self.buttonStrings.last! {
                            width = 0 //last item
                        } else {
                            width -= d.width
                        }
                        return result
                    })
                    .alignmentGuide(.top,computeValue: {d in
                        let result = height
                        if string == self.buttonStrings.last! {
                            height = 0 // last item
                        }
                        return result
                    })
            }
        }
    }

它可以工作，但是当这种视图在 VStack 内部并且另一个视图跟随时，它会垂直溢出到另一个视图上（或者根据布局配置和 Stacks 的存在将其驱逐到底部）。

如何避免这种情况，灵活的视图不会溢出或太大？事实上，它内部的 Views 被置换了，这导致了这个问题。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

flowlayout geometry overflow swiftui