Restore the gallery as a NavigationStack with nav/sheet/tab screens

Author: colemancda

Demo/App.swiftpm/Sources/ContentView.swift

@@ -4,32 +4,28 @@ import AndroidSwiftUI
 import SwiftUI
 #endif
 
-/// Gallery of playground screens. A picker selects the active screen; full
-/// `NavigationStack`/`List` navigation returns in a later step.
+/// Gallery of playground screens, navigated with a `NavigationStack`. Each row
+/// pushes a feature screen; `List`-based navigation returns with lazy
+/// containers in the next step.
 struct ContentView: View {
 
-    @State
-    private var screen = "Controls"
-
     var body: some View {
-        VStack(spacing: 0) {
-            Picker("Screen", selection: $screen) {
-                Text("Text").tag("Text")
-                Text("Buttons").tag("Buttons")
-                Text("Stacks").tag("Stacks")
-                Text("State").tag("State")
-                Text("Controls").tag("Controls")
-                Text("Modifiers").tag("Modifiers")
-                Text("Observation").tag("Observation")
+        NavigationStack {
+            ScrollView {
+                VStack(spacing: 0) {
+                    NavigationLink("Text", destination: TextScreen())
+                    NavigationLink("Buttons", destination: ButtonScreen())
+                    NavigationLink("Stacks", destination: StacksScreen())
+                    NavigationLink("State", destination: StateScreen())
+                    NavigationLink("Controls", destination: ControlsScreen())
+                    NavigationLink("Modifiers", destination: ModifierScreen())
+                    NavigationLink("Observation", destination: ObservationScreen())
+                    NavigationLink("Navigation", destination: NavigationScreen())
+                    NavigationLink("Sheets", destination: SheetScreen())
+                    NavigationLink("Tabs", destination: TabScreen())
+                }
             }
-            Divider()
-            if screen == "Text" { TextScreen() }
-            if screen == "Buttons" { ButtonScreen() }
-            if screen == "Stacks" { StacksScreen() }
-            if screen == "State" { StateScreen() }
-            if screen == "Controls" { ControlsScreen() }
-            if screen == "Modifiers" { ModifierScreen() }
-            if screen == "Observation" { ObservationScreen() }
+            .navigationTitle("Gallery")
         }
     }
 }

Demo/App.swiftpm/Sources/NavigationScreen.swift

@@ -0,0 +1,77 @@
+#if canImport(AndroidSwiftUI)
+import AndroidSwiftUI
+#else
+import SwiftUI
+#endif
+
+/// Classic and value-based navigation, plus the dismiss environment action.
+struct NavigationScreen: View {
+
+    @Environment(\.dismiss)
+    private var dismiss
+
+    @State
+    private var showsAlert = false
+
+    var body: some View {
+        VStack(spacing: 16) {
+            Button("Show alert") { showsAlert = true }
+            Text("Value-based navigation")
+            NavigationLink("Push value 1", value: 1)
+            NavigationLink(value: 2) {
+                Text("Push value 2")
+            }
+            Divider()
+            Text("Classic navigation")
+            NavigationLink("Push destination view", destination: ClassicDestination())
+            Divider()
+            Button("Pop with dismiss") {
+                dismiss()
+            }
+        }
+        .navigationDestination(for: Int.self) { value in
+            ValueDestination(value: value)
+        }
+        .alert("An alert", isPresented: $showsAlert, message: "This is an alert message.", buttons: [
+            AlertButton("Cancel", role: .cancel),
+            AlertButton("OK"),
+        ])
+        .navigationTitle("Navigation")
+    }
+}
+
+struct ValueDestination: View {
+
+    let value: Int
+
+    @Environment(\.dismiss)
+    private var dismiss
+
+    var body: some View {
+        VStack(spacing: 16) {
+            Text(verbatim: "Destination for value \(value)")
+            if value < 3 {
+                NavigationLink("Push value \(value + 1)", value: value + 1)
+            }
+            Button("Pop with dismiss") {
+                dismiss()
+            }
+        }
+        .navigationTitle("Value \(value)")
+    }
+}
+
+struct ClassicDestination: View {
+
+    @Environment(\.dismiss)
+    private var dismiss
+
+    var body: some View {
+        VStack(spacing: 16) {
+            Text("Classic destination")
+            Button("Pop with dismiss") {
+                dismiss()
+            }
+        }
+    }
+}

Demo/App.swiftpm/Sources/SheetScreen.swift

@@ -0,0 +1,50 @@
+#if canImport(AndroidSwiftUI)
+import AndroidSwiftUI
+#else
+import SwiftUI
+#endif
+
+/// Sheet presentation, detents and the dismiss environment action.
+struct SheetScreen: View {
+
+    @State
+    private var showsSheet = false
+
+    @State
+    private var showsDetentSheet = false
+
+    var body: some View {
+        VStack(spacing: 16) {
+            Button("Present sheet") {
+                showsSheet = true
+            }
+            Button("Present medium detent sheet") {
+                showsDetentSheet = true
+            }
+        }
+        .sheet(isPresented: $showsSheet) {
+            SheetContent(title: "Full size sheet")
+        }
+        .sheet(isPresented: $showsDetentSheet) {
+            SheetContent(title: "Medium sheet")
+                .presentationDetents([.medium])
+        }
+    }
+}
+
+struct SheetContent: View {
+
+    let title: String
+
+    @Environment(\.dismiss)
+    private var dismiss
+
+    var body: some View {
+        VStack(spacing: 16) {
+            Text(title)
+            Button("Dismiss") {
+                dismiss()
+            }
+        }
+    }
+}

Demo/App.swiftpm/Sources/TabScreen.swift

@@ -0,0 +1,31 @@
+#if canImport(AndroidSwiftUI)
+import AndroidSwiftUI
+#else
+import SwiftUI
+#endif
+
+/// Tab bar with selection.
+struct TabScreen: View {
+
+    @State
+    private var selection = 0
+
+    var body: some View {
+        TabView(selection: $selection) {
+            VStack(spacing: 16) {
+                Text("First tab")
+                Button("Select third tab") {
+                    selection = 2
+                }
+            }
+            .tabItem { Text("One") }
+            .tag(0)
+            Text("Second tab")
+                .tabItem { Text("Two") }
+                .tag(1)
+            Text("Third tab")
+                .tabItem { Text("Three") }
+                .tag(2)
+        }
+    }
+}