【Swift UI】Text構造体を真ん中(center)に配置する方法！

この記事からわかること

index

[open]

＼アプリをリリースしました／

友達や家族の誕生日をメモ！通知も届く-みんなの誕生日-

Text構造体を真ん中(center)に寄せる方法

Swift UIでText構造体を画面の真ん中に配置する方法を4つ紹介します。

紹介する方法

frameモディファイアの引数alignmentにcenterを渡すことで中央寄せにすることができます。

Text("frame")
    .frame(width: 200, alignment: .center)

List構造体の中ではinfinityなどリストの横幅と同等のサイズを渡すことで文字を中央寄せにすることができます。

List {
  Text("frame")
            .frame(maxWidth: .infinity, alignment: .center)
}

multilineTextAlignmentモディファイアを使用することでも中央寄せにすることが可能です。

Text("multilineTextAlignment")
  .multilineTextAlignment(.center)

VStackの引数alignmentにcenterを渡すことでも中央寄せにすることが可能です。

VStack(alignment: .center){
  Text("VStack")
}

HStackとSpacerを使用をすることでも中央寄せにすることが可能です。

HStack {
  Spacer()
  Text("HStack")
  Spacer()
}

まだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。

ご覧いただきありがとうございました。

Swift