方法
ビューを上下左右に寄せる方法は、3つあります。
Spacerビューを使う方法
ひとつ目は、Spacerビューを使う方法です。
ビューを寄せたい方向と逆の方向にSpacerビューを置ことで、寄せられます。
//上寄せ
VStack {
View()
Spacer()
}
//左寄せ
HStack {
View()
Spacer()
}
スタックレイアウトで揃える方法

ふたつ目は、スタックレイアウトで揃える方法です。
スタックレイアウトとは、VStackやHStackのことです。
スタックレイアウトには、引数のalignmentで揃える方向を指定することが出来ます。
//右寄せ
VStack(alignment : .trailing ) {
//ビュー
}
//上寄せ
HStack (alignment : .top ) {
//ビュー
}
frameで指定する方法
frameモディファイアは、ビューのサイズを指定するモディファイアです。
このモディファイアには、alignmentというビューをフレーム内のどこに寄せるかを指定する引数があります。
ビューのフレーム内のどこに寄せるかを、frameモディファイアで指定できるということです。
//中央寄せ
View()
.frame(alignment : .center)
ただ、他の2つの方法とは違い、あくまでビューのフレーム内ということに気をつけてください。
まとめ
ビューを寄せる方法は、次の3つです。
- Spacerビューを使う
- スタックレイアウトで揃える
- frameで指定する
コメント