Added the Render surfaces and their XAML brushes. (Ported from CompositionProToolkit)

Microsoft.Toolkit.Uwp.SampleApp/Microsoft.Toolkit.Uwp.SampleApp.csproj

@@ -274,9 +274,16 @@
     <Content Include="SamplePages\Animations\Effects\EffectAnimations.png">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </Content>
+    <Content Include="SamplePages\GeometryMaskSurfaceBrush\GeometryMaskSurfaceBrush.png" />
+    <Content Include="SamplePages\GeometrySurfaceBrush\GeometrySurfaceBrush.png" />
     <Content Include="SamplePages\Graph\LoginButton.png" />
     <Content Include="SamplePages\Graph\PeoplePicker.png" />
     <Content Include="SamplePages\Graph\PersonView.png" />
+    <Content Include="SamplePages\ImageMaskSurfaceBrush\ImageMaskSurfaceBrush.png" />
+    <Content Include="SamplePages\ImageMaskSurfaceBrush\MaskImage1.png" />
+    <Content Include="SamplePages\ImageMaskSurfaceBrush\MaskImage2.png" />
+    <Content Include="SamplePages\ImageMaskSurfaceBrush\MaskImage3.png" />
+    <Content Include="SamplePages\ImageSurfaceBrush\ImageSurfaceBrush.png" />
     <Content Include="SamplePages\Primitives\SwitchPresenter.png" />
     <Content Include="SamplePages\TabbedCommandBar\TabbedCommandBar.png" />
     <Content Include="SamplePages\Animations\Effects\FadeBehavior.png" />
@@ -507,9 +514,21 @@
     <Compile Include="SamplePages\FocusBehavior\FocusBehaviorPage.xaml.cs">
       <DependentUpon>FocusBehaviorPage.xaml</DependentUpon>
     </Compile>
+    <Compile Include="SamplePages\GeometryMaskSurfaceBrush\GeometryMaskSurfaceBrushPage.xaml.cs">
+      <DependentUpon>GeometryMaskSurfaceBrushPage.xaml</DependentUpon>
+    </Compile>
+    <Compile Include="SamplePages\ImageMaskSurfaceBrush\ImageMaskSurfaceBrushPage.xaml.cs">
+      <DependentUpon>ImageMaskSurfaceBrushPage.xaml</DependentUpon>
+    </Compile>
+    <Compile Include="SamplePages\ImageSurfaceBrush\ImageSurfaceBrushPage.xaml.cs">
+      <DependentUpon>ImageSurfaceBrushPage.xaml</DependentUpon>
+    </Compile>
     <Compile Include="SamplePages\MetadataControl\MetadataControlPage.xaml.cs">
       <DependentUpon>MetadataControlPage.xaml</DependentUpon>
     </Compile>
+    <Compile Include="SamplePages\GeometrySurfaceBrush\GeometrySurfaceBrushPage.xaml.cs">
+      <DependentUpon>GeometrySurfaceBrushPage.xaml</DependentUpon>
+    </Compile>
     <Compile Include="SamplePages\TilesBrush\TilesBrushPage.xaml.cs">
       <DependentUpon>TilesBrushPage.xaml</DependentUpon>
     </Compile>
@@ -627,6 +646,10 @@
     <Content Include="SamplePages\Graph\PeoplePickerXaml.bind" />
     <Content Include="SamplePages\Graph\PersonViewXaml.bind" />
     <Content Include="SamplePages\ListViewExtensions\ListViewExtensionsCode.bind" />
+    <Content Include="SamplePages\GeometrySurfaceBrush\GeometrySurfaceBrushXaml.bind" />
+    <Content Include="SamplePages\GeometryMaskSurfaceBrush\GeometryMaskSurfaceBrushXaml.bind" />
+    <Content Include="SamplePages\ImageSurfaceBrush\ImageSurfaceBrushXaml.bind" />
+    <Content Include="SamplePages\ImageMaskSurfaceBrush\ImageMaskSurfaceBrushXaml.bind" />
   </ItemGroup>
   <ItemGroup>
     <Compile Include="App.xaml.cs">
@@ -975,6 +998,18 @@
     <Content Include="SamplePages\MetadataControl\MetadataControlCode.bind">
       <SubType>Designer</SubType>
     </Content>
+    <Page Include="SamplePages\GeometryMaskSurfaceBrush\GeometryMaskSurfaceBrushPage.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+    <Page Include="SamplePages\ImageMaskSurfaceBrush\ImageMaskSurfaceBrushPage.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+    <Page Include="SamplePages\ImageSurfaceBrush\ImageSurfaceBrushPage.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
     <Page Include="SamplePages\MetadataControl\MetadataControlPage.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
@@ -986,6 +1021,10 @@
     <Content Include="SamplePages\Primitives\SwitchPresenter.bind">
       <SubType>Designer</SubType>
     </Content>
+    <Page Include="SamplePages\GeometrySurfaceBrush\GeometrySurfaceBrushPage.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
     <Page Include="SamplePages\TilesBrush\TilesBrushPage.xaml">
       <Generator>MSBuild:Compile</Generator>
       <SubType>Designer</SubType>

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/CanvasPathGeometry/CanvasPathGeometryPage.xaml.cs

