Feat/ios speed limit view

apple/DemoApp/Demo/DemoNavigationView.swift

@@ -2,6 +2,7 @@ import CoreLocation
 import FerrostarCore
 import FerrostarCoreFFI
 import FerrostarMapLibreUI
+import FerrostarSwiftUI
 import MapLibre
 import MapLibreSwiftDSL
 import MapLibreSwiftUI
@@ -68,7 +69,8 @@ struct DemoNavigationView: View {
                 navigationState: ferrostarCore.state,
                 camera: $camera,
                 snappedZoom: .constant(18),
-                useSnappedCamera: $snappedCamera
+                useSnappedCamera: $snappedCamera,
+                onTapExit: { stopNavigation() }
             ) {
                 let source = ShapeSource(identifier: "userLocation") {
                     // Demonstrate how to add a dynamic overlay;
@@ -78,58 +80,30 @@ struct DemoNavigationView: View {
                     }
                 }
                 CircleStyleLayer(identifier: "foo", source: source)
-            }
-            .overlay(alignment: .bottomLeading) {
+            } topCenter: {
+                if let errorMessage {
+                    FerrostarBanner(severity: .error) {
+                        Text(errorMessage)
+                    }
+                    .onTapGesture {
+                        self.errorMessage = nil
+                    }
+                } else if isFetchingRoutes {
+                    FerrostarBanner(severity: .loading) {
+                        Text("Loading route...")
+                    }
+                }
+            } bottomTrailing: {
                 VStack {
-                    HStack {
-                        if isFetchingRoutes {
-                            Text("Loading route...")
-                                .font(.caption)
-                                .padding(.all, 8)
-                                .foregroundColor(.white)
-                                .background(Color.black.opacity(0.7).clipShape(.buttonBorder, style: FillStyle()))
-                        }
-
-                        if let errorMessage {
-                            Text(errorMessage)
-                                .font(.caption)
-                                .padding(.all, 8)
-                                .foregroundColor(.white)
-                                .background(Color.red.opacity(0.7).clipShape(.buttonBorder, style: FillStyle()))
-                                .onTapGesture {
-                                    self.errorMessage = nil
-                                }
-                        }
-
-                        Spacer()
-
-                        NavigationLink {
-                            ConfigurationView()
-                        } label: {
-                            Image(systemName: "gear")
-                        }
+                    Text(locationLabel)
+                        .font(.caption)
                         .padding(.all, 8)
-                        .background(
-                            Color.white
-                                .clipShape(.buttonBorder, style: FillStyle())
-                                .shadow(radius: 4)
-                        )
-                        .padding(.top, 128) // TODO: Move the controls layer to a VStack w/ the InstructionsView
-                    }
-
-                    Spacer()
+                        .foregroundColor(.white)
+                        .background(Color.black.opacity(0.7).clipShape(.buttonBorder, style: FillStyle()))
 
-                    HStack {
-                        Text(locationLabel)
-                            .font(.caption)
-                            .padding(.all, 8)
-                            .foregroundColor(.white)
-                            .background(Color.black.opacity(0.7).clipShape(.buttonBorder, style: FillStyle()))
-
-                        Spacer()
-
-                        if locationServicesEnabled {
-                            Button("Start Navigation") {
+                    if locationServicesEnabled {
+                        if ferrostarCore.state == nil {
+                            FerrostarButton {
                                 Task {
                                     do {
                                         isFetchingRoutes = true
@@ -140,32 +114,24 @@ struct DemoNavigationView: View {
                                         errorMessage = "\(error.localizedDescription)"
                                     }
                                 }
+                            } label: {
+                                Text("Start Nav")
+                                    .font(.body.bold())
                             }
                             .disabled(routes?.isEmpty == true)
-                            .padding(.all, 8)
-                            .background(
-                                Color.white
-                                    .clipShape(.buttonBorder, style: FillStyle())
-                                    .shadow(radius: 4)
-                            )
-                        } else {
-                            Button("Enable Location Services") {
-                                // TODO: enable location services.
-                            }
-                            .padding(.all, 8)
-                            .background(
-                                Color.white
-                                    .clipShape(.buttonBorder, style: FillStyle())
-                                    .shadow(radius: 4)
-                            )
+                            .shadow(radius: 10)
+                        }
+                    } else {
+                        FerrostarButton {
+                            // TODO: enable location services.
+                        } label: {
+                            Text("Enable Location Services")
                         }
                     }
                 }
-                .padding()
-                .padding(.bottom, 72)
-                .task {
-                    await getRoutes()
-                }
+            }
+            .task {
+                await getRoutes()
             }
         }
     }
@@ -232,6 +198,11 @@ struct DemoNavigationView: View {
         )
     }
 
+    func stopNavigation() {
+        ferrostarCore.stopNavigation()
+        camera = .center(initialLocation.coordinate, zoom: 14)
+    }
+
     var locationLabel: String {
         guard let userLocation = locationProvider.lastLocation else {
             return "No location - authed as \(locationProvider.authorizationStatus)"

apple/Sources/FerrostarMapLibreUI/Views/DynamicallyOrientingNavigationView.swift

@@ -7,21 +7,35 @@ import MapLibreSwiftUI
 import SwiftUI
 
 /// A navigation view that dynamically switches between portrait and landscape orientations.
-public struct DynamicallyOrientingNavigationView: View {
+public struct DynamicallyOrientingNavigationView<
+    TopCenter: View,
+    TopTrailing: View,
+    MidLeading: View,
+    BottomTrailing: View
+>: View {
+    @Environment(\.ferrostarTheme) var ferrostarTheme: any FerrostarTheme
+    @Environment(\.ferrostarFormatters) var ferrostarFormatter: any FerrostarFormatters
+
     // TODO: Add orientation handling once the landscape view is constructed.
     @State private var orientation = UIDeviceOrientation.unknown
 
     let styleURL: URL
-    let distanceFormatter: Formatter
     // TODO: Configurable camera and user "puck" rotation modes
 
     private var navigationState: NavigationState?
     private let userLayers: [StyleLayerDefinition]
 
+    var topCenter: TopCenter
+    var topTrailing: TopTrailing
+    var midLeading: MidLeading
+    var bottomTrailing: BottomTrailing
+
     @Binding var camera: MapViewCamera
     @Binding var snappedZoom: Double
     @Binding var useSnappedCamera: Bool
 
+    var onTapExit: () -> Void
+
     /// Initialize a map view tuned for turn by turn navigation.
     ///
     /// - Parameters:
@@ -38,13 +52,23 @@ public struct DynamicallyOrientingNavigationView: View {
         camera: Binding<MapViewCamera>,
         snappedZoom: Binding<Double>,
         useSnappedCamera: Binding<Bool>,
-        distanceFormatter: Formatter = MKDistanceFormatter(),
-        @MapViewContentBuilder _ makeMapContent: () -> [StyleLayerDefinition] = { [] }
+        onTapExit: @escaping () -> Void = {},
+        @MapViewContentBuilder makeMapContent: () -> [StyleLayerDefinition] = { [] },
+        @ViewBuilder topCenter: () -> TopCenter = { Spacer() },
+        @ViewBuilder topTrailing: () -> TopTrailing = { Spacer() },
+        @ViewBuilder midLeading: () -> MidLeading = { Spacer() },
+        @ViewBuilder bottomTrailing: () -> BottomTrailing = { Spacer() }
     ) {
         self.styleURL = styleURL
         self.navigationState = navigationState
-        self.distanceFormatter = distanceFormatter
+        self.onTapExit = onTapExit
+
         userLayers = makeMapContent()
+        self.topCenter = topCenter()
+        self.topTrailing = topTrailing()
+        self.midLeading = midLeading()
+        self.bottomTrailing = bottomTrailing()
+
         _camera = camera
         _snappedZoom = snappedZoom
         _useSnappedCamera = useSnappedCamera
@@ -61,17 +85,21 @@ public struct DynamicallyOrientingNavigationView: View {
                 camera: $camera,
                 snappedZoom: $snappedZoom,
                 useSnappedCamera: $useSnappedCamera,
-                distanceFormatter: distanceFormatter
-            ) {
-                userLayers
-            }
+                onTapExit: onTapExit,
+                makeMapContent: { userLayers },
+                topCenter: { topCenter },
+                topTrailing: { topTrailing },
+                midLeading: { midLeading },
+                bottomTrailing: { bottomTrailing }
+            )
         }
     }
 }
 
 #Preview("Portrait Navigation View (Imperial)") {
     // TODO: Make map URL configurable but gitignored
     let state = NavigationState.modifiedPedestrianExample(droppingNWaypoints: 4)
+
     let formatter = MKDistanceFormatter()
     formatter.locale = Locale(identifier: "en-US")
     formatter.units = .imperial
@@ -81,9 +109,9 @@ public struct DynamicallyOrientingNavigationView: View {
         navigationState: state,
         camera: .constant(.center(state.snappedLocation.clLocation.coordinate, zoom: 12)),
         snappedZoom: .constant(18),
-        useSnappedCamera: .constant(true),
-        distanceFormatter: formatter
+        useSnappedCamera: .constant(true)
     )
+    .ferrostarFormatters(DefaultFerrostarFormatters(distanceFormatter: formatter))
 }
 
 #Preview("Portrait Navigation View (Metric)") {
@@ -98,7 +126,7 @@ public struct DynamicallyOrientingNavigationView: View {
         navigationState: state,
         camera: .constant(.center(state.snappedLocation.clLocation.coordinate, zoom: 12)),
         snappedZoom: .constant(18),
-        useSnappedCamera: .constant(true),
-        distanceFormatter: formatter
+        useSnappedCamera: .constant(true)
     )
+    .ferrostarFormatters(DefaultFerrostarFormatters(distanceFormatter: formatter))
 }