From f96ad2f7f6697c478420c0418e3e5c36d20fcd8a Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Fri, 12 Jun 2020 16:15:00 -0300
Subject: [PATCH] update acrylic page.

---
 samples/ControlCatalog/Pages/AcrylicPage.xaml | 112 +++++++++---------
 1 file changed, 57 insertions(+), 55 deletions(-)

diff --git a/samples/ControlCatalog/Pages/AcrylicPage.xaml b/samples/ControlCatalog/Pages/AcrylicPage.xaml
index f2785dfcfd..214d012aff 100644
--- a/samples/ControlCatalog/Pages/AcrylicPage.xaml
+++ b/samples/ControlCatalog/Pages/AcrylicPage.xaml
@@ -7,12 +7,12 @@
   <Border Padding="20" HorizontalAlignment="Center">
     <StackPanel Spacing="20">
 
-      <Border Width="660" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-        <Border.Background>
-          <ExperimentalAcrylicBrush
+      <ExperimentalAcrylicBorder Width="660" CornerRadius="5">
+        <ExperimentalAcrylicBorder.Material>
+          <ExperimentalAcrylicMaterial
             TintColor="White"
             BackgroundSource="Digger" />
-        </Border.Background>
+        </ExperimentalAcrylicBorder.Material>
         <StackPanel Spacing="20" Margin="40">
           <TextBlock Text="TintOpacity" Foreground="Black" />
           <Slider Name="TintOpacitySlider" Minimum="0" Maximum="1" Value="0.9" />
@@ -21,113 +21,115 @@
           <Slider Name="TintLuminositySlider" Minimum="0" Maximum="1" Value="0.8" />
           <TextBlock Text="{Binding #TintLuminositySlider.Value}" Foreground="Black" />
         </StackPanel>
-      </Border>
+      </ExperimentalAcrylicBorder>
+
 
       <StackPanel Orientation="Horizontal" Spacing="20">
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="#FF0000"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
 
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="#00FF00"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
 
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="#000000"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
       </StackPanel>
 
+
       <StackPanel Orientation="Horizontal" Spacing="20">
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="#0000FF"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
 
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="#FFFF00"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
 
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="#000000"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
       </StackPanel>
 
       <StackPanel Orientation="Horizontal" Spacing="20">
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="White"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
 
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="#3c3c3c"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
 
-        <Border Height="200" Width="200" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-          <Border.Background>
-            <ExperimentalAcrylicBrush
+        <ExperimentalAcrylicBorder Height="200" Width="200" CornerRadius="5">
+          <ExperimentalAcrylicBorder.Material>
+            <ExperimentalAcrylicMaterial
               TintColor="White"
               TintOpacity="{Binding #TintOpacitySlider.Value}"
               TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
               BackgroundSource="Digger" />
-          </Border.Background>
-        </Border>
+          </ExperimentalAcrylicBorder.Material>
+        </ExperimentalAcrylicBorder>
       </StackPanel>
 
-      <Border Height="200" Width="660" CornerRadius="5" BoxShadow="2 2 16 0 Black">
-        <Border.Background>
-          <ExperimentalAcrylicBrush
+      <ExperimentalAcrylicBorder Height="200" Width="660" CornerRadius="5">
+        <ExperimentalAcrylicBorder.Material>
+          <ExperimentalAcrylicMaterial
             TintColor="Red"
             TintOpacity="{Binding #TintOpacitySlider.Value}"
             TintLuminosityOpacity="{Binding #TintLuminositySlider.Value}"
             BackgroundSource="Digger" />
-        </Border.Background>
-      </Border>
+        </ExperimentalAcrylicBorder.Material>
+      </ExperimentalAcrylicBorder>
     </StackPanel>
   </Border>
 </UserControl>