df/FloorFilter_III

Examples/Examples/FloorFilterExampleView.swift

@@ -19,25 +19,30 @@ struct FloorFilterExampleView: View {
     /// Make a map from a portal item.
     static func makeMap() -> Map {
         // Multiple sites/facilities: Esri IST map with all buildings.
-//        let portal = Portal(url: URL(string: "https://indoors.maps.arcgis.com/")!, isLoginRequired: false)
-//        let portalItem = PortalItem(portal: portal, id: Item.ID(rawValue: "49520a67773842f1858602735ef538b5")!)
+        //        let portal = Portal(url: URL(string: "https://indoors.maps.arcgis.com/")!, isLoginRequired: false)
+        //        let portalItem = PortalItem(portal: portal, id: Item.ID(rawValue: "49520a67773842f1858602735ef538b5")!)
 
         // Redlands Campus map.
         let portal = Portal(url: URL(string: "https://runtimecoretest.maps.arcgis.com/")!, isLoginRequired: false)
         let portalItem = PortalItem(portal: portal, id: Item.ID(rawValue: "7687805bd42549f5ba41237443d0c60a")!) //<= another multiple sites/facilities
 
         // Single site (ESRI Redlands Main) and facility (Building L).
-//         let portal = Portal(url: URL(string: "https://indoors.maps.arcgis.com/")!, isLoginRequired: false)
-//         let portalItem = PortalItem(portal: portal, id: Item.ID(rawValue: "f133a698536f44c8884ad81f80b6cfc7")!)
+        //         let portal = Portal(url: URL(string: "https://indoors.maps.arcgis.com/")!, isLoginRequired: false)
+        //         let portalItem = PortalItem(portal: portal, id: Item.ID(rawValue: "f133a698536f44c8884ad81f80b6cfc7")!)
 
         return Map(item: portalItem)
     }
 
+    /// Determines the arrangement of the inner `FloorFilter` UI componenets.
+    private let floorFilterAlignment = Alignment.bottomLeading
+
+    /// Determines the appropriate time to initialize the `FloorFilter`.
     @State private var isMapLoaded: Bool = false
 
     @State private var mapLoadError: Bool = false
 
-    @State private var viewpoint = Viewpoint(
+    /// The initial viewpoint of the map.
+    @State private var viewpoint: Viewpoint? = Viewpoint(
         center: Point(
             x: -117.19496,
             y: 34.05713,
@@ -56,14 +61,20 @@ struct FloorFilterExampleView: View {
         .onViewpointChanged(kind: .centerAndScale) {
             viewpoint = $0
         }
-        .overlay(alignment: .bottomLeading) {
+        /// Preserve the current viewpoint when a keyboard is presented in landscape.
+        .ignoresSafeArea(.keyboard, edges: .bottom)
+        .overlay(alignment: floorFilterAlignment) {
             if isMapLoaded,
                let floorManager = map.floorManager {
                 FloorFilter(
                     floorManager: floorManager,
+                    alignment: floorFilterAlignment,
                     viewpoint: $viewpoint
                 )
-                .frame(height: 300)
+                .frame(
+                    maxWidth: 300,
+                    maxHeight: 300
+                )
                 .padding(36)
             } else if mapLoadError {
                 Label(

Sources/ArcGISToolkit/Components/FloorFilter/FloorFilter.swift

@@ -21,166 +21,120 @@ public struct FloorFilter: View {
     /// Creates a `FloorFilter`.
     /// - Parameters:
     ///   - floorManager: The floor manager used by the `FloorFilter`.
+    ///   - alignment: Determines the display configuration of Floor Filter elements.
+    ///   - automaticSelectionMode: The selection behavior of the floor filter.
     ///   - viewpoint: Viewpoint updated when the selected site or facility changes.
     public init(
         floorManager: FloorManager,
-        viewpoint: Binding<Viewpoint>? = nil
+        alignment: Alignment,
+        automaticSelectionMode: FloorFilterAutomaticSelectionMode = .always,
+        viewpoint: Binding<Viewpoint?> = .constant(nil)
     ) {
         _viewModel = StateObject(wrappedValue: FloorFilterViewModel(
+            automaticSelectionMode: automaticSelectionMode,
             floorManager: floorManager,
             viewpoint: viewpoint
         ))
+        self.alignment = alignment
+        self.viewpoint = viewpoint
     }
 
     /// The view model used by the `FloorFilter`.
     @StateObject private var viewModel: FloorFilterViewModel
 
-    /// A Boolean value that indicates whether the site or facility selector is hidden.
-    @State private var isSelectorHidden: Bool = true
+    /// A Boolean value that indicates whether the site and facility selector is hidden.
+    @State private var isSitesAndFacilitiesHidden: Bool = true
 
-    /// A Boolean value that indicates whether the levels view is currently collapsed.
-    @State private var isLevelsViewCollapsed: Bool = false
+    /// The alignment configuration.
+    private let alignment: Alignment
 
-    /// The selected facility's levels, sorted by `level.verticalOrder`.
-    private var sortedLevels: [FloorLevel] {
-        viewModel.selectedFacility?.levels.sorted() {
-            $0.verticalOrder > $1.verticalOrder
-        } ?? []
-    }
+    /// The width of the level selector.
+    private let filterWidth: CGFloat = 60
 
-    public var body: some View {
-        Group {
-            if viewModel.isLoading {
-                VStack {
-                    Spacer()
-                    ProgressView()
-                        .padding(12)
-                }
-            } else {
-                HStack(alignment: .bottom) {
-                    VStack {
-                        Spacer()
-                        VStack {
-                            if viewModel.hasLevelsToDisplay {
-                                LevelsView(
-                                    levels: sortedLevels,
-                                    isCollapsed: $isLevelsViewCollapsed
-                                )
-                                Divider()
-                                    .frame(width: 30)
-                            }
-                            // Site button.
-                            Button {
-                                isSelectorHidden.toggle()
-                            } label: {
-                                Image(systemName: "building.2")
-                            }
-                            .padding(4)
-                        }
-                        .esriBorder()
-                    }
-                    if !isSelectorHidden {
-                        SiteAndFacilitySelector(isHidden: $isSelectorHidden)
-                            .esriBorder()
-                    }
-                }
-            }
+    /// Button to open and close the site and facility selector.
+    private var sitesAndFacilitiesButton: some View {
+        Button {
+            isSitesAndFacilitiesHidden.toggle()
+        } label: {
+            Image(systemName: "building.2")
+                .padding(.toolkitDefault)
         }
-        .environmentObject(viewModel)
+        .frame(maxWidth: .infinity)
     }
-}
-
-/// A view displaying the levels in the selected facility.
-struct LevelsView: View {
-    /// The levels to display.
-    let levels: [FloorLevel]
-
-    /// A Boolean value that indicates whether the view shows only the selected level or all levels.
-    /// If the value is `false`, the view will display all levels. Otherwise, display only the
-    /// selected level.
-    @Binding var isCollapsed: Bool
 
-    /// The view model used by the `LevelsView`.
-    @EnvironmentObject var viewModel: FloorFilterViewModel
-
-    /// The height of the scroll view's content.
-    @State private var scrollViewContentHeight: CGFloat = .zero
+    /// Displays the available levels.
+    @ViewBuilder private var levelSelector: some View {
+        LevelSelector(
+            levels: viewModel.sortedLevels,
+            isTopAligned: isTopAligned
+        )
+    }
 
-    public var body: some View {
+    /// A view that allows selecting between levels.
+    private var floorFilter: some View {
         VStack {
-            if !isCollapsed,
-               levels.count > 1 {
-                CollapseButton(isCollapsed: $isCollapsed)
-                Divider()
-                    .frame(width: 30)
-                ScrollView {
-                    LevelsStack(levels: levels)
-                        .background(
-                            GeometryReader { geometry -> Color in
-                                DispatchQueue.main.async {
-                                    scrollViewContentHeight = geometry.size.height
-                                }
-                                return .clear
-                            }
-                        )
+            if isTopAligned {
+                sitesAndFacilitiesButton
+                if viewModel.hasLevelsToDisplay {
+                    Divider()
+                    levelSelector
                 }
-                .frame(maxHeight: scrollViewContentHeight)
             } else {
-                // Button for the selected level.
-                Button {
-                    if levels.count > 1 {
-                        isCollapsed.toggle()
-                    }
-                } label: {
-                    Text(viewModel.selectedLevel?.shortName ?? (levels.first?.shortName ?? "None"))
+                if viewModel.hasLevelsToDisplay {
+                    levelSelector
+                    Divider()
                 }
-                .selected(true)
-                .padding(4)
+                sitesAndFacilitiesButton
             }
         }
+        .frame(width: filterWidth)
+        .esriBorder()
+        .frame(maxHeight: .infinity, alignment: alignment)
     }
-}
-
-/// A vertical list of floor levels.
-struct LevelsStack: View {
-    let levels: [FloorLevel]
-
-    /// The view model used by the `LevelsView`.
-    @EnvironmentObject
-    var viewModel: FloorFilterViewModel
 
-    var body: some View {
-        VStack {
-            ForEach(levels) { level in
-                Button {
-                    viewModel.selection = .level(level)
-                } label: {
-                    Text(level.shortName)
+    /// A configured `SiteAndFacilitySelector` view.
+    ///
+    /// The layering of the `SiteAndFacilitySelector` over a `RoundedRectangle` is needed to
+    /// produce a rounded corners effect. We can not simply use `.esriBorder()` here because
+    /// applying the `cornerRadius()` modifier on `SiteAndFacilitySelector`'s underlying
+    /// `NavigationView` causes a rendering bug. This bug remains in iOS 16 with
+    /// `NavigationStack` and has been reported to Apple as FB10034457.
+    private var siteAndFacilitySelector: some View {
+        ZStack {
+            RoundedRectangle(cornerRadius: 8)
+                .fill(Color(uiColor: .systemBackground))
+                .esriBorder()
+            SiteAndFacilitySelector(isHidden: $isSitesAndFacilitiesHidden)
+                .onChange(of: viewpoint.wrappedValue) {
+                    viewModel.onViewpointChanged($0)
                 }
-                .selected(level == viewModel.selectedLevel)
-                .padding(4)
-            }
+                .padding()
         }
+        .opacity(isSitesAndFacilitiesHidden ? .zero : 1)
     }
-}
-
-/// A button used to collapse the floor level list.
-struct CollapseButton: View {
-    /// Allows the user to toggle the visibility of the site and facility selector.
-    @Binding
-    var isCollapsed: Bool
 
-    var body: some View {
-        Button {
-            isCollapsed.toggle()
-        } label: {
-            Image(systemName: "xmark")
+    /// Indicates that the selector should be presented with a top oriented aligment configuration.
+    private var isTopAligned: Bool {
+        alignment.vertical == .top
+    }
+
+    /// The `Viewpoint` used to pan/zoom to the selected site/facilty.
+    /// If `nil`, there will be no automatic pan/zoom operations or automatic selection support.
+    private var viewpoint: Binding<Viewpoint?>
+
+    public var body: some View {
+        HStack(alignment: .bottom) {
+            if alignment.horizontal == .trailing {
+                siteAndFacilitySelector
+                floorFilter
+            } else {
+                floorFilter
+                siteAndFacilitySelector
+            }
         }
-        .padding(EdgeInsets(
-            top: 2,
-            leading: 4,
-            bottom: 2,
-            trailing: 4
-        ))
+        // Ensure space for filter text field on small screens in landscape
+        .frame(minHeight: 100)
+        .environmentObject(viewModel)
+        .disabled(viewModel.isLoading)
     }
 }

Sources/ArcGISToolkit/Components/FloorFilter/FloorFilterAutomaticSelectionMode.swift

@@ -0,0 +1,24 @@
+// Copyright 2022 Esri.
+
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+// http://www.apache.org/licenses/LICENSE-2.0
+
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+/// Defines automatic selection behavior.
+public enum FloorFilterAutomaticSelectionMode {
+    /// Always update selection based on the current viewpoint; clear the selection when the user
+    /// navigates away.
+    case always
+    /// Only update the selection when there is a new site or facility in the current viewpoint; don't clear
+    /// selection when the user navigates away.
+    case alwaysNotClearing
+    /// Never update selection based on the map or scene view's current viewpoint.
+    case never
+}