Updates to CornerRadiusToThicknessConverter for more filters

active/CornerRadius/CornerRadiusToThickness2.md

@@ -0,0 +1,108 @@
+> See comments in Markdown for how to use this spec template
+
+
+# Background
+
+_This spec updates the existing [CornerRadiusToThicknessConverter](https://docs.microsoft.com/uwp/api/Microsoft.UI.Xaml.Controls.Primitives.CornerRadiusToThicknessConverter) class with new filters._
+
+WinUI has a [CornerRadius](https://docs.microsoft.com/uwp/api/Windows.UI.Xaml.CornerRadius) struct that's used to define the rounding the 4 corners of a box, and the [Thickness](https://docs.microsoft.com/uwp/api/Windows.UI.Xaml.Thickness) struct that's used for defining the padding or margin around the 4 sides of a box.
+
+CornerRadius defines the radius length of the circle segment that's used to draw a rounded corner. For example the following uses 4 different radii for the 4 corners (the corners are listed in clockwise order starting from the top left corner):
+
+```xml
+<Border CornerRadius="0,20,40,60" BorderBrush="Red" BorderThickness="2" Height="100" Width="100" />
+```
+
+![Corner radius example](./CornerRadius.png)
+
+Thickness defines 4 sides. For example the following uses 4 different values for the margins around a blue rectangle in a red box (the sides are listed in clockwise order starting from the left):
+
+```xml
+<Border BorderBrush="Red" BorderThickness="2" Height="100" Width="100" >
+    <Rectangle Fill="Blue" Margin="0,20,40,60" />
+</Border>
+```
+
+![Thickness example](./Thickness.png)
+
+For consistency it's useful to be able to build a Thickness out of components of a CornerRadius. For this reason the [CornerRadiusFilterConverter](https://docs.microsoft.com/uwp/api/Microsoft.UI.Xaml.Controls.Primitives.CornerRadiusFilterConverter) exists, which can be used in Xaml markup. That converter has a [CornerRadiusFilterKind](https://docs.microsoft.com/uwp/api/Microsoft.UI.Xaml.Controls.Primitives.CornerRadiusFilterKind) that lets you define which parts to pull out, what's being added in this spec is update to that enum to allow more parts to be pulled out.
+
+**Existing values:**
+* FilterTopAndBottomFromLeft,
+* FilterTopAndBottomFromRight,
+* FilterLeftAndRightFromTop,
+* FilterLeftAndRightFromBottom
+
+**New values:**
+* FilterTopFromTopLeft,
+* FilterTopFromTopRight,
+* FilterRightFromTopRight,
+* FilterRightFromBottomRight,
+* FilterBottomFromBottomRight,
+* FilterBottomFromBottomLeft,
+* FilterLeftFromBottomLeft,
+* FilterLeftFromTopLeft,
+
+The CornerRadiusFilterConverter is also updated with a new property -- Multiplier -- which is applied during the converstion. For example, setting this to -1 negates the value.
+
+# Examples
+
+This example creates a converter that creates a Thickness from a CornerRadius, where the Thickness is set to zeros except for its left, which uses the the left component of the corner's bottom/left, and then negates it. For example, this converts 
+
+CornerRadius: `10, 20, 30, 40` 
+
+Thickness: `-40, 0, 0, 0`
+
+```xml
+<CornerRadiusToThicknessConverter ConversionKind="FilterLeftFromBottomLeft" Multiplier="-1" x:Name='CornerRadiusToThickness1'/>
+```
+
+This converter can then be used elsewhere in Xaml:
+
+```xml
+<Path 
+    Margin="{Binding Source={ThemeResource OverlayCornerRadius},
+        Converter={StaticResource CornerRadiusToThickness1}}"
+    Height="100"
+    Margin="100"
+    Fill="Red"
+    Data="M4 0 L4 4 L0 4 A4,4 90 0 0 4 0 Z" /> 
+```
+
+
+# API Notes
+
+| | |
+| - | - |
+| FilterTopFromTopLeft | Sets top from the top left corner |
+| FilterTopFromTopRight | Sets the top from the top right corner |
+| FilterRightFromTopRight | Sets the right from the top right corner |
+| FilterRightFromBottomRight | Sets the right from the bottom right corner |
+| FilterBottomFromBottomRight | Sets the bottom from the bottom right corner |
+| FilterBottomFromBottomLeft | Sets the bottom from the bottom left corner |
+| FilterLeftFromBottomLeft | Sets the left from the bottom left corner |
+| FilterLeftFromTopLeft | Sets the left from the top left corner |
+
+# API Details
+
+```cs
+[webhosthidden]
+enum CornerRadiusToThicknessConverterKind
+{
+  FilterTopAndBottomFromLeft,
+  FilterTopAndBottomFromRight,
+  FilterLeftAndRightFromTop,
+  FilterLeftAndRightFromBottom,
+
+  // New
+  FilterTopFromTopLeft,
+  FilterTopFromTopRight,
+  FilterRightFromTopRight,
+  FilterRightFromBottomRight,
+  FilterBottomFromBottomRight,
+  FilterBottomFromBottomLeft,
+  FilterLeftFromBottomLeft,
+  FilterLeftFromTopLeft,
+};
+```
+