diff --git a/.vscode/settings.json b/.vscode/settings.json
index ebc930a7..45b1618d 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -7,6 +7,6 @@
"csharp.suppressDotnetInstallWarning": true,
"csharp.suppressDotnetRestoreNotification": true,
"csharp.semanticHighlighting.enabled": true,
- "omnisharp.enableImportCompletion": true,
- "omnisharp.enableMsBuildLoadProjectsOnDemand": true
+ "omnisharp.enableMsBuildLoadProjectsOnDemand": true,
+ "dotnet.completion.showCompletionItemsFromUnimportedNamespaces": true
}
\ No newline at end of file
diff --git a/components/Media/samples/Assets/Bloom.jpg b/components/Media/samples/Assets/Bloom.jpg
new file mode 100644
index 00000000..ba0f33c5
Binary files /dev/null and b/components/Media/samples/Assets/Bloom.jpg differ
diff --git a/components/Media/samples/Assets/EffectAnimations.png b/components/Media/samples/Assets/EffectAnimations.png
new file mode 100644
index 00000000..da3a30e6
Binary files /dev/null and b/components/Media/samples/Assets/EffectAnimations.png differ
diff --git a/components/Media/samples/Assets/icon.png b/components/Media/samples/Assets/icon.png
deleted file mode 100644
index 5f574cec..00000000
Binary files a/components/Media/samples/Assets/icon.png and /dev/null differ
diff --git a/components/Media/samples/BlurEffectAnimationSample.xaml b/components/Media/samples/BlurEffectAnimationSample.xaml
new file mode 100644
index 00000000..f2abd267
--- /dev/null
+++ b/components/Media/samples/BlurEffectAnimationSample.xaml
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/BlurEffectAnimationSample.xaml.cs b/components/Media/samples/BlurEffectAnimationSample.xaml.cs
new file mode 100644
index 00000000..91e1c808
--- /dev/null
+++ b/components/Media/samples/BlurEffectAnimationSample.xaml.cs
@@ -0,0 +1,14 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSample(nameof(BlurEffectAnimationSample), "BlurAnimationEffect", "Animate a blur effect")]
+public sealed partial class BlurEffectAnimationSample : Page
+{
+ public BlurEffectAnimationSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/samples/ColorEffectAnimationSample.xaml b/components/Media/samples/ColorEffectAnimationSample.xaml
new file mode 100644
index 00000000..f5251dc8
--- /dev/null
+++ b/components/Media/samples/ColorEffectAnimationSample.xaml
@@ -0,0 +1,47 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/ColorEffectAnimationSample.xaml.cs b/components/Media/samples/ColorEffectAnimationSample.xaml.cs
new file mode 100644
index 00000000..5c942a83
--- /dev/null
+++ b/components/Media/samples/ColorEffectAnimationSample.xaml.cs
@@ -0,0 +1,14 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSample(nameof(ColorEffectAnimationSample), "ColorAnimationEffect", "Animate a TintEffect")]
+public sealed partial class ColorEffectAnimationSample : Page
+{
+ public ColorEffectAnimationSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/samples/CrossFadeEffectAnimationSample.xaml b/components/Media/samples/CrossFadeEffectAnimationSample.xaml
new file mode 100644
index 00000000..ecb49439
--- /dev/null
+++ b/components/Media/samples/CrossFadeEffectAnimationSample.xaml
@@ -0,0 +1,51 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/CrossFadeEffectAnimationSample.xaml.cs b/components/Media/samples/CrossFadeEffectAnimationSample.xaml.cs
new file mode 100644
index 00000000..0d767a77
--- /dev/null
+++ b/components/Media/samples/CrossFadeEffectAnimationSample.xaml.cs
@@ -0,0 +1,14 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSample(nameof(CrossFadeEffectAnimationSample), "CrossFadeAnimationEffect", "Animate a CrossFade effect")]
+public sealed partial class CrossFadeEffectAnimationSample : Page
+{
+ public CrossFadeEffectAnimationSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/samples/Dependencies.props b/components/Media/samples/Dependencies.props
index e622e1df..3e39d81b 100644
--- a/components/Media/samples/Dependencies.props
+++ b/components/Media/samples/Dependencies.props
@@ -9,23 +9,23 @@
For UWP / WinAppSDK / Uno packages, place the package references here.
-->
-
-
-
-
+
+
+
+
-
-
-
-
+
+
+
+
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/EffectAnimations.md b/components/Media/samples/EffectAnimations.md
new file mode 100644
index 00000000..57595c53
--- /dev/null
+++ b/components/Media/samples/EffectAnimations.md
@@ -0,0 +1,55 @@
+---
+title: EffectAnimations
+author: arlodotexe
+description: Animate a Win2D effect using XAML.
+keywords: Media, effects, animations, pipeline
+dev_langs:
+ - csharp
+category: Animations
+subcategory: Media
+discussion-id: 0
+issue-id: 0
+icon: Assets/EffectAnimations.png
+---
+
+EffectAnimations are used to animate the Win2D effects in `CommunityToolkit.WinUI.Media.Effects` without code-behind. Combined with an `AnimationSet`, you can string together complex animated effects that run sequentially or simultaneously.
+
+> [!SAMPLE EffectAnimationsSample]
+
+## BlurEffectAnimation
+
+Apply and animate a Win2D BlurEffect
+
+> [!SAMPLE BlurEffectAnimationSample]
+
+## ColorEffectAnimation
+
+Animate an overlayed color with a Win2D ColorEffect.
+
+> [!SAMPLE ColorEffectAnimationSample]
+
+## CrossFadeEffectAnimation
+
+Blends and animates any PipelineBuilder source with any Win2D effect. This sample blends an image with a `BlurEffect` and effect from `CommunityToolkit.WinUI.Media.Effects`.
+
+> [!SAMPLE CrossFadeEffectAnimationSample]
+
+## ExposureEffectAnimation
+
+Animate the exposure with a Win2D ExposureEffect.
+
+> [!SAMPLE ExposureEffectAnimationSample]
+
+## HueRotationEffectAnimation
+
+Animate Hue to a specific angle using a Win2D HueRotationEffect.
+
+> [!SAMPLE HueRotationEffectAnimationSample]
+
+## SaturationEffectAnimation
+
+> [!SAMPLE SaturationEffectAnimationSample]
+
+## SepiaEffectAnimation
+
+> [!SAMPLE SepiaEffectAnimationSample]
diff --git a/components/Media/samples/EffectAnimationsSample.xaml b/components/Media/samples/EffectAnimationsSample.xaml
new file mode 100644
index 00000000..b6ad850e
--- /dev/null
+++ b/components/Media/samples/EffectAnimationsSample.xaml
@@ -0,0 +1,82 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/EffectAnimationsSample.xaml.cs b/components/Media/samples/EffectAnimationsSample.xaml.cs
new file mode 100644
index 00000000..3528a8bc
--- /dev/null
+++ b/components/Media/samples/EffectAnimationsSample.xaml.cs
@@ -0,0 +1,14 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSample(nameof(EffectAnimationsSample), "EffectAnimation", "Build animated effect pipelines in XAML")]
+public sealed partial class EffectAnimationsSample : Page
+{
+ public EffectAnimationsSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/samples/EffectAnimationsSampleOptions.xaml b/components/Media/samples/EffectAnimationsSampleOptions.xaml
new file mode 100644
index 00000000..33859f9a
--- /dev/null
+++ b/components/Media/samples/EffectAnimationsSampleOptions.xaml
@@ -0,0 +1,49 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/EffectAnimationsSampleOptions.xaml.cs b/components/Media/samples/EffectAnimationsSampleOptions.xaml.cs
new file mode 100644
index 00000000..e5d87960
--- /dev/null
+++ b/components/Media/samples/EffectAnimationsSampleOptions.xaml.cs
@@ -0,0 +1,81 @@
+// 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 CommunityToolkit.WinUI.Animations;
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSampleOptionsPane(nameof(EffectAnimationsSample))]
+[ToolkitSampleOptionsPane(nameof(ColorEffectAnimationSample))]
+[ToolkitSampleOptionsPane(nameof(BlurEffectAnimationSample))]
+[ToolkitSampleOptionsPane(nameof(CrossFadeEffectAnimationSample))]
+[ToolkitSampleOptionsPane(nameof(ExposureEffectAnimationSample))]
+[ToolkitSampleOptionsPane(nameof(HueRotationEffectAnimationSample))]
+[ToolkitSampleOptionsPane(nameof(SaturationEffectAnimationSample))]
+[ToolkitSampleOptionsPane(nameof(SepiaEffectAnimationSample))]
+public sealed partial class EffectAnimationsSampleOptions : Page
+{
+ private AnimationSet _animationSet;
+
+ public EffectAnimationsSampleOptions(AnimationSet animationSet)
+ {
+ _animationSet = animationSet;
+ this.InitializeComponent();
+ }
+
+ public EffectAnimationsSampleOptions(EffectAnimationsSample sampleInstance)
+ : this(new EffectAnimationsSample.XamlNamedPropertyRelay(sampleInstance).ClipAnimation)
+ {
+ }
+
+ public EffectAnimationsSampleOptions(ColorEffectAnimationSample sampleInstance)
+ : this(new ColorEffectAnimationSample.XamlNamedPropertyRelay(sampleInstance).ColorAnimation)
+ {
+ }
+
+ public EffectAnimationsSampleOptions(BlurEffectAnimationSample sampleInstance)
+ : this(new BlurEffectAnimationSample.XamlNamedPropertyRelay(sampleInstance).BlurAnimation)
+ {
+ }
+
+ public EffectAnimationsSampleOptions(CrossFadeEffectAnimationSample sampleInstance)
+ : this(new CrossFadeEffectAnimationSample.XamlNamedPropertyRelay(sampleInstance).CrossFadeAnimation)
+ {
+ }
+
+ public EffectAnimationsSampleOptions(ExposureEffectAnimationSample sampleInstance)
+ : this(new ExposureEffectAnimationSample.XamlNamedPropertyRelay(sampleInstance).ExposureAnimation)
+ {
+ }
+
+ public EffectAnimationsSampleOptions(HueRotationEffectAnimationSample sampleInstance)
+ : this(new HueRotationEffectAnimationSample.XamlNamedPropertyRelay(sampleInstance).HueRotationAnimation)
+ {
+ }
+
+ public EffectAnimationsSampleOptions(OpacityEffectAnimationSample sampleInstance)
+ : this(new OpacityEffectAnimationSample.XamlNamedPropertyRelay(sampleInstance).OpacityAnimation)
+ {
+ }
+
+ public EffectAnimationsSampleOptions(SaturationEffectAnimationSample sampleInstance)
+ : this(new SaturationEffectAnimationSample.XamlNamedPropertyRelay(sampleInstance).SaturationAnimation)
+ {
+ }
+
+ public EffectAnimationsSampleOptions(SepiaEffectAnimationSample sampleInstance)
+ : this(new SepiaEffectAnimationSample.XamlNamedPropertyRelay(sampleInstance).SepiaAnimation)
+ {
+ }
+
+ public void OnStartAnimationButton_Clicked(object sender, RoutedEventArgs e)
+ {
+ _animationSet.Start();
+ }
+
+ public void OnStopAnimationButton_Clicked(object sender, RoutedEventArgs e)
+ {
+ _animationSet.Stop();
+ }
+}
diff --git a/components/Media/samples/ExposureEffectAnimationSample.xaml b/components/Media/samples/ExposureEffectAnimationSample.xaml
new file mode 100644
index 00000000..df3f5661
--- /dev/null
+++ b/components/Media/samples/ExposureEffectAnimationSample.xaml
@@ -0,0 +1,47 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/ExposureEffectAnimationSample.xaml.cs b/components/Media/samples/ExposureEffectAnimationSample.xaml.cs
new file mode 100644
index 00000000..eaef5d4e
--- /dev/null
+++ b/components/Media/samples/ExposureEffectAnimationSample.xaml.cs
@@ -0,0 +1,14 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSample(nameof(ExposureEffectAnimationSample), "ExposureAnimationEffect", "Animate a Exposure effect")]
+public sealed partial class ExposureEffectAnimationSample : Page
+{
+ public ExposureEffectAnimationSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/samples/HueRotationEffectAnimationSample.xaml b/components/Media/samples/HueRotationEffectAnimationSample.xaml
new file mode 100644
index 00000000..b10ecdb5
--- /dev/null
+++ b/components/Media/samples/HueRotationEffectAnimationSample.xaml
@@ -0,0 +1,47 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/HueRotationEffectAnimationSample.xaml.cs b/components/Media/samples/HueRotationEffectAnimationSample.xaml.cs
new file mode 100644
index 00000000..148199c4
--- /dev/null
+++ b/components/Media/samples/HueRotationEffectAnimationSample.xaml.cs
@@ -0,0 +1,14 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSample(nameof(HueRotationEffectAnimationSample), "HueRotationAnimationEffect", "Animate a HueRotation effect")]
+public sealed partial class HueRotationEffectAnimationSample : Page
+{
+ public HueRotationEffectAnimationSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/samples/Media.Samples.csproj b/components/Media/samples/Media.Samples.csproj
index ce5843af..ed9abba0 100644
--- a/components/Media/samples/Media.Samples.csproj
+++ b/components/Media/samples/Media.Samples.csproj
@@ -5,4 +5,11 @@
+
+
+
+
+ PreserveNewest
+
+
diff --git a/components/Media/samples/OpacityEffectAnimationSample.xaml b/components/Media/samples/OpacityEffectAnimationSample.xaml
new file mode 100644
index 00000000..d992528b
--- /dev/null
+++ b/components/Media/samples/OpacityEffectAnimationSample.xaml
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/OpacityEffectAnimationSample.xaml.cs b/components/Media/samples/OpacityEffectAnimationSample.xaml.cs
new file mode 100644
index 00000000..ffe0dcea
--- /dev/null
+++ b/components/Media/samples/OpacityEffectAnimationSample.xaml.cs
@@ -0,0 +1,15 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+// Disabled until we're supplied with more information on how OpacityEffectAnimation is designed to be used.
+// [ToolkitSample(nameof(OpacityEffectAnimationSample), "OpacityAnimationEffect", "Animate an Opacity effect")]
+public sealed partial class OpacityEffectAnimationSample : Page
+{
+ public OpacityEffectAnimationSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/samples/SaturationEffectAnimationSample.xaml b/components/Media/samples/SaturationEffectAnimationSample.xaml
new file mode 100644
index 00000000..5c147dab
--- /dev/null
+++ b/components/Media/samples/SaturationEffectAnimationSample.xaml
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/SaturationEffectAnimationSample.xaml.cs b/components/Media/samples/SaturationEffectAnimationSample.xaml.cs
new file mode 100644
index 00000000..0bdf0936
--- /dev/null
+++ b/components/Media/samples/SaturationEffectAnimationSample.xaml.cs
@@ -0,0 +1,14 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSample(nameof(SaturationEffectAnimationSample), "SaturationAnimationEffect", "Animate a Saturation effect")]
+public sealed partial class SaturationEffectAnimationSample : Page
+{
+ public SaturationEffectAnimationSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/samples/SepiaEffectAnimationSample.xaml b/components/Media/samples/SepiaEffectAnimationSample.xaml
new file mode 100644
index 00000000..22647581
--- /dev/null
+++ b/components/Media/samples/SepiaEffectAnimationSample.xaml
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/Media/samples/SepiaEffectAnimationSample.xaml.cs b/components/Media/samples/SepiaEffectAnimationSample.xaml.cs
new file mode 100644
index 00000000..e192eaf9
--- /dev/null
+++ b/components/Media/samples/SepiaEffectAnimationSample.xaml.cs
@@ -0,0 +1,14 @@
+// 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.
+
+namespace MediaExperiment.Samples;
+
+[ToolkitSample(nameof(SepiaEffectAnimationSample), "SepiaAnimationEffect", "Animate a Sepia effect")]
+public sealed partial class SepiaEffectAnimationSample : Page
+{
+ public SepiaEffectAnimationSample()
+ {
+ this.InitializeComponent();
+ }
+}
diff --git a/components/Media/src/CommunityToolkit.WinUI.Media.csproj b/components/Media/src/CommunityToolkit.WinUI.Media.csproj
index 281fa37d..ac0892cf 100644
--- a/components/Media/src/CommunityToolkit.WinUI.Media.csproj
+++ b/components/Media/src/CommunityToolkit.WinUI.Media.csproj
@@ -12,5 +12,6 @@
+
diff --git a/components/Media/src/Effects/Extensions/BackdropSourceExtension.cs b/components/Media/src/Effects/Extensions/BackdropSourceExtension.cs
index 6ed06966..d969b82a 100644
--- a/components/Media/src/Effects/Extensions/BackdropSourceExtension.cs
+++ b/components/Media/src/Effects/Extensions/BackdropSourceExtension.cs
@@ -2,7 +2,6 @@
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
-#if WINDOWS_UWP
using CommunityToolkit.WinUI.Media.Pipelines;
@@ -14,20 +13,24 @@ namespace CommunityToolkit.WinUI.Media;
[MarkupExtensionReturnType(ReturnType = typeof(PipelineBuilder))]
public sealed class BackdropSourceExtension : MarkupExtension
{
- ///
+ #if WINUI2
/// Gets or sets the background source mode for the effect (the default is ).
///
public AcrylicBackgroundSource BackgroundSource { get; set; } = AcrylicBackgroundSource.Backdrop;
+ #endif
///
protected override object ProvideValue()
{
+#if WINUI3
+ return PipelineBuilder.FromBackdrop();
+#elif WINUI2
return BackgroundSource switch
{
AcrylicBackgroundSource.Backdrop => PipelineBuilder.FromBackdrop(),
AcrylicBackgroundSource.HostBackdrop => PipelineBuilder.FromHostBackdrop(),
_ => throw new ArgumentException($"Invalid source for backdrop effect: {BackgroundSource}")
};
+#endif
}
}
-#endif