如何在 SwiftUI 网格中垂直合并单元格

Question

我正在尝试垂直合并 SwiftUI 网格中的单元格。但我不明白怎么办。以下面的例子为例。如何合并两个红色单元格（第一行的第一个单元格和第二行的第一个单元格）。

import SwiftUI

struct ContentView: View {
    var body: some View {
        
        Grid() {
            GridRow {
                Color.red
                Color.green
                    .gridCellColumns(2)
            }
            GridRow {
                Color.red
                Color.blue
                Color.yellow
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

我正在寻找 .gridCellRows(2) 属性，但该属性不存在。

Answer 1

该Grid视图不支持合并行，仅支持列。但可以使用嵌套在外部的Grid内部：GridRowGrid

var body: some View {
        Grid() {
            GridRow {
                Color.red
                Grid() {
                    GridRow {
                        Color.green
                            .gridCellColumns(2)
                    }
                    GridRow {
                        Color.blue
                        Color.yellow
                    }
                }
            }
        }
    }

对于您的示例来说，这是非常硬编码的，并且很难推广到更复杂的布局。并且可能不可能在运行时而不是编译时使其动态。