Skip to content

Commit

Permalink
New component: FloorFilter (#422)
Browse files Browse the repository at this point in the history
* Initial implementation: FloorFilter for WPF

This PR/Commit includes the following:

- Docs and a very basic sample
- (internal) FilteringListView is a list view with unique search/filter capabilities and an equally unique selection behavior, which is needed to enable the navigation experience in the floor browser.
- (internal) FloorFilterController provides most of the filtering, selection, and navigation behavior
- FloorFilter UI implementation with rich templating and customization options

* Changes from first review

* Small fixes to work better with large buildings

* Add Xamarin.Forms implementation

* Changes from self-review

* Xamarin template clean up

* Add UWP

Adds all features except search/filter for lists

* Switch to icon font on UWP

* Fix button appearance issues UWP

* Add filtering listview to UWP

* Fix WPF

* Clean up

* Fixes and simplification

* Changes from review

* Label changes and other updates
  • Loading branch information
nCastle1 authored Apr 21, 2022
1 parent 1864848 commit 371bb0f
Show file tree
Hide file tree
Showing 34 changed files with 7,328 additions and 0 deletions.
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ The ArcGIS Runtime SDK for .NET Toolkit contains controls and components to acce
|[BookmarksView](https://esri.github.io/arcgis-toolkit-dotnet/bookmarks-view.html) | ![image](https://user-images.githubusercontent.com/29742178/150397137-28029b87-5384-41b1-aabf-98260885152d.png) | Show and navigate to bookmarks from a map or a custom list. | iOS, Android, Xamarin.Forms, UWP, WPF |
|Compass | ![compass](https://user-images.githubusercontent.com/1378165/73389839-d9c8f500-4289-11ea-923c-18232489b3e0.png) | Show a compass direction when the map or scene is rotated. | iOS, Android, Xamarin.Forms, UWP, WPF |
|FeatureDataField | ![FeatureDataField](https://user-images.githubusercontent.com/1378165/73389879-ebaa9800-4289-11ea-8e4e-de153a6a371a.png) | Display and optionally allow editing of a single field attribute of a feature. | UWP, WPF |
|[FloorFilter](https://esri.github.io/arcgis-toolkit-dotnet/floor-filter.html) | ![image](https://user-images.githubusercontent.com/29742178/158746908-71a39e28-596f-44b6-9230-e2a04bdaeb9e.png) | Browse floor-aware maps and scenes and filter the view to show levels in a facility. | WPF, Xamarin.Forms, UWP |
|Legend | <img src="https://user-images.githubusercontent.com/1378165/73389924-011fc200-428a-11ea-91bf-4ea1c2bf6683.png" width="105" title="Legend" />| Display a legend for a single layer in a map, optionally including sub layers). | Android, iOS, Xamarin.Forms, WPF, UWP |
|MeasureToolbar | ![MeasureToolbar](https://user-images.githubusercontent.com/1378165/73389958-0f6dde00-428a-11ea-8c78-7192d49ea605.png) | Measure distances, areas, and features in a map view. | UWP, WPF |
|[OverviewMap](https://esri.github.io/arcgis-toolkit-dotnet/overview-map.html) | <img src="https://user-images.githubusercontent.com/29742178/121975740-34f07000-cd37-11eb-9162-462925cb3fe7.png" width="150" title="Overview Map" /> | Display an interactive inset map for a map or scene. | Xamarin.Forms, UWP, WPF |
Expand Down
6 changes: 6 additions & 0 deletions docs/controls.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,11 @@ Displays and optionally allows editing of a single field attribute of a feature.

![FeatureDataField](https://user-images.githubusercontent.com/1378165/73389879-ebaa9800-4289-11ea-8e4e-de153a6a371a.png)

### FloorFilter

Browse floor-aware maps and scenes and filter the view to show levels in a facility.

![FloorFilter](https://user-images.githubusercontent.com/29742178/158746908-71a39e28-596f-44b6-9230-e2a04bdaeb9e.png)

### Legend

Expand Down Expand Up @@ -95,6 +100,7 @@ Allows interactively defining a temporal range (i.e. time extent) and animating
|[BookmarksView](bookmarks-view.md) ||||||
|Compass ||||||
|FeatureDataField ||| [![GitHub Issue State](https://img.shields.io/github/issues/detail/s/Esri/arcgis-toolkit-dotnet/198.svg)](https://github.com/Esri/arcgis-toolkit-dotnet/issues/198) | [![GitHub Issue State](https://img.shields.io/github/issues/detail/s/Esri/arcgis-toolkit-dotnet/198.svg)](https://github.com/Esri/arcgis-toolkit-dotnet/issues/198) | [![GitHub Issue State](https://img.shields.io/github/issues/detail/s/Esri/arcgis-toolkit-dotnet/198.svg)](https://github.com/Esri/arcgis-toolkit-dotnet/issues/198) |
|[FloorFilter](floor-filter.md) ||||||
|Legend ||||||
|LayerLegend ||||||
|MeasureToolbar ||| [![GitHub Issue State](https://img.shields.io/github/issues/detail/s/Esri/arcgis-toolkit-dotnet/199.svg)](https://github.com/Esri/arcgis-toolkit-dotnet/issues/199) | [![GitHub Issue State](https://img.shields.io/github/issues/detail/s/Esri/arcgis-toolkit-dotnet/199.svg)](https://github.com/Esri/arcgis-toolkit-dotnet/issues/199) | [![GitHub Issue State](https://img.shields.io/github/issues/detail/s/Esri/arcgis-toolkit-dotnet/199.svg)](https://github.com/Esri/arcgis-toolkit-dotnet/issues/199) |
Expand Down
94 changes: 94 additions & 0 deletions docs/floor-filter.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
# FloorFilter

FloorFilter allows users to take advantage of floor-aware maps and scenes by surfacing and then filtering floor data.

![image](https://user-images.githubusercontent.com/29742178/158746908-71a39e28-596f-44b6-9230-e2a04bdaeb9e.png)

## Features

- Automatically hides the floor browsing view when the associated map or scene is not floor-aware
- Selects the facility in view automatically
- This behavior can be configured through the `AutomaticSelectionMode` property
- View is space-efficient and can be expanded/collapsed (WPF only)
- Shows the selected facility's levels in proper vertical order
- Filters the map/scene content to show the selected level
- Allows browsing the full floor-aware hierarchy of sites, facilities, and levels
- When consuming simpler maps, simplifies the UI as needed; for example, the site browsing experience is hidden when there is only one (or no) sites
- When browsing, allows dynamic filtering of lists
- Shows the ground floor of all facilities when there is no active selection
- Updates the visibility of floor levels across all facilities (e.g. if you are looking at floor 3 in building A, floor 3 will be shown in neighboring buildings)
- Exposes a full range of template and style properties for easy customization
- Adjusts layout and presentation to work well regardless of positioning - left/right and top/bottom
- Keeps the selected facility visible in the list while the selection is changing in response to map navigation

## Customization

> **NOTE**: Some properties aren't available on all platforms due to platform-specific differences in how the view is implemented.
The following properties enable customization of the view:

- `ZoomToButtonStyle`
- `BrowseButtonStyle`
- `ExpandCollapseButtonStyle`
- `CommonListStyle` - style applied to all lists (levels, sites, facilities)
- `LevelDataTemplate` - displays levels in the non-browsing floor filter experience
- `SiteDataTemplate` - displays sites in the browsing view
- `FacilityDataTemplate` - displays facilities in the browsing view
- `DifferentiatingFacilityDataTemplate` - displays facilities in the list of all facilities from all sites

The following properties enable customization or localization of text displayed in the view:

- `BackButtonLabel`
- `AllFacilitiesLabel`
- `AllFloorsLabel`
- `CloseLabel`
- `ExpandLabel`
- `CollapseLabel`
- `ZoomToLabel`
- `BrowseLabel`
- `NoResultsMessage`
- `SearchPlaceholder`

## Usage

WPF:

```xml
<Grid>
<esri:MapView x:Name="MyMapView" />
<esri:FloorFilter GeoView="{Binding ElementName=MyMapView}" />
</Grid>
```

Xamarin.Forms:

```xml
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="48" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<esri:MapView
x:Name="MyMapView"
Grid.RowSpan="2"
Grid.ColumnSpan="2" />
<toolkit:FloorFilter
Grid.Row="1"
Grid.Column="0"
Margin="8,8,8,32"
GeoView="{x:Reference MyMapView}" />
</Grid>
```

UWP:

```xml
<Grid>
<esri:MapView x:Name="MyMapView" />
<esri:FloorFilter GeoView="{Binding ElementName=MyMapView}" />
</Grid>
```
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
<Page
x:Class="Esri.ArcGISRuntime.Toolkit.SampleApp.Samples.FloorFilter.FloorFilterSample"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:converter="using:Esri.ArcGISRuntime.Toolkit.Internal"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:esri="using:Esri.ArcGISRuntime.UI.Controls"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:toolkit="using:Esri.ArcGISRuntime.Toolkit.UI.Controls"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
mc:Ignorable="d">
<Grid>
<esri:MapView x:Name="MyMapView" />
<toolkit:FloorFilter GeoView="{Binding ElementName=MyMapView}" />
</Grid>
</Page>
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
using Esri.ArcGISRuntime.Mapping;
using System;
using Windows.UI.Xaml.Controls;

namespace Esri.ArcGISRuntime.Toolkit.SampleApp.Samples.FloorFilter
{
public sealed partial class FloorFilterSample : Page
{
public FloorFilterSample()
{
InitializeComponent();
MyMapView.Map = new Esri.ArcGISRuntime.Mapping.Map(new Uri("https://www.arcgis.com/home/item.html?id=b4b599a43a474d33946cf0df526426f5"));
}
}
}
7 changes: 7 additions & 0 deletions src/Samples/Toolkit.SampleApp.UWP/Toolkit.Samples.UWP.csproj
Original file line number Diff line number Diff line change
Expand Up @@ -130,6 +130,9 @@
<Compile Include="Samples\Compass\MapViewCompassSample.xaml.cs">
<DependentUpon>MapViewCompassSample.xaml</DependentUpon>
</Compile>
<Compile Include="Samples\FloorFilter\FloorFilterSample.xaml.cs">
<DependentUpon>FloorFilterSample.xaml</DependentUpon>
</Compile>
<Compile Include="Samples\TimeSlider\TimeSliderSample.xaml.cs">
<DependentUpon>TimeSliderSample.xaml</DependentUpon>
</Compile>
Expand Down Expand Up @@ -218,6 +221,10 @@
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="Samples\FloorFilter\FloorFilterSample.xaml">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="Samples\TimeSlider\TimeSliderSample.xaml">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<UserControl
x:Class="Esri.ArcGISRuntime.Toolkit.Samples.FloorFilter.SimpleFloorFilterSample"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:esri="http://schemas.esri.com/arcgis/runtime/2013"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
d:DesignHeight="400"
d:DesignWidth="600"
mc:Ignorable="d">
<Grid>
<esri:MapView x:Name="MyMapView" />
<esri:FloorFilter GeoView="{Binding ElementName=MyMapView}" />
</Grid>
</UserControl>
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@

using Esri.ArcGISRuntime.Mapping;
using System;
using System.Windows.Controls;

namespace Esri.ArcGISRuntime.Toolkit.Samples.FloorFilter
{
public partial class SimpleFloorFilterSample: UserControl
{
public SimpleFloorFilterSample()
{
InitializeComponent();
MyMapView.Map = new Esri.ArcGISRuntime.Mapping.Map(new Uri("https://www.arcgis.com/home/item.html?id=b4b599a43a474d33946cf0df526426f5"));
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
x:Class="Toolkit.Samples.Forms.Samples.FloorFilterSample"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:esri="clr-namespace:Esri.ArcGISRuntime.Xamarin.Forms;assembly=Esri.ArcGISRuntime.Xamarin.Forms"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:toolkit="clr-namespace:Esri.ArcGISRuntime.Toolkit.Xamarin.Forms;assembly=Esri.ArcGISRuntime.Toolkit.Xamarin.Forms"
Title="FloorFilter - MapView"
mc:Ignorable="d">
<ContentPage.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="48" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<esri:MapView
x:Name="MyMapView"
Grid.RowSpan="2"
Grid.ColumnSpan="2" />
<toolkit:FloorFilter
x:Name="FF"
Grid.Row="1"
Grid.Column="0"
Margin="8,8,8,32"
GeoView="{x:Reference MyMapView}" />
</Grid>
</ContentPage.Content>
</ContentPage>
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
using Esri.ArcGISRuntime.Mapping;
using System;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace Toolkit.Samples.Forms.Samples
{
[XamlCompilation(XamlCompilationOptions.Compile)]
[SampleInfoAttribute(Category = "FloorFilter", Description = "Demonstrates FloorFilter with a floor-aware map.")]
public partial class FloorFilterSample : ContentPage
{
public FloorFilterSample()
{
InitializeComponent();
MyMapView.Map = new Esri.ArcGISRuntime.Mapping.Map(new Uri("https://www.arcgis.com/home/item.html?id=b4b599a43a474d33946cf0df526426f5"));
}
}
}
Binary file added src/Toolkit.Forms/Assets/calcite-ui-icons-24.ttf
Binary file not shown.
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@
<ItemGroup>
<None Remove="Assets\BasemapDark.png" />
<None Remove="Assets\BasemapLight.png" />
<None Remove="Assets\calcite-ui-icons-24.ttf" />
<None Remove="Assets\caret-down-small.png" />
<None Remove="Assets\caret-down.png" />
<None Remove="Assets\pin-tear-small.png" />
Expand Down Expand Up @@ -86,6 +87,9 @@
<EmbeddedResource Include="Assets\x-small.png" />
<EmbeddedResource Include="Assets\x.png" />
</ItemGroup>
<ItemGroup>
<EmbeddedResource Include="Assets\calcite-ui-icons-24.ttf" />
</ItemGroup>
<!-- Workaround issue with nuget re-packaging contents from UWP Toolkit library in this package as well -->
<Target Name="FixGetPackagingOutputs" AfterTargets="GetPackagingOutputs">
<ItemGroup>
Expand Down
Loading

0 comments on commit 371bb0f

Please sign in to comment.