Skip to main content

Tab-Navigation mit Sidebar-Anpassung

Beschreibung

Diese View implementiert eine Tab-Navigation mit zwei Bereichen für Home und Settings. Durch die Verwendung von .tabViewStyle(.sidebarAdaptable) passt sich die Darstellung an größere Displays an und kann dort eine Seitenleiste nutzen, während auf kleineren Geräten die klassische Tab-Bar erscheint.

🔍 Zweck

  • Strukturierung einer App in klar getrennte Hauptbereiche
  • Adaptive Navigation für iPhone und iPad mit konsistentem Verhalten
  • Schnelles Prototyping einer Basisnavigation mit Icons und Labels
  • Demonstration der Sidebar-Anpassung in SwiftUI
  • Einstiegspunkt für Apps mit Einstellungsbereich

🖥️ Betriebssystem

iOS

📄 Codebeispiel

import SwiftUI

@main
struct SidebarAdaptableTabsApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

public struct ContentView: View {
    public init() {}

    public var body: some View {
        TabView {
            // Home tab
            HomeScreen()
                .tabItem {
                    // Pair title with an SF Symbol to mirror the original intent
                    Label("Home", systemImage: "house.fill")
                }

            // Settings tab
            SettingsScreen()
                .tabItem {
                    Label("Settings", systemImage: "gearshape.fill")
                }
        }
        // Enable sidebar-adaptable behavior on larger devices
        .tabViewStyle(.sidebarAdaptable)
    }
}

// Simple placeholder for the Home content
private struct HomeScreen: View {
    var body: some View {
        // Minimal content to keep the example focused on navigation
        Text("Home Screen")
            .font(.title2)
            .padding()
            .accessibilityLabel("Home Screen")
    }
}

// Simple placeholder for the Settings content
private struct SettingsScreen: View {
    var body: some View {
        Text("Settings Screen")
            .font(.title2)
            .padding()
            .accessibilityLabel("Settings Screen")
    }
}

// Modern Swift 5.10+ preview syntax
#Preview {
    ContentView()
}