@@ -9,7 +9,7 @@
 using Microsoft.Graphics.Canvas.Geometry;
 using Microsoft.Graphics.Canvas.UI.Xaml;
 using Microsoft.Toolkit.Uwp.UI;
-using Microsoft.Toolkit.Uwp.UI.Media.Geometry;
+using Microsoft.Toolkit.Uwp.UI.Media;
 using Windows.System;
 using Windows.UI;
 using Windows.UI.Xaml;

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/GeometryMaskSurfaceBrush/GeometryMaskSurfaceBrushPage.xaml

@@ -0,0 +1,30 @@
+<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.GeometryMaskSurfaceBrushPage"
+      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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+      xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
+      mc:Ignorable="d">
+
+    <Grid>
+        <Grid.Background>
+            <media:GeometryMaskSurfaceBrush BlurRadius="0"
+                                            OffsetX="0"
+                                            OffsetY="0"
+                                            SurfaceHeight="600"
+                                            SurfaceWidth="899.25">
+                <media:GeometryMaskSurfaceBrush.Target>
+                    <media:ImageSurfaceBrush Source="ms-appx:///Assets/Photos/SpeedTripleAtristsPoint.jpg"
+                                             SurfaceHeight="600"
+                                             SurfaceWidth="899.25" />
+                </media:GeometryMaskSurfaceBrush.Target>
+                <media:GeometryMaskSurfaceBrush.Mask>
+                    <media:CanvasRoundedRectangleGeometry Width="200"
+                                                          Height="200"
+                                                          RadiusX="30"
+                                                          RadiusY="30"/>
+                </media:GeometryMaskSurfaceBrush.Mask>
+            </media:GeometryMaskSurfaceBrush>
+        </Grid.Background>
+    </Grid>
+</Page>

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/GeometryMaskSurfaceBrush/GeometryMaskSurfaceBrushPage.xaml.cs

@@ -0,0 +1,20 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using Windows.UI.Xaml.Controls;
+
+// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=234238
+namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
+{
+    /// <summary>
+    /// An empty page that can be used on its own or navigated to within a Frame.
+    /// </summary>
+    public sealed partial class GeometryMaskSurfaceBrushPage : Page
+    {
+        public GeometryMaskSurfaceBrushPage()
+        {
+            this.InitializeComponent();
+        }
+    }
+}

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/GeometryMaskSurfaceBrush/GeometryMaskSurfaceBrushXaml.bind

@@ -0,0 +1,29 @@
+<Page 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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+      xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
+      mc:Ignorable="d">
+
+    <Grid>
+        <Grid.Background>
+            <media:GeometryMaskSurfaceBrush BlurRadius="@[BlurRadius:DoubleSlider:4:0-30]"
+                                            OffsetX="@[OffsetX:DoubleSlider:100:0-600]"
+                                            OffsetY="@[OffsetY:DoubleSlider:100:0-600]"
+                                            SurfaceHeight="600"
+                                            SurfaceWidth="899.25">
+                <media:GeometryMaskSurfaceBrush.Target>
+                    <media:ImageSurfaceBrush Source="ms-appx:///Assets/Photos/SpeedTripleAtristsPoint.jpg"
+                                             SurfaceHeight="600"
+                                             SurfaceWidth="899.25" />
+                </media:GeometryMaskSurfaceBrush.Target>
+                <media:GeometryMaskSurfaceBrush.Mask>
+                    <media:CanvasRoundedRectangleGeometry Width= "@[Width:DoubleSlider:400:100-600]"
+                                                          Height="@[Height:DoubleSlider:300:100-500]"
+                                                          RadiusX="@[RadiusX:DoubleSlider:30:0-100]"
+                                                          RadiusY="@[RadiusY:DoubleSlider:30:0-100]"/>
+                </media:GeometryMaskSurfaceBrush.Mask>
+            </media:GeometryMaskSurfaceBrush>
+        </Grid.Background>
+    </Grid>
+</Page>

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/GeometrySurfaceBrush/GeometrySurfaceBrushPage.xaml

