swift 调整LazyVGrid以确认每个GridItem为百分比

ljo96ir5  于 2022-12-10  发布在  Swift
关注(0)|答案(1)|浏览(153)

因此,我使用以下代码构建一个具有3列的VGrid:

LazyVGrid(columns: [
        GridItem(.flexible(), alignment: .top),
        GridItem(.flexible(), alignment: .top),
        GridItem(.flexible(), alignment: .top)
    ], spacing: 5) {
        locationColumn
        distanceColumn
        hoursColumn
    }

输出如下:

调整每个GridItem的最佳方法是什么,以便我可以让locationColumn始终为20%,distanceColumn始终为40%,hoursColumn始终为40%,这等于100%的全宽度视图。
所有我看到的是最小和最大被用作minimum: 50, maximum: 100-我希望空间是100%的全宽在所有时间与所有3列。

58wvjzkj

58wvjzkj1#

在这段代码中,你甚至没有决定视图的大小。你打算如何在可用的空间之间划分你的列?
最简单的方法是将LazyVGrid包含在GeometryReader中,然后使用其中的大小。

GeometryReader { geometry in
    LazyVGrid(columns: [
        GridItem(.fixed(geometry.size.width * 0.2), alignment: .top),
        GridItem(.fixed(geometry.size.width * 0.4), alignment: .top),
        GridItem(.fixed(geometry.size.width * 0.4), alignment: .top)
    ], spacing: 5) {
        locationColumn
        distanceColumn
        hoursColumn
    }
}

如果您恰好知道想要的视图宽度,只需执行以下操作:

LazyVGrid(columns: [
      GridItem(.fixed(viewWidth * 0.2), alignment: .top),
      GridItem(.fixed(viewWidth * 0.4), alignment: .top),
      GridItem(.fixed(viewWidth * 0.4), alignment: .top)
], spacing: 5) {
      locationColumn
      distanceColumn
      hoursColumn
}

相关问题