[SwiftUI]padding修飾子で右にだけ余白を追加するには?

SwiftUI

どうも、ちょげ(@chogetarou)です。

padding修飾子でViewの右にだけ余白を追加する方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

padding修飾子でViewの右にだけ余白を追加するには、padding(Edge.Set, CGFloat = nil)を使います。

まず、Viewにpadding修飾子を付与します。

そして、padding修飾子の第1引数に「.trailing」、第2引数に余白の値を指定します。

SampleView()
    .padding(.trailing, value) //右にvalueの余白を追加

padding修飾子の第1引数に「.trailing」、第2引数に余白を指定することで、Viewの右にだけ余白を追加することが出来ます。

EdgeInsetsクラスを使って、右にパディングを追加する方法もあります。

まず、padding修飾子の引数に EdgeInsetsクラスを指定します。

そして、 EdgeInsetsクラスの引数「trailing」に右の余白を指定します。

他の引数には、「0」を指定します。

SampleView()
  .padding(EdgeInsets(
      top: 0,
      leading: 0,
      bottom: 0,
      trailing: rightPadding
  ))

使用例

struct ContentView: View {
    var body: some View {
        HStack (spacing: 0) {
            Rectangle()
                .frame(width: 100, height: 100)
                .foregroundColor(.green)
            Rectangle()
                .frame(width: 100, height: 100)
                .foregroundColor(.yellow)
                .padding(.leading, 30)
            Rectangle()
                .frame(width: 100, height: 100)
                .foregroundColor(.red)
        }
    }
}

コメント

タイトルとURLをコピーしました