SwiftUI タブバー付きマルチページ構成
import SwiftUI
struct ContentView: View {
var body: some View {
TabView {
HomeView()
.tabItem {
Label("ホーム", systemImage: "house")
}
SearchView()
.tabItem {
Label("検索", systemImage: "magnifyingglass")
}
SettingsView()
.tabItem {
Label("設定", systemImage: "gearshape")
}
}
}
}
HomeView
import SwiftUI
struct HomeView: View {
var body: some View {
NavigationView {
VStack(spacing: 20) {
Text("ホーム画面")
.font(.largeTitle)
NavigationLink("詳細ページへ") {
DetailView()
}
.padding()
}
.navigationTitle("Home")
}
}
}
SearchView.swift
import SwiftUI
struct SearchView: View {
@State private var keyword = ""
var body: some View {
VStack(spacing: 20) {
Text("検索ページ")
.font(.largeTitle)
TextField("キーワードを入力", text: $keyword)
.textFieldStyle(RoundedBorderTextFieldStyle())
.padding()
Text("検索ワード: \(keyword)")
}
.padding()
}
}
SettingsView.swift
import SwiftUI
struct SettingsView: View {
var body: some View {
VStack(spacing: 20) {
Text("設定ページ")
.font(.largeTitle)
Toggle("通知をオンにする", isOn: .constant(true))
.padding()
}
.padding()
}
}
DetailView.swift
import SwiftUI
struct DetailView: View {
var body: some View {
VStack(spacing: 20) {
Text("詳細ページ")
.font(.title)
}
.padding()
}
}