SwiftUI 列表的行高 - 如何控制？答案

【问题标题】：SwiftUI Row Height of List - how to control?SwiftUI 列表的行高 - 如何控制？
【发布时间】：2020-02-03 03:25:52
【问题描述】：

我在 SwiftUI 中有一个简单的列表。代码和屏幕截图包括在下面。我想减少列表中每一行的高度（因此行和文本行之间的空间更小）。

我已经尝试在 HStack 中添加“.frame(height: 20)”，但它只允许增加行距！

有没有办法做到这一点？

谢谢！

杰拉德

import SwiftUI

struct PressureData: Identifiable {
  let id: Int
  let timeStamp: String
  let pressureVal: Int
}

struct ContentView : View {
  @State var pressureList = [
    PressureData(id: 0, timeStamp: "11:49:57", pressureVal: 10),
    PressureData(id: 1, timeStamp: "11:49:56", pressureVal: 8),
    PressureData(id: 2, timeStamp: "11:49:55", pressureVal: 9),
    PressureData(id: 3, timeStamp: "11:49:54", pressureVal: 1),
  ]

  var body: some View {
    VStack {
        Text("Pressure Readings")
            .font(.system(size: 30))
        List(pressureList) { row in
            HStack {
               Spacer()
                Text(row.timeStamp)
                Text("--->")
                Text(String(row.pressureVal))
                Spacer()
            } .frame(height: 30)
        }
    }
  }
}

【问题讨论】：

标签： listview formatting swiftui

【解决方案1】：

使用 Environment 变量设置列表中行的最小高度，然后将 HStack 框架高度更改为您想要的高度。

代码如下：

var body: some View {
    VStack {
        Text("Pressure Readings")
            .font(.system(size: 30))
        List(pressureList) { row in
            HStack {
                Spacer()
                Text(row.timeStamp)
                Text("--->")
                Text(String(row.pressureVal))
                Spacer()
            }.frame(height: 10)
        }.environment(\.defaultMinListRowHeight, 10)
    }
}

这是输出：

【讨论】：