【SwiftUI】Stack(スタック)の使い方

  • URLをコピーしました!
目次

概要

スタックはレイアウトで使用するコンテナビューです。
3種類のスタックがあります。

  • HStack
  • VStack
  • ZStack

HStack

HStackは子オブジェクトを水平方向に並べて表示します。

宣言

@frozen struct HStack<Content> where Content : View

使用例

struct ContentView: View {
    var body: some View {
        HStack {
            Text("1")
            Text("2")
            Text("3")
        }
    }
}

VStack

VStackは子オブジェクトを垂直方向に並べて表示します。

宣言

@frozen struct VStack<Content> where Content : View

使用例

struct ContentView: View {
    var body: some View {
        VStack {
            Text("1")
            Text("2")
            Text("3")
        }
    }
}

ZStack

ZStackは子オブジェクトを重ねて表示します。
単純に1,2,3を重ねると分かりにくいので文字サイズを変えました。

宣言

@frozen struct ZStack<Content> where Content : View

使用例

struct ContentView: View {
    var body: some View {
        ZStack {
            Text("1")
                .font(.system(size: 100))
            Text("2")
                .font(.system(size: 100))
            Text("3")
                .font(.system(size: 200))
        }
    }
}
  • URLをコピーしました!
目次