ios - 从数组添加 `overlay` 修饰符 | swift 用户界面

Question

我有一个数组，其中包含一堆具有首选对齐方式的元素。我正在尝试通过 overlay 修饰符将此数组中的元素添加到 View 中。但是，我无法让它工作。这是我到目前为止所尝试过的

 struct ContentView: View {
    struct ViewText {
        var label: String
        var alignment: Alignment
        var id: String
    }
    
    var viewArray: [ViewText] = [
        ViewText(label: "Hello 1", alignment: .topLeading, id: "1"),
        ViewText(label: "Hello 2", alignment: .topTrailing, id: "2"),
        ViewText(label: "Hello 3", alignment: .bottomLeading, id: "3"),
        ViewText(label: "Hello 4", alignment: .bottomTrailing, id: "4")
    ]
    
    
    var body: some View {
        var backgroundView = Rectangle().frame(width: 100, height: 100).background(Color.red)
        
        ForEach(viewArray, id: \.id) { element in
            backgroundView.overlay(alignment: element.alignment) {
                Text(element.label).foregroundColor(.white)
            }
        }
        
        
    }
}

上述代码的结果

预期结果

上面的代码不起作用。它为数组中存在的每个覆盖添加多个背景 View 。关于如何让它发挥作用有什么想法吗？非常感谢您的宝贵时间

Answer 1

使用 ZStack，它可以与 ForEach 一起使用，并且还可以将 View 相互叠加。

Rectangle().frame(width: 100, height: 100)
    .overlay {
        ZStack {
            ForEach(viewArray, id: \.id) { element in
                Text(element.label).foregroundColor(.white)
                    .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: element.alignment)
            }
        }
    }

请注意，我使用了 maxWidth: .infinity, maxHeight: .infinity 来使 ZStack 与 矩形 的框架相匹配。

输出: