SwiftUI 要素のレイアウト調整
はじめに
今回は、SwiftUIにおける要素のレイアウト調整を紹介したいと思います。
HTMLがdisplay, positionのようなプロパティを使用することで、要素の並びを調整できるのに対して、 SwiftUIでは「Stack」を組み合わせることで、レイアウト調整を行うことができます。
Stack一覧
以下の色ブロックをレイアウト調整します。
HStack { Text("") .frame(width: 300, height: 300) .background(Color.red) Text("") .frame(width: 200, height: 200) .background(Color.blue) Text("") .frame(width: 100, height: 100) .background(Color.green) }
HStack
HStackは要素を横並びにすることができます。
VStack
VStackは要素を縦並びにすることができます。
ZStack
ZStackは要素を重ね合わせることができます。