From 17adc165fac856beeadcce6d231e301d541124aa Mon Sep 17 00:00:00 2001
From: Yoojun Zhou <hereisnotyoojun@outlook.com>
Date: Thu, 31 Oct 2024 13:26:51 +0800
Subject: [PATCH] Example code for Canvas

---
 .../ControlPages/CalendarViewPage.xaml        |  8 ---
 .../ControlPages/CanvasPage.xaml              | 19 ++-----
 .../ControlPages/CanvasPage.xaml.cs           | 56 ++++++++++++++++++-
 3 files changed, 60 insertions(+), 23 deletions(-)

diff --git a/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CalendarViewPage.xaml b/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CalendarViewPage.xaml
index 51653e25..5aa67adc 100644
--- a/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CalendarViewPage.xaml
+++ b/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CalendarViewPage.xaml
@@ -46,14 +46,6 @@
                         SelectionChanged="CalendarLanguages_SelectionChanged" />
                 </StackPanel>
             </local:ControlExample.Options>
-
-            <local:ControlExample.Xaml>
-                <sys:String xml:space="preserve">
-&lt;Calendar 
-    SelectionMode=&quot;$(SelectionMode)&quot; 
-    Language=&quot;$(Language)&quot; /&gt;
-                </sys:String>
-            </local:ControlExample.Xaml>
         </local:ControlExample>
     </StackPanel>
 </ui:Page>
diff --git a/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CanvasPage.xaml b/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CanvasPage.xaml
index d573c58e..26f17536 100644
--- a/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CanvasPage.xaml
+++ b/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CanvasPage.xaml
@@ -61,7 +61,8 @@
                         Maximum="100"
                         Minimum="0"
                         Orientation="Vertical"
-                        TickFrequency="1">
+                        TickFrequency="1"
+                        ValueChanged="TopSlider_ValueChanged">
                         <ui:ControlHelper.Header>
                             <TextBlock Margin="0,0,0,10" Text="Canvas.Top" />
                         </ui:ControlHelper.Header>
@@ -74,7 +75,8 @@
                             AutoToolTipPlacement="TopLeft"
                             Maximum="100"
                             Minimum="0"
-                            TickFrequency="1" />
+                            TickFrequency="1" 
+                            ValueChanged="LeftSlider_ValueChanged"/>
                         <Slider
                             x:Name="ZSlider"
                             Width="100"
@@ -83,20 +85,11 @@
                             IsSnapToTickEnabled="True"
                             Maximum="4"
                             Minimum="0"
-                            TickFrequency="1" />
+                            TickFrequency="1" 
+                            ValueChanged="ZSlider_ValueChanged"/>
                     </StackPanel>
                 </StackPanel>
             </local:ControlExample.Options>
-            <local:ControlExample.Xaml>
-                <sys:String xml:space="preserve">
-&lt;Canvas Width=&quot;120&quot; Height=&quot;120&quot; Background=&quot;Gray&quot;&gt;
-    &lt;Rectangle Fill=&quot;Red&quot; Canvas.Left=&quot;$(Left)&quot; Canvas.Top=&quot;$(Top)&quot; Canvas.ZIndex=&quot;$(Z)&quot; /&gt;
-    &lt;Rectangle Fill=&quot;Blue&quot; Canvas.Left=&quot;20&quot; Canvas.Top=&quot;20&quot; Canvas.ZIndex=&quot;1&quot; /&gt;
-    &lt;Rectangle Fill=&quot;Green&quot; Canvas.Left=&quot;40&quot; Canvas.Top=&quot;40&quot; Canvas.ZIndex=&quot;2&quot; /&gt;
-    &lt;Rectangle Fill=&quot;Yellow&quot; Canvas.Left=&quot;60&quot; Canvas.Top=&quot;60&quot; Canvas.ZIndex=&quot;3&quot; /&gt;
-&lt;/Canvas&gt;
-                </sys:String>
-            </local:ControlExample.Xaml>
         </local:ControlExample>
     </StackPanel>
 </ui:Page>
diff --git a/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CanvasPage.xaml.cs b/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CanvasPage.xaml.cs
index 220a285f..7fafab6b 100644
--- a/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CanvasPage.xaml.cs
+++ b/source/iNKORE.UI.WPF.Modern.Gallery/ControlPages/CanvasPage.xaml.cs
@@ -60,16 +60,68 @@ private void Page_Loaded(object sender, RoutedEventArgs e)
                 Path = new PropertyPath("Value"),
             });
             Example1.Substitutions = new ObservableCollection<ControlExampleSubstitution> { Substitution1, Substitution2, Substitution3 };
+
+            UpdateExampleCode();
+        }
+
+        private void TopSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
+        {
+            UpdateExampleCode();
+        }
+
+        private void LeftSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
+        {
+            UpdateExampleCode();
+        }
+
+        private void ZSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
+        {
+            UpdateExampleCode();
         }
 
         #region Example Code
 
         public void UpdateExampleCode()
         {
-
+            Example1.Xaml = Example1Xaml;
         }
 
-        #endregion
+        public string Example1Xaml => $@"
+<Canvas
+    x:Name=""Control1""
+    Width=""140""
+    Height=""140""
+    VerticalAlignment=""Top""
+    Background=""Gray"">
+    <Canvas.Resources>
+        <Style TargetType=""Rectangle"">
+            <Setter Property=""Height"" Value=""40"" />
+            <Setter Property=""Width"" Value=""40"" />
+        </Style>
+    </Canvas.Resources>
+    <Rectangle
+        Canvas.Left=""{LeftSlider.Value}""
+        Canvas.Top=""{TopSlider.Value}""
+        Canvas.ZIndex=""{ZSlider.Value}""
+        Fill=""Red"" />
+    <Rectangle
+        Canvas.Left=""20""
+        Canvas.Top=""20""
+        Canvas.ZIndex=""1""
+        Fill=""Blue"" />
+    <Rectangle
+        Canvas.Left=""40""
+        Canvas.Top=""40""
+        Canvas.ZIndex=""2""
+        Fill=""Green"" />
+    <Rectangle
+        Canvas.Left=""60""
+        Canvas.Top=""60""
+        Canvas.ZIndex=""3""
+        Fill=""Yellow"" />
+</Canvas>
+";
 
+        #endregion
     }
 }