リストのSwiftUI行の高さ-制御する方法?


9

SwiftUIにシンプルなリストがあります。以下に含まれるコードとスクリーンショット。リストの各行の高さを低くしたいと思います(そのため、行とテキスト行の間のスペースが狭くなっています)。

私はすでに ".frame(height:20)"をHStackに追加しようとしましたが、行間隔を増やすことしかできません!

それを行う方法はありますか?

ありがとう!

ジェラール

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)
        }
    }
  }
}

ここに画像の説明を入力してください

回答:


24

環境変数を使用してリストの行の最小の高さを設定し、その後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)
        }
  }

出力は次のとおりです。

ここに画像の説明を入力してください


完璧-まさに私が探していたもの。ラジブの迅速な対応に感謝-多くの方に感謝します!
Gerard、

グレート答え、SwiftUI :)で多くの隠されたトリックがある
のMichałZiobroは、
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.