Refactoring/Improvements based on Community Feedback to Pipeline Brushes

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/PipelineBrush/PipelineBrushPage.xaml

@@ -26,6 +26,7 @@
                         <effects:ExposureEffect/>
                         <effects:GrayscaleEffect/>
                         <effects:HueRotationEffect/>
+                        <effects:CrossFadeEffect/>
                     </media:PipelineBrush>
                 </Border.Background>
             </Border>

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/PipelineBrush/PipelineBrushXaml.bind

@@ -26,8 +26,8 @@
             <effects:BlendEffect Mode="Multiply" Source="{effects:BackdropSource}"/>
             <effects:BlurEffect Amount="16"/>
             <effects:ShadeEffect Color="#FF222222" Intensity="0.2"/>
-            <effects:BlendEffect Mode="Overlay" Placement="Background" Source="{effects:TileSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}"/>
-            <effects:BlendEffect Mode="Overlay" Placement="Background" Source="{effects:ImageSource Uri=ms-appx:///SamplePages/DropShadowPanel/Unicorn.png}"/>
+            <effects:BlendEffect Mode="Overlay" Source="{effects:TileSource Uri=ms-appx:///Assets/BrushAssets/NoiseTexture.png}"/>
+            <effects:BlendEffect Mode="Overlay" Source="{effects:ImageSource Uri=ms-appx:///SamplePages/DropShadowPanel/Unicorn.png}"/>
           </brushes:PipelineBrush>
         </Border.Background>
       </Border>

Microsoft.Toolkit.Uwp.UI.Media/Brushes/AcrylicBrush.cs

@@ -66,13 +66,13 @@ private static void OnSourcePropertyChanged(DependencyObject d, DependencyProper
         }
 
         /// <summary>
-        /// Gets or sets the blur amount for the effect
+        /// Gets or sets the blur amount for the effect (must be a positive value)
         /// </summary>
         /// <remarks>This property is ignored when the active mode is <see cref="AcrylicBackgroundSource.HostBackdrop"/></remarks>
         public double BlurAmount
         {
             get => (double)GetValue(BlurAmountProperty);
-            set => SetValue(BlurAmountProperty, value);
+            set => SetValue(BlurAmountProperty, Math.Max(value, 0));
         }
 
         /// <summary>
@@ -132,12 +132,12 @@ private static void OnTintColorPropertyChanged(DependencyObject d, DependencyPro
         }
 
         /// <summary>
-        /// Gets or sets the tint opacity factor for the effect
+        /// Gets or sets the tint opacity factor for the effect (default is 0.5, must be in the [0, 1] range)
         /// </summary>
         public double TintOpacity
         {
             get => (double)GetValue(TintOpacityProperty);
-            set => SetValue(TintOpacityProperty, value);
+            set => SetValue(TintOpacityProperty, Math.Clamp(value, 0, 1));
         }
 
         /// <summary>
@@ -147,7 +147,7 @@ public double TintOpacity
             nameof(TintOpacity),
             typeof(double),
             typeof(AcrylicBrush),
-            new PropertyMetadata(0.0, OnTintOpacityPropertyChanged));
+            new PropertyMetadata(0.5, OnTintOpacityPropertyChanged));
 
         /// <summary>
         /// Updates the UI when <see cref="TintOpacity"/> changes

Microsoft.Toolkit.Uwp.UI.Media/Effects/BlendEffect.cs

@@ -5,13 +5,15 @@
 using System.Collections.Generic;
 using Microsoft.Graphics.Canvas.Effects;
 using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
