XAML-Map-Control/SampleApps/WinUiApp/MainWindow.xaml

308 lines
18 KiB
Plaintext
Raw Normal View History

<Window x:Class="SampleApplication.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:map="using:MapControl"
2022-01-11 19:42:12 +01:00
xmlns:tools="using:MapControl.UiTools"
2025-03-24 19:01:08 +01:00
xmlns:local="using:SampleApplication"
Title="XAML Map Control - WinUI Sample Application">
2021-07-01 22:07:46 +02:00
2021-12-05 17:16:14 +01:00
<Grid>
2021-07-17 23:35:19 +02:00
<Grid.Resources>
<DataTemplate x:Key="PolylineItemTemplate">
<map:MapPolyline Locations="{Binding Locations}" Stroke="Red" StrokeThickness="3"/>
</DataTemplate>
<Style x:Key="PointItemStyle" TargetType="map:MapItem">
<Setter Property="AutoCollapse" Value="True"/>
<Setter Property="FontSize" Value="12"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="map:MapItem">
2023-01-22 16:05:16 +01:00
<Grid>
2021-07-17 23:35:19 +02:00
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="Disabled"/>
<VisualState x:Name="PointerOver"/>
<VisualState x:Name="Pressed"/>
<VisualState x:Name="Selected">
<Storyboard>
2022-11-06 15:27:39 +01:00
<DoubleAnimation Storyboard.TargetName="selectedPath"
Storyboard.TargetProperty="Opacity"
To="0.75" Duration="0"/>
2021-07-17 23:35:19 +02:00
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedUnfocused">
<Storyboard>
2022-11-06 15:27:39 +01:00
<DoubleAnimation Storyboard.TargetName="selectedPath"
Storyboard.TargetProperty="Opacity"
To="0.75" Duration="0"/>
2021-07-17 23:35:19 +02:00
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedPointerOver">
<Storyboard>
2022-11-06 15:27:39 +01:00
<DoubleAnimation Storyboard.TargetName="selectedPath"
Storyboard.TargetProperty="Opacity"
To="0.75" Duration="0"/>
2021-07-17 23:35:19 +02:00
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedPressed">
<Storyboard>
2022-11-06 15:27:39 +01:00
<DoubleAnimation Storyboard.TargetName="selectedPath"
Storyboard.TargetProperty="Opacity"
To="0.75" Duration="0"/>
2021-07-17 23:35:19 +02:00
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
2024-05-28 18:06:56 +02:00
2023-01-21 14:41:03 +01:00
<!-- Path with transformed Geometry -->
2022-11-06 15:27:39 +01:00
<Path Fill="Red" Opacity="0.4" IsHitTestVisible="False">
<Path.Data>
<EllipseGeometry RadiusX="20" RadiusY="20"
Transform="{Binding MapTransform, RelativeSource={RelativeSource TemplatedParent}}"/>
</Path.Data>
</Path>
2023-01-22 16:05:16 +01:00
<!-- MapPath with Location -->
2023-01-21 14:41:03 +01:00
<map:MapPath Stroke="Green" StrokeThickness="2" IsHitTestVisible="False"
Location="{TemplateBinding Location}">
<map:MapPath.Data>
<EllipseGeometry RadiusX="20" RadiusY="20"/>
</map:MapPath.Data>
</map:MapPath>
2021-07-17 23:35:19 +02:00
<Path x:Name="selectedPath" Fill="White" Opacity="0">
<Path.Data>
<EllipseGeometry RadiusX="12" RadiusY="12"/>
</Path.Data>
</Path>
<Path Fill="Transparent" Stroke="Gray" StrokeThickness="2">
<Path.Data>
<EllipseGeometry RadiusX="8" RadiusY="8"/>
</Path.Data>
</Path>
2023-01-22 16:05:16 +01:00
<TextBlock Margin="16,-9,0,0" Text="{Binding Name}"/>
</Grid>
2021-07-17 23:35:19 +02:00
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="PushpinItemStyle" TargetType="map:MapItem">
<Setter Property="AutoCollapse" Value="True"/>
2022-02-05 15:52:17 +01:00
<Setter Property="HorizontalAlignment" Value="Center"/>
2021-07-17 23:35:19 +02:00
<Setter Property="VerticalAlignment" Value="Bottom"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="map:MapItem">
2024-05-28 18:06:56 +02:00
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="Disabled"/>
<VisualState x:Name="PointerOver"/>
<VisualState x:Name="Pressed"/>
<VisualState x:Name="Selected">
<VisualState.Setters>
<Setter Target="pushpin.Foreground" Value="OrangeRed"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="SelectedUnfocused">
<VisualState.Setters>
<Setter Target="pushpin.Foreground" Value="OrangeRed"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="SelectedPointerOver">
<VisualState.Setters>
<Setter Target="pushpin.Foreground" Value="OrangeRed"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="SelectedPressed">
<VisualState.Setters>
<Setter Target="pushpin.Foreground" Value="OrangeRed"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<map:Pushpin x:Name="pushpin" Content="{Binding Name}"
2024-05-31 00:08:41 +02:00
Foreground="{TemplateBinding Foreground}"
2024-05-28 18:06:56 +02:00
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"/>
</Grid>
2021-07-17 23:35:19 +02:00
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
2021-12-05 17:16:14 +01:00
<Grid.DataContext>
<local:MapViewModel/>
</Grid.DataContext>
2021-07-01 22:07:46 +02:00
2025-01-01 18:24:01 +01:00
<map:Map x:Name="map"
2024-04-11 13:21:38 +02:00
Center="53.5,8.2"
MinZoomLevel="2" MaxZoomLevel="21" ZoomLevel="11"
2025-01-06 15:33:12 +01:00
ManipulationMode="All"
2024-05-24 15:28:28 +02:00
DoubleTapped="MapDoubleTapped"
2022-12-03 20:57:34 +01:00
PointerPressed="MapPointerPressed"
2023-01-06 16:01:03 +01:00
PointerReleased="MapPointerReleased"
2021-12-05 17:16:14 +01:00
PointerMoved="MapPointerMoved"
PointerExited="MapPointerExited">
2021-07-17 23:35:19 +02:00
2023-01-06 16:01:03 +01:00
<map:MapPolyline x:Name="measurementLine" Visibility="Collapsed"
Stroke="{Binding Foreground, ElementName=map}"
StrokeThickness="2" StrokeDashArray="1,1"/>
2024-05-31 00:08:41 +02:00
<map:MapItemsControl ItemTemplate="{StaticResource PolylineItemTemplate}"
ItemsSource="{Binding Polylines}"/>
2021-07-17 23:35:19 +02:00
2024-05-31 00:08:41 +02:00
<map:MapItemsControl ItemContainerStyle="{StaticResource PointItemStyle}"
ItemsSource="{Binding Points}"
SelectionMode="Multiple"
2024-08-25 18:02:23 +02:00
LocationMemberPath="Location"/>
2021-07-17 23:35:19 +02:00
2024-05-31 00:08:41 +02:00
<map:MapItemsControl ItemContainerStyle="{StaticResource PushpinItemStyle}"
ItemsSource="{Binding Pushpins}"
SelectedItem="{Binding SelectedPushpin, Mode=TwoWay}"
2025-03-19 20:43:02 +01:00
SelectionMode="Extended"
LocationMemberPath="Location"
2025-03-22 17:11:58 +01:00
SelectionChanged="MapItemsControlSelectionChanged"/>
2021-07-17 23:35:19 +02:00
2024-07-16 21:29:25 +02:00
<map:MapPath Location="53.5,8.2" Stroke="Blue" StrokeThickness="3" Fill="#1F007F00" IsHitTestVisible="False">
2024-05-25 19:37:46 +02:00
<map:MapPath.Data>
<EllipseGeometry RadiusX="1852" RadiusY="1852"/>
</map:MapPath.Data>
</map:MapPath>
2024-07-18 06:55:55 +02:00
<!--<map:MapMultiPolygon Stroke="Yellow" StrokeThickness="2" Fill="#1FFF0000" IsHitTestVisible="False">
2024-07-16 21:29:25 +02:00
<map:MapMultiPolygon.Polygons>
<map:PolygonCollection>
<map:LocationCollection>53.45,8.1 53.45,8.3 53.55,8.3 53.55,8.1</map:LocationCollection>
2024-07-18 06:55:55 +02:00
<map:LocationCollection>53.5,8.12 53.46,8.2 53.5,8.28 53.54,8.2</map:LocationCollection>
2024-07-16 21:29:25 +02:00
</map:PolygonCollection>
</map:MapMultiPolygon.Polygons>
2024-07-18 06:55:55 +02:00
</map:MapMultiPolygon>-->
2024-05-25 23:03:40 +02:00
2024-04-11 13:21:38 +02:00
<map:Pushpin Location="53.5,8.2" AutoCollapse="True" Content="N 53°30' E 8°12'"/>
2021-07-01 22:07:46 +02:00
</map:Map>
2023-01-05 15:50:38 +01:00
<Border HorizontalAlignment="Center" VerticalAlignment="Top" Margin="4" IsHitTestVisible="False">
<Border.Background>
<SolidColorBrush Color="{Binding Background.Color, ElementName=map}" Opacity="0.5"/>
</Border.Background>
<TextBlock x:Name="mouseLocation" Foreground="{Binding Foreground, ElementName=map}"
FontFamily="Consolas" Margin="4,2" Visibility="Collapsed"/>
2022-08-06 15:06:10 +02:00
</Border>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Bottom" Background="#AFFFFFFF"
DataContext="{Binding MapLayer, ElementName=map}">
2022-08-06 15:06:10 +02:00
<ProgressBar Width="100" Height="8" Margin="4,2" VerticalAlignment="Center"
Maximum="1" Value="{Binding LoadingProgress}">
<ProgressBar.Visibility>
<Binding Path="Value" RelativeSource="{RelativeSource Self}">
<Binding.Converter>
<local:DoubleTriggerConverter Trigger="1" TriggerValue="Collapsed" DefaultValue="Visible"/>
</Binding.Converter>
</Binding>
</ProgressBar.Visibility>
</ProgressBar>
<TextBlock Margin="4,1,4,3" FontSize="10" local:HyperlinkText.InlinesSource="{Binding Description}"/>
</StackPanel>
2021-12-05 17:16:14 +01:00
<StackPanel HorizontalAlignment="Left" VerticalAlignment="Top" Margin="6">
2025-03-21 17:24:09 +01:00
<tools:MenuButton x:Name="mapLayersMenuButton"
Icon="&#xE81E;" Margin="2" Padding="8" ToolTipService.ToolTip="Map Layers and Overlays" Map="{Binding ElementName=map}">
<tools:MapLayerMenuItem Text="OpenStreetMap">
2022-01-13 20:12:49 +01:00
<map:MapTileLayer
2024-04-11 14:57:54 +02:00
TileSource="https://tile.openstreetmap.org/{z}/{x}/{y}.png"
2022-01-13 20:12:49 +01:00
SourceName="OpenStreetMap"
2024-04-11 14:57:54 +02:00
Description="© [OpenStreetMap contributors](http://www.openstreetmap.org/copyright)"/>
2025-03-21 17:24:09 +01:00
</tools:MapLayerMenuItem>
<tools:MapLayerMenuItem Text="OpenStreetMap German">
2022-01-13 20:12:49 +01:00
<map:MapTileLayer
2024-07-14 08:57:55 +02:00
TileSource="https://tile.openstreetmap.de/{z}/{x}/{y}.png"
2022-01-13 20:12:49 +01:00
SourceName="OpenStreetMap German"
2024-07-14 09:36:48 +02:00
Description="© [OpenStreetMap Deutschland](https://www.openstreetmap.de) © [OpenStreetMap contributors](http://www.openstreetmap.org/copyright)"/>
2025-03-21 17:24:09 +01:00
</tools:MapLayerMenuItem>
<tools:MapLayerMenuItem Text="OpenStreetMap French">
2022-01-13 20:12:49 +01:00
<map:MapTileLayer
2024-04-11 14:57:54 +02:00
TileSource="http://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png"
2022-01-13 20:12:49 +01:00
SourceName="OpenStreetMap French"
2024-04-11 14:57:54 +02:00
Description="© [OpenStreetMap France](https://www.openstreetmap.fr/mentions-legales/) © [OpenStreetMap contributors](http://www.openstreetmap.org/copyright)"/>
2025-03-21 17:24:09 +01:00
</tools:MapLayerMenuItem>
<tools:MapLayerMenuItem Text="OpenTopoMap">
2022-01-13 20:12:49 +01:00
<map:MapTileLayer
2024-07-14 09:36:48 +02:00
TileSource="https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png"
2022-01-13 20:12:49 +01:00
SourceName="OpenTopoMap"
2024-04-11 14:57:54 +02:00
Description="© [OpenTopoMap](https://opentopomap.org/) © [OpenStreetMap contributors](http://www.openstreetmap.org/copyright)"/>
2025-03-21 17:24:09 +01:00
</tools:MapLayerMenuItem>
<tools:MapLayerMenuItem Text="TopPlusOpen WMTS">
2022-01-13 20:12:49 +01:00
<map:WmtsTileLayer
2024-04-11 14:57:54 +02:00
CapabilitiesUri="https://sgx.geodatenzentrum.de/wmts_topplus_open/1.0.0/WMTSCapabilities.xml"
2022-01-13 20:12:49 +01:00
SourceName="TopPlusOpen"
2024-04-11 14:57:54 +02:00
Description="© [BKG](https://gdz.bkg.bund.de/index.php/default/webdienste/topplus-produkte/wmts-topplusopen-wmts-topplus-open.html)"/>
2025-03-21 17:24:09 +01:00
</tools:MapLayerMenuItem>
<tools:MapLayerMenuItem Text="TopPlusOpen WMS">
2022-01-13 20:12:49 +01:00
<map:WmsImageLayer
2024-04-11 14:57:54 +02:00
ServiceUri="https://sgx.geodatenzentrum.de/wms_topplus_open"
Description="© [BKG](https://gdz.bkg.bund.de/index.php/default/webdienste/topplus-produkte/wms-topplusopen-mit-layer-fur-normalausgabe-und-druck-wms-topplus-open.html)"/>
2025-03-21 17:24:09 +01:00
</tools:MapLayerMenuItem>
<tools:MapLayerMenuItem Text="OpenStreetMap WMS">
2022-01-13 20:12:49 +01:00
<map:WmsImageLayer
2024-04-11 14:57:54 +02:00
ServiceUri="http://ows.terrestris.de/osm/service"
Description="© [terrestris GmbH &amp; Co. KG](http://ows.terrestris.de/) © [OpenStreetMap contributors](http://www.openstreetmap.org/copyright)"/>
2025-03-21 17:24:09 +01:00
</tools:MapLayerMenuItem>
2025-03-24 19:01:08 +01:00
2025-03-21 17:24:09 +01:00
<MenuFlyoutSeparator/>
2025-03-24 19:01:08 +01:00
2025-03-21 17:24:09 +01:00
<tools:MapOverlayMenuItem Text="Sample Image">
<Image Source="10_535_330.jpg" Stretch="Fill"
map:MapPanel.BoundingBox="53.54031,8.08594,53.74871,8.43750"/>
</tools:MapOverlayMenuItem>
2025-03-24 19:01:08 +01:00
<tools:MapOverlayMenuItem x:Name="sampleOverlayMenuItem" Text="Mount Etna KML"/>
2025-03-21 17:24:09 +01:00
<tools:MapOverlayMenuItem Text="Seamarks">
<map:MapTileLayer
TileSource="http://tiles.openseamap.org/seamark/{z}/{x}/{y}.png"
SourceName="Seamarks"
MinZoomLevel="9" MaxZoomLevel="18"/>
</tools:MapOverlayMenuItem>
<tools:MapOverlayMenuItem Text="Graticule">
<map:MapGraticule Opacity="0.7"/>
</tools:MapOverlayMenuItem>
<tools:MapOverlayMenuItem Text="Scale">
<map:MapScale HorizontalAlignment="Center" VerticalAlignment="Bottom"/>
</tools:MapOverlayMenuItem>
</tools:MenuButton>
2021-12-05 17:16:14 +01:00
2025-03-21 17:24:09 +01:00
<tools:MenuButton x:Name="mapProjectionsMenuButton"
Icon="&#xE809;" Padding="8" Margin="2" ToolTipService.ToolTip="Map Projections" Map="{Binding ElementName=map}">
<tools:MapProjectionMenuItem Text="Web Mercator">
EPSG:3857
</tools:MapProjectionMenuItem>
<tools:MapProjectionMenuItem Text="Equirectangular">
EPSG:4326
</tools:MapProjectionMenuItem>
<tools:MapProjectionMenuItem Text="ETRS89 / UTM zone 32N">
EPSG:25832
</tools:MapProjectionMenuItem>
</tools:MenuButton>
2021-12-05 17:16:14 +01:00
<Slider Orientation="Vertical" Margin="4,8" Height="100"
Minimum="{Binding MinZoomLevel, ElementName=map}"
Maximum="{Binding MaxZoomLevel, ElementName=map}"
Value="{Binding TargetZoomLevel, ElementName=map, Mode=TwoWay}"/>
<Button Margin="2" Padding="8" ToolTipService.ToolTip="Reset Heading" Click="ResetHeadingButtonClick">
<Button.Visibility>
<Binding Path="Heading" ElementName="map">
<Binding.Converter>
<local:DoubleTriggerConverter Trigger="0" TriggerValue="Collapsed" DefaultValue="Visible"/>
</Binding.Converter>
</Binding>
</Button.Visibility>
2022-01-24 23:07:36 +01:00
<FontIcon Glyph="&#xEBE6;"/>
</Button>
2021-12-05 17:16:14 +01:00
</StackPanel>
2021-07-01 22:07:46 +02:00
</Grid>
</Window>