@@ -0,0 +1,44 @@
+<Page x:Class="Microsoft.Toolkit.Uwp.SampleApp.SamplePages.GeometrySurfaceBrushPage"
+      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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+      xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
+      mc:Ignorable="d">
+
+    <!--  Shallow Copy  -->
+    <Grid>
+        <Grid.Background>
+            <media:GeometrySurfaceBrush x:Name="surfaceBrush"
+                                        SurfaceHeight="800"
+                                        SurfaceWidth="800"
+                                        StrokeThickness="15">
+                <media:GeometrySurfaceBrush.RenderStrokeStyle>
+                    <media:StrokeStyle />
+                </media:GeometrySurfaceBrush.RenderStrokeStyle>
+                <media:GeometrySurfaceBrush.Stroke>
+                    <media:SolidColorCanvasBrush Color="Blue"></media:SolidColorCanvasBrush>
+                </media:GeometrySurfaceBrush.Stroke>
+                <media:GeometrySurfaceBrush.FillBrush>
+                    <media:SolidColorCanvasBrush Color="Yellow"></media:SolidColorCanvasBrush>
+                </media:GeometrySurfaceBrush.FillBrush>
+                <media:GeometrySurfaceBrush.Geometry>
+                    <media:CanvasCombinedGeometry GeometryCombineMode="Exclude">
+                        <media:CanvasCombinedGeometry.Geometry1>
+                            <media:CanvasPathGeometry  Data="F1 M 417.661,109.978 L 508.676,294.396 L 751.683,329.707 L 575.842,501.110 L 610.607,703.805 C 613.366,719.893 596.479,732.162 582.031,724.566 L 400.000,628.867 L 217.969,724.566 C 203.521,732.162 186.634,719.893 189.393,703.805 L 224.158,501.110 L 48.317,329.707 L 291.324,294.396 L 382.339,109.978 C 389.564,95.341 410.436,95.341 417.661,109.978 Z" />
+                        </media:CanvasCombinedGeometry.Geometry1>
+                        <media:CanvasCombinedGeometry.Geometry2>
+                            <media:CanvasRoundedRectangleGeometry x:Name="MaskGeometry2"
+                                                                  Width="200"
+                                                                  Height="200"
+                                                                  RadiusX="30"
+                                                                  RadiusY="30"
+                                                                  X="300"
+                                                                  Y="350" />
+                        </media:CanvasCombinedGeometry.Geometry2>
+                    </media:CanvasCombinedGeometry>
+                </media:GeometrySurfaceBrush.Geometry>
+            </media:GeometrySurfaceBrush>
+        </Grid.Background>
+    </Grid>
+</Page>

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/GeometrySurfaceBrush/GeometrySurfaceBrushPage.xaml.cs

@@ -0,0 +1,20 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using Windows.UI.Xaml.Controls;
+
+// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=234238
+namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages
+{
+    /// <summary>
+    /// An empty page that can be used on its own or navigated to within a Frame.
+    /// </summary>
+    public sealed partial class GeometrySurfaceBrushPage : Page
+    {
+        public GeometrySurfaceBrushPage()
+        {
+            this.InitializeComponent();
+        }
+    }
+}

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/GeometrySurfaceBrush/GeometrySurfaceBrushXaml.bind

@@ -0,0 +1,42 @@
+<Page 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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+      xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
+      mc:Ignorable="d">
+
+  <Grid>
+    <Grid.Background>
+      <media:GeometrySurfaceBrush x:Name="surfaceBrush"
+                                  SurfaceHeight="800"
+                                  SurfaceWidth="800"
+                                  StrokeThickness="@[StrokeThickness:DoubleSlider:15:0-100]">
+        <media:GeometrySurfaceBrush.RenderStrokeStyle>
+          <media:StrokeStyle />
+        </media:GeometrySurfaceBrush.RenderStrokeStyle>
+        <media:GeometrySurfaceBrush.Stroke>
+          <media:SolidColorCanvasBrush Color="Blue"></media:SolidColorCanvasBrush>
+        </media:GeometrySurfaceBrush.Stroke>
+        <media:GeometrySurfaceBrush.FillBrush>
+          <media:SolidColorCanvasBrush Color="Yellow"></media:SolidColorCanvasBrush>
+        </media:GeometrySurfaceBrush.FillBrush>
+        <media:GeometrySurfaceBrush.Geometry>
+          <media:CanvasCombinedGeometry GeometryCombineMode="Exclude">
+            <media:CanvasCombinedGeometry.Geometry1>
+              <media:CanvasPathGeometry  Data="F1 M 417.661,109.978 L 508.676,294.396 L 751.683,329.707 L 575.842,501.110 L 610.607,703.805 C 613.366,719.893 596.479,732.162 582.031,724.566 L 400.000,628.867 L 217.969,724.566 C 203.521,732.162 186.634,719.893 189.393,703.805 L 224.158,501.110 L 48.317,329.707 L 291.324,294.396 L 382.339,109.978 C 389.564,95.341 410.436,95.341 417.661,109.978 Z" />
+            </media:CanvasCombinedGeometry.Geometry1>
+            <media:CanvasCombinedGeometry.Geometry2>
+              <media:CanvasRoundedRectangleGeometry x:Name="MaskGeometry2"
+                                                    Width="200"
+                                                    Height="200"
+                                                    RadiusX="@[RadiusX:DoubleSlider:30:10-60]"
+                                                    RadiusY="@[RadiusY:DoubleSlider:30:10-60]"
+                                                    X="@[X:DoubleSlider:300:100-500]"
+                                                    Y="@[Y:DoubleSlider:350:150-550]" />
+            </media:CanvasCombinedGeometry.Geometry2>
+          </media:CanvasCombinedGeometry>
+        </media:GeometrySurfaceBrush.Geometry>
+      </media:GeometrySurfaceBrush>
+    </Grid.Background>
+  </Grid>
+</Page>