+using Windows.UI.Xaml.Markup;
 
 namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
 {
     /// <summary>
     /// A blend effect that merges the current builder with an input one
     /// </summary>
     /// <remarks>This effect maps to the Win2D <see cref="Graphics.Canvas.Effects.BlendEffect"/> effect</remarks>
+    [ContentProperty(Name = nameof(Effects))]
     public sealed class BlendEffect : IPipelineEffect
     {
         /// <summary>

Microsoft.Toolkit.Uwp.UI.Media/Effects/BlurEffect.cs

@@ -2,6 +2,7 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using System;
 using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
 
 namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
@@ -12,10 +13,16 @@ namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
     /// <remarks>This effect maps to the Win2D <see cref="Graphics.Canvas.Effects.GaussianBlurEffect"/> effect</remarks>
     public sealed class BlurEffect : IPipelineEffect
     {
+        private double amount;
+
         /// <summary>
-        /// Gets or sets the amount of gaussian blur to apply to the background.
+        /// Gets or sets the blur amount for the effect (must be a positive value)
         /// </summary>
-        public double Amount { get; set; }
+        public double Amount
+        {
+            get => this.amount;
+            set => this.amount = Math.Max(value, 0);
+        }
 
         /// <inheritdoc/>
         public PipelineBuilder AppendToPipeline(PipelineBuilder builder)

Microsoft.Toolkit.Uwp.UI.Media/Effects/CrossFadeEffect.cs

@@ -0,0 +1,53 @@
+// 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 System;
+using System.Collections.Generic;
+using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
+using Windows.UI.Xaml.Markup;
+
+namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
+{
+    /// <summary>
+    /// A blend effect that merges the current builder with an input one
+    /// </summary>
+    /// <remarks>This effect maps to the Win2D <see cref="Graphics.Canvas.Effects.CrossFadeEffect"/> effect</remarks>
+    [ContentProperty(Name = nameof(Effects))]
+    public sealed class CrossFadeEffect : IPipelineEffect
+    {
+        /// <summary>
+        /// Gets or sets the input to merge with the current instance (defaults to a <see cref="BackdropSourceExtension"/> with <see cref="Windows.UI.Xaml.Media.AcrylicBackgroundSource.Backdrop"/> source).
+        /// </summary>
+        public PipelineBuilder Source { get; set; }
+
+        /// <summary>
+        /// Gets or sets the effects to apply to the input to merge with the current instance
+        /// </summary>
+        public List<IPipelineEffect> Effects { get; set; } = new List<IPipelineEffect>();
+
+        private double factor = 0.5;
+
+        /// <summary>
+        /// Gets or sets the The cross fade factor to blend the input effects (default to 0.5, should be in the [0, 1] range)
+        /// </summary>
+        public double Factor
+        {
+            get => this.factor;
+            set => this.factor = Math.Clamp(value, 0, 1);
+        }
+
+        /// <inheritdoc/>
+        public PipelineBuilder AppendToPipeline(PipelineBuilder builder)
+        {
+            PipelineBuilder inputBuilder = Source ?? PipelineBuilder.FromBackdrop();
+
+            foreach (IPipelineEffect effect in this.Effects)
+            {
+                inputBuilder = effect.AppendToPipeline(inputBuilder);
+            }
+
+            return builder.CrossFade(inputBuilder, (float)Factor);
+        }
+    }
+}

Microsoft.Toolkit.Uwp.UI.Media/Effects/ExposureEffect.cs

@@ -2,6 +2,7 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using System;
 using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
 
 namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
@@ -12,10 +13,16 @@ namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
     /// <remarks>This effect maps to the Win2D <see cref="Graphics.Canvas.Effects.ExposureEffect"/> effect</remarks>
     public sealed class ExposureEffect : IPipelineEffect
     {
+        private double amount;
+
         /// <summary>
         /// Gets or sets the amount of exposure to apply to the background (defaults to 0, should be in the [-2, 2] range).
         /// </summary>
-        public double Amount { get; set; }
+        public double Amount
+        {
+            get => this.amount;
+            set => this.amount = Math.Clamp(value, -2, 2);
+        }
 
         /// <inheritdoc/>
         public PipelineBuilder AppendToPipeline(PipelineBuilder builder)

Microsoft.Toolkit.Uwp.UI.Media/Effects/Extensions/AcrylicSourceExtension.cs

@@ -22,21 +22,33 @@ public sealed class AcrylicSourceExtension : MarkupExtension
         /// </summary>
         public AcrylicBackgroundSource BackgroundSource { get; set; } = AcrylicBackgroundSource.Backdrop;
 
+        private double blurAmount;
+
         /// <summary>
-        /// Gets or sets the blur amount for the effect
+        /// Gets or sets the blur amount for the effect (must be a positive value)
         /// </summary>
         /// <remarks>This property is ignored when the active mode is <see cref="AcrylicBackgroundSource.HostBackdrop"/></remarks>
-        public double BlurAmount { get; set; }
+        public double BlurAmount
+        {
+            get => this.blurAmount;
+            set => this.blurAmount = Math.Max(value, 0);
+        }
 
         /// <summary>
         /// Gets or sets the tint for the effect
         /// </summary>
         public Color TintColor { get; set; }
 
+        private double tintOpacity = 0.5f;
+
         /// <summary>
-        /// Gets or sets the color for the tint effect
+        /// Gets or sets the color for the tint effect (default is 0.5, must be in the [0, 1] range)
         /// </summary>
-        public double TintOpacity { get; set; }
+        public double TintOpacity
+        {
+            get => this.tintOpacity;
+            set => this.tintOpacity = Math.Clamp(value, 0, 1);
+        }
 
         /// <summary>
         /// Gets or sets the <see cref="Uri"/> to the texture to use

Microsoft.Toolkit.Uwp.UI.Media/Effects/OpacityEffect.cs

@@ -2,6 +2,7 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using System;
 using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
 
 namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
@@ -12,10 +13,16 @@ namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
     /// <remarks>This effect maps to the Win2D <see cref="Graphics.Canvas.Effects.OpacityEffect"/> effect</remarks>
     public sealed class OpacityEffect : IPipelineEffect
     {
+        private double value = 1;
+
         /// <summary>
         /// Gets or sets the opacity value to apply to the background (defaults to 1, should be in the [0, 1] range).
         /// </summary>
-        public double Value { get; set; } = 1;
+        public double Value
+        {
+            get => this.value;
+            set => this.value = Math.Clamp(value, 0, 1);
+        }
 
         /// <inheritdoc/>
         public PipelineBuilder AppendToPipeline(PipelineBuilder builder)

Microsoft.Toolkit.Uwp.UI.Media/Effects/SaturationEffect.cs

@@ -2,6 +2,7 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using System;
 using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
 
 namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
@@ -12,10 +13,16 @@ namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
     /// <remarks>This effect maps to the Win2D <see cref="Graphics.Canvas.Effects.SaturationEffect"/> effect</remarks>
     public sealed class SaturationEffect : IPipelineEffect
     {
+        private double value = 1;
+
         /// <summary>
         /// Gets or sets the saturation amount to apply to the background (defaults to 1, should be in the [0, 1] range).
         /// </summary>
-        public double Value { get; set; } = 1;
+        public double Value
+        {
+            get => this.value;
+            set => this.value = Math.Clamp(value, 0, 1);
+        }
 
         /// <inheritdoc/>
         public PipelineBuilder AppendToPipeline(PipelineBuilder builder)

Microsoft.Toolkit.Uwp.UI.Media/Effects/SepiaEffect.cs

@@ -2,6 +2,7 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using System;
 using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
 
 namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
@@ -12,10 +13,16 @@ namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
     /// <remarks>This effect maps to the Win2D <see cref="Graphics.Canvas.Effects.SepiaEffect"/> effect</remarks>
     public sealed class SepiaEffect : IPipelineEffect
     {
+        private double intensity = 0.5;
+
         /// <summary>
         /// Gets or sets the intensity of the effect (defaults to 0.5, should be in the [0, 1] range).
         /// </summary>
-        public double Intensity { get; set; } = 0.5;
+        public double Intensity
+        {
+            get => this.intensity;
+            set => this.intensity = Math.Clamp(value, 0, 1);
+        }
 
         /// <inheritdoc/>
         public PipelineBuilder AppendToPipeline(PipelineBuilder builder)

Microsoft.Toolkit.Uwp.UI.Media/Effects/ShadeEffect.cs

@@ -2,6 +2,7 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using System;
 using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
 using Windows.UI;
 
@@ -17,10 +18,16 @@ public sealed class ShadeEffect : IPipelineEffect
         /// </summary>
         public Color Color { get; set; }
 
+        private double intensity = 0.5;
+
         /// <summary>
-        /// Gets or sets the intensity of the color layer
+        /// Gets or sets the intensity of the color layer (default to 0.5, should be in the [0, 1] range)
         /// </summary>
-        public double Intensity { get; set; }
+        public double Intensity
+        {
+            get => this.intensity;
+            set => this.intensity = Math.Clamp(value, 0, 1);
+        }
 
         /// <inheritdoc/>
         public PipelineBuilder AppendToPipeline(PipelineBuilder builder)

Microsoft.Toolkit.Uwp.UI.Media/Effects/TemperatureAndTintEffect.cs

@@ -2,6 +2,7 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using System;
 using Microsoft.Toolkit.Uwp.UI.Media.Pipelines;
 
 namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
@@ -12,15 +13,27 @@ namespace Microsoft.Toolkit.Uwp.UI.Media.Effects
     /// <remarks>This effect maps to the Win2D <see cref="Graphics.Canvas.Effects.TemperatureAndTintEffect"/> effect</remarks>
     public sealed class TemperatureAndTintEffect : IPipelineEffect
     {
+        private double temperature;
+
         /// <summary>
-        /// Gets or sets the value of the temperature for the current effect
+        /// Gets or sets the value of the temperature for the current effect (defaults to 0, should be in the [-1, 1] range)
         /// </summary>
-        public double Temperature { get; set; }
+        public double Temperature
+        {
+            get => this.temperature;
+            set => this.temperature = Math.Clamp(value, -1, 1);
+        }
+
+        private double tint;
 
         /// <summary>
-        /// Gets or sets the value of the tint for the current effect
+        /// Gets or sets the value of the tint for the current effect (defaults to 0, should be in the [-1, 1] range)
         /// </summary>
-        public double Tint { get; set; }
+        public double Tint
+        {
+            get => this.tint;
+            set => this.tint = Math.Clamp(value, -1, 1);
+        }
 
         /// <inheritdoc/>
         public PipelineBuilder AppendToPipeline(PipelineBuilder builder)