From a282ba1b5ef65bebe8705bf95ece997d62824e67 Mon Sep 17 00:00:00 2001
From: ClemensFischer <fischer.clemens@gmail.com>
Date: Sat, 21 Jan 2023 14:41:03 +0100
Subject: [PATCH] Fixed clipping of WinUI/UWP MapPath

---
 MapControl/Shared/MapPanel.cs             | 44 ++++++++++-----------
 MapControl/UWP/MapControl.UWP.csproj      |  3 ++
 MapControl/WinUI/CanvasPanel.cs           | 48 +++++++++++++++++++++++
 SampleApps/UniversalApp/MainPage.xaml     | 12 +++++-
 SampleApps/WinUiApp/MainWindow.xaml       | 12 +++++-
 SampleApps/WpfApplication/MainWindow.xaml |  8 ++++
 6 files changed, 101 insertions(+), 26 deletions(-)
 create mode 100644 MapControl/WinUI/CanvasPanel.cs

diff --git a/MapControl/Shared/MapPanel.cs b/MapControl/Shared/MapPanel.cs
index 581a37b8..abcd6a86 100644
--- a/MapControl/Shared/MapPanel.cs
+++ b/MapControl/Shared/MapPanel.cs
@@ -264,17 +264,7 @@ namespace MapControl
 
         private static void ArrangeElement(FrameworkElement element, Point position)
         {
-            var rect = new Rect(position.X, position.Y, 0d, 0d);
-
-            if (element.DesiredSize.Width >= 0d && element.DesiredSize.Width < double.PositiveInfinity)
-            {
-                rect.Width = element.DesiredSize.Width;
-            }
-
-            if (element.DesiredSize.Height >= 0d && element.DesiredSize.Height < double.PositiveInfinity)
-            {
-                rect.Height = element.DesiredSize.Height;
-            }
+            var rect = new Rect(position, GetDesiredSize(element));
 
             switch (element.HorizontalAlignment)
             {
@@ -309,17 +299,7 @@ namespace MapControl
 
         private static void ArrangeElement(FrameworkElement element, Size parentSize)
         {
-            var rect = new Rect();
-
-            if (element.DesiredSize.Width >= 0d && element.DesiredSize.Width < double.PositiveInfinity)
-            {
-                rect.Width = element.DesiredSize.Width;
-            }
-
-            if (element.DesiredSize.Height >= 0d && element.DesiredSize.Height < double.PositiveInfinity)
-            {
-                rect.Height = element.DesiredSize.Height;
-            }
+            var rect = new Rect(new Point(), GetDesiredSize(element));
 
             switch (element.HorizontalAlignment)
             {
@@ -391,5 +371,25 @@ namespace MapControl
 
             element.Arrange(rect);
         }
+
+        internal static Size GetDesiredSize(UIElement element)
+        {
+            var width = 0d;
+            var height = 0d;
+
+            if (element.DesiredSize.Width >= 0d &&
+                element.DesiredSize.Width < double.PositiveInfinity)
+            {
+                width = element.DesiredSize.Width;
+            }
+
+            if (element.DesiredSize.Height >= 0d &&
+                element.DesiredSize.Height < double.PositiveInfinity)
+            {
+                height = element.DesiredSize.Height;
+            }
+
+            return new Size(width, height);
+        }
     }
 }
diff --git a/MapControl/UWP/MapControl.UWP.csproj b/MapControl/UWP/MapControl.UWP.csproj
index 3dda270e..6bad4ca8 100644
--- a/MapControl/UWP/MapControl.UWP.csproj
+++ b/MapControl/UWP/MapControl.UWP.csproj
@@ -230,6 +230,9 @@
     <Compile Include="..\WinUI\Animatable.WinUI.cs">
       <Link>Animatable.WinUI.cs</Link>
     </Compile>
+    <Compile Include="..\WinUI\CanvasPanel.cs">
+      <Link>CanvasPanel.cs</Link>
+    </Compile>
     <Compile Include="..\WinUI\GeoImage.WinUI.cs">
       <Link>GeoImage.WinUI.cs</Link>
     </Compile>
diff --git a/MapControl/WinUI/CanvasPanel.cs b/MapControl/WinUI/CanvasPanel.cs
new file mode 100644
index 00000000..e2d786e6
--- /dev/null
+++ b/MapControl/WinUI/CanvasPanel.cs
@@ -0,0 +1,48 @@
+// XAML Map Control - https://github.com/ClemensFischer/XAML-Map-Control
+// Copyright © 2023 Clemens Fischer
+// Licensed under the Microsoft Public License (Ms-PL)
+
+using System.Linq;
+using Windows.Foundation;
+#if WINUI
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+#elif UWP
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+#endif
+
+namespace MapControl
+{
+    /// <summary>
+    /// Replacement for WinUI and UWP Canvas, which clips MapPath child elements.
+    /// </summary>
+    public class CanvasPanel : Panel
+    {
+        protected override Size MeasureOverride(Size availableSize)
+        {
+            availableSize = new Size(double.PositiveInfinity, double.PositiveInfinity);
+
+            foreach (var element in Children.OfType<UIElement>())
+            {
+                element.Measure(availableSize);
+            }
+
+            return new Size();
+        }
+
+        protected override Size ArrangeOverride(Size finalSize)
+        {
+            foreach (var element in Children.OfType<UIElement>())
+            {
+                var x = Canvas.GetLeft(element);
+                var y = Canvas.GetTop(element);
+                var p = new Point(double.IsNaN(x) ? 0d : x, double.IsNaN(y) ? 0d : y);
+
+                element.Arrange(new Rect(p, MapPanel.GetDesiredSize(element)));
+            }
+
+            return finalSize;
+        }
+    }
+}
diff --git a/SampleApps/UniversalApp/MainPage.xaml b/SampleApps/UniversalApp/MainPage.xaml
index 96a26a65..6ac9ba07 100644
--- a/SampleApps/UniversalApp/MainPage.xaml
+++ b/SampleApps/UniversalApp/MainPage.xaml
@@ -17,7 +17,7 @@
                 <Setter Property="Template">
                     <Setter.Value>
                         <ControlTemplate TargetType="map:MapItem">
-                            <Canvas>
+                            <map:CanvasPanel>
                                 <VisualStateManager.VisualStateGroups>
                                     <VisualStateGroup x:Name="CommonStates">
                                         <VisualState x:Name="Normal"/>
@@ -54,12 +54,20 @@
                                         </VisualState>
                                     </VisualStateGroup>
                                 </VisualStateManager.VisualStateGroups>
+                                <!-- Path with transformed Geometry -->
                                 <Path Fill="Red" Opacity="0.4" IsHitTestVisible="False">
                                     <Path.Data>
                                         <EllipseGeometry RadiusX="20" RadiusY="20"
                                                          Transform="{Binding MapTransform, RelativeSource={RelativeSource TemplatedParent}}"/>
                                     </Path.Data>
                                 </Path>
+                                <!-- MapPath with Location, requires CanvasPanel parent to avoid clipping -->
+                                <map:MapPath Stroke="Green" StrokeThickness="2" IsHitTestVisible="False"
+                                             Location="{TemplateBinding Location}">
+                                    <map:MapPath.Data>
+                                        <EllipseGeometry RadiusX="20" RadiusY="20"/>
+                                    </map:MapPath.Data>
+                                </map:MapPath>
                                 <Path x:Name="selectedPath" Fill="White" Opacity="0">
                                     <Path.Data>
                                         <EllipseGeometry RadiusX="12" RadiusY="12"/>
@@ -73,7 +81,7 @@
                                 <Grid Canvas.Left="15" Canvas.Top="-8">
                                     <TextBlock Margin="2,0,2,0" Text="{Binding Name}"/>
                                 </Grid>
-                            </Canvas>
+                            </map:CanvasPanel>
                         </ControlTemplate>
                     </Setter.Value>
                 </Setter>
diff --git a/SampleApps/WinUiApp/MainWindow.xaml b/SampleApps/WinUiApp/MainWindow.xaml
index 1c35250b..5e59a126 100644
--- a/SampleApps/WinUiApp/MainWindow.xaml
+++ b/SampleApps/WinUiApp/MainWindow.xaml
@@ -24,7 +24,7 @@
                 <Setter Property="Template">
                     <Setter.Value>
                         <ControlTemplate TargetType="map:MapItem">
-                            <Canvas>
+                            <map:CanvasPanel>
                                 <VisualStateManager.VisualStateGroups>
                                     <VisualStateGroup x:Name="CommonStates">
                                         <VisualState x:Name="Normal"/>
@@ -61,12 +61,20 @@
                                         </VisualState>
                                     </VisualStateGroup>
                                 </VisualStateManager.VisualStateGroups>
+                                <!-- Path with transformed Geometry -->
                                 <Path Fill="Red" Opacity="0.4" IsHitTestVisible="False">
                                     <Path.Data>
                                         <EllipseGeometry RadiusX="20" RadiusY="20"
                                                          Transform="{Binding MapTransform, RelativeSource={RelativeSource TemplatedParent}}"/>
                                     </Path.Data>
                                 </Path>
+                                <!-- MapPath with Location, requires CanvasPanel parent to avoid clipping -->
+                                <map:MapPath Stroke="Green" StrokeThickness="2" IsHitTestVisible="False"
+                                             Location="{TemplateBinding Location}">
+                                    <map:MapPath.Data>
+                                        <EllipseGeometry RadiusX="20" RadiusY="20"/>
+                                    </map:MapPath.Data>
+                                </map:MapPath>
                                 <Path x:Name="selectedPath" Fill="White" Opacity="0">
                                     <Path.Data>
                                         <EllipseGeometry RadiusX="12" RadiusY="12"/>
@@ -80,7 +88,7 @@
                                 <Grid Canvas.Left="15" Canvas.Top="-8">
                                     <TextBlock Margin="2,0,2,0" Text="{Binding Name}"/>
                                 </Grid>
-                            </Canvas>
+                            </map:CanvasPanel>
                         </ControlTemplate>
                     </Setter.Value>
                 </Setter>
diff --git a/SampleApps/WpfApplication/MainWindow.xaml b/SampleApps/WpfApplication/MainWindow.xaml
index 9ad88adf..c30d4b0b 100644
--- a/SampleApps/WpfApplication/MainWindow.xaml
+++ b/SampleApps/WpfApplication/MainWindow.xaml
@@ -48,12 +48,20 @@
                                         </VisualState>
                                     </VisualStateGroup>
                                 </VisualStateManager.VisualStateGroups>
+                                <!-- Path with transformed Geometry -->
                                 <Path Fill="Red" Opacity="0.4" IsHitTestVisible="False">
                                     <Path.Data>
                                         <EllipseGeometry RadiusX="20" RadiusY="20"
                                                          Transform="{Binding MapTransform, RelativeSource={RelativeSource TemplatedParent}}"/>
                                     </Path.Data>
                                 </Path>
+                                <!-- MapPath with Location -->
+                                <map:MapPath Stroke="Green" StrokeThickness="2" IsHitTestVisible="False"
+                                             Location="{TemplateBinding Location}">
+                                    <map:MapPath.Data>
+                                        <EllipseGeometry RadiusX="20" RadiusY="20"/>
+                                    </map:MapPath.Data>
+                                </map:MapPath>
                                 <Path x:Name="selectedPath" Fill="White" Opacity="0">
                                     <Path.Data>
                                         <EllipseGeometry RadiusX="12" RadiusY="12"/>