SwiftUI の List には、コードに直接書き込む「静的リスト」と、配列データから生成する「動的リスト」の2種類があります。それぞれの特徴と使い分けを解説します。
静的リスト
静的リストは、List の中にビューを直接記述する方式です。項目が固定されている設定画面などに適しています。
struct SettingsView: View { var body: some View { List { Text("アカウント") Text("通知") Text("プライバシー") Text("ヘルプ") } } }
静的リストでは異なる種類のビューを自由に混在させることができます。
struct ProfileView: View { var body: some View { List { Image(systemName: "person.circle.fill") .font(.system(size: 60)) Text("ユーザー名") .font(.headline) Label("設定", systemImage: "gear") Button("ログアウト") { // ログアウト処理 } .foregroundColor(.red) } } }
動的リスト
動的リストは、配列やコレクションからリストを生成する方式です。データベースや API から取得したデータを表示する場合に使います。
struct TaskListView: View { let tasks = ["買い物", "掃除", "洗濯", "料理"] var body: some View { List(tasks, id: \.self) { task in Text(task) } } }
データが変更されると、リストも自動的に更新されます。@State や @ObservedObject と組み合わせることで、リアクティブな UI を構築できます。
struct TaskListView: View { @State private var tasks = ["買い物", "掃除", "洗濯"] var body: some View { List(tasks, id: \.self) { task in Text(task) } Button("タスク追加") { tasks.append("新しいタスク") } } }
静的と動的の混在
List と ForEach を組み合わせることで、静的な要素と動的な要素を1つのリストに混在させることができます。
struct MixedListView: View { let recentItems = ["項目1", "項目2", "項目3"] var body: some View { List { // 静的な要素 Section("アクション") { Label("新規作成", systemImage: "plus") Label("検索", systemImage: "magnifyingglass") } // 動的な要素 Section("最近の項目") { ForEach(recentItems, id: \.self) { item in Text(item) } } } } }
静的リスト
項目が固定、異なる種類のビューを混在可能、設定画面向き
動的リスト
データから自動生成、配列の変更に追従、一覧表示向き
アプリの要件に応じて、静的リストと動的リストを適切に使い分けましょう。
