SwiftでTabViewを使用してタブを作成する方法

SwiftでTabViewを使用してタブを作成する方法です。

下記のようなイメージです

タブ1を押した時

タブ2を押した時

まず3枚のビューを用意します。

ContentView,FirstView,SecondViewの3枚です。

続いてそれぞれのビューに書くコードを紹介します。

ContentView

import SwiftUI

struct ContentView: View {
    @State private var selectedTab = 0

    var body: some View {
        TabView(selection: $selectedTab) {
            FirstView()
                .tabItem {
                    Label("First", systemImage: "1.circle")
                }
                .tag(0)

            SecondView()
                .tabItem {
                    Label("Second", systemImage: "2.circle")
                }
                .tag(1)
        }
    }
}

#Preview {
    ContentView()
}

FirstView

import SwiftUI

struct FirstView: View {
    var body: some View {
        Text("これは最初のビューです")
    }
}

SecondView

import SwiftUI

struct SecondView: View {
    var body: some View {
        Text("これは二番目のビューです")
    }
}

以上です。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

コメント

コメントする

目次