Add Activity and StartAnimationActivity

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

@@ -590,6 +590,7 @@
     <Content Include="SamplePages\ColorPicker\ColorPickerButtonXaml.bind" />
     <Content Include="SamplePages\Animations\Effects\FadeBehaviorCode.bind" />
     <Content Include="SamplePages\Animations\Effects\FadeBehaviorXaml.bind" />
+    <Content Include="SamplePages\Animations\Activities\StartAnimationActivity.bind" />
   </ItemGroup>
   <ItemGroup>
     <Compile Include="App.xaml.cs">

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Animations/Activities/StartAnimationActivity.bind

@@ -0,0 +1,50 @@
+<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:interactivity="using:Microsoft.Xaml.Interactivity"
+    xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
+    xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
+    xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors.Animations"
+    xmlns:core="using:Microsoft.Xaml.Interactions.Core"
+    mc:Ignorable="d">
+  
+  <Button Background="Gray" Width="200" Height="200" HorizontalAlignment="Center" VerticalAlignment="Center">
+    <ani:Explicit.Animations>
+      <ani:AnimationSet x:Name="MoveAnimation" IsSequential="True">
+        <ani:TranslationAnimation Duration="0:0:3" To="0,32,0" From="0,0,0" />
+        <ani:StartAnimationActivity Delay="0:0:3" Animation="{Binding ElementName=FadeOutAnimation}"/>
+        <ani:StartAnimationActivity Delay="0:0:3" Animation="{Binding ElementName=FadeInAnimation}"/>
+        <ani:TranslationAnimation Duration="0:0:1" To="0,0,0" From="0,32,0" />
+      </ani:AnimationSet>
+    </ani:Explicit.Animations>
+    
+    <Image Source="ms-appx:///Assets/ToolkitLogo.png" Height="100" Width="100">
+      <ani:Explicit.Animations>
+        <ani:AnimationSet x:Name="FadeOutAnimation">
+          <ani:OpacityAnimation From="1"
+                                To="0"
+                                Duration="0:0:1"
+                                Delay="0"
+                                EasingType="Linear"
+                                EasingMode="EaseOut"/>
+        </ani:AnimationSet>
+        <ani:AnimationSet x:Name="FadeInAnimation">
+          <ani:OpacityAnimation From="0"
+                                To="1"
+                                Duration="0:0:1"
+                                Delay="0"
+                                EasingType="Linear"
+                                EasingMode="EaseOut"/>
+        </ani:AnimationSet>
+      </ani:Explicit.Animations>
+    </Image>
+
+    <interactivity:Interaction.Behaviors>
+      <interactions:EventTriggerBehavior EventName="Click">
+        <behaviors:StartAnimationAction Animation="{Binding ElementName=MoveAnimation}"/>
+      </interactions:EventTriggerBehavior>
+    </interactivity:Interaction.Behaviors>
+  </Button>
+</Page>

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/XamlOnlyPage.xaml

@@ -27,8 +27,9 @@
     <Grid>
         <ani:Explicit.Animations>
             <ani:AnimationSet x:Name="AnimationSet">
-                <ani:OpacityAnimation />
                 <ani:BlurEffectAnimation />
+                <ani:OpacityAnimation />
+                <ani:StartAnimationActivity />
             </ani:AnimationSet>
         </ani:Explicit.Animations>
         <media:UIElementExtensions.VisualFactory>

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/samples.json

@@ -460,6 +460,14 @@
     "Name": "Animations",
     "Icon": "Icons/Animations.png",
     "Samples": [
+      {
+        "Name": "StartAnimationActivity",
+        "Subcategory": "Activities",
+        "About": "Activity for Animations to Start another Animation",
+        "CodeUrl": "https://github.com/windows-toolkit/WindowsCommunityToolkit/tree/master/Microsoft.Toolkit.Uwp.UI.Animations/Xaml/Activities",
+        "XamlCodeFile": "/SamplePages/Animations/Activities/StartAnimationActivity.bind",
+        "DocumentationUrl": "https://raw.githubusercontent.com/MicrosoftDocs/WindowsCommunityToolkitDocs/master/docs/animations/Fade.md"
+      },
       {
         "Name": "Fade",
         "Subcategory": "Effect",

Microsoft.Toolkit.Uwp.UI.Animations/Xaml/Activities/Activity.cs

@@ -0,0 +1,32 @@
+// 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.Threading.Tasks;
+using Windows.UI.Xaml;
+
+namespace Microsoft.Toolkit.Uwp.UI.Animations
+{
+    /// <summary>
+    /// Base class to use when creating activities which accept a <see cref="Delay"/>.
+    /// </summary>
+    public abstract class Activity : DependencyObject, IActivity
+    {
+        /// <summary>
+        /// Gets or sets the <see cref="TimeSpan"/> to wait before running the activity.
+        /// </summary>
+        public TimeSpan? Delay { get; set; }
+
+        /// <inheritdoc/>
+        public virtual Task InvokeAsync(UIElement element)
+        {
+            if (Delay is not null)
+            {
+                return Task.Delay(Delay.Value);
+            }
+
+            return Task.CompletedTask;
+        }
+    }
+}

Microsoft.Toolkit.Uwp.UI.Animations/Xaml/Activities/StartAnimationActivity.cs

@@ -0,0 +1,73 @@
+using Microsoft.Toolkit.Diagnostics;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Windows.UI.Xaml;
+
+namespace Microsoft.Toolkit.Uwp.UI.Animations
+{
+    /// <summary>
+    /// <see cref="IActivity"/> which Starts the provided <see cref="Animation"/> when invoked.
+    /// </summary>
+    public class StartAnimationActivity : Activity
+    {
+        /// <summary>
+        /// Gets or sets the linked <see cref="AnimationSet"/> instance to invoke.
+        /// </summary>
+        public AnimationSet Animation
+        {
+            get => (AnimationSet)GetValue(AnimationProperty);
+            set => SetValue(AnimationProperty, value);
+        }
+
+        /// <summary>
+        /// Identifies the <seealso cref="Animation"/> dependency property.
+        /// </summary>
+        public static readonly DependencyProperty AnimationProperty = DependencyProperty.Register(
+            "Animation",
+            typeof(AnimationSet),
+            typeof(StartAnimationActivity),
+            new PropertyMetadata(null));
+
+        /// <summary>
+        /// Gets or sets the object to start the specified animation on. If not specified, will use the current object the parent animation is running on.
+        /// </summary>
+        public UIElement TargetObject
+        {
+            get { return (UIElement)GetValue(TargetObjectProperty); }
+            set { SetValue(TargetObjectProperty, value); }
+        }
+
+        /// <summary>
+        /// Identifies the <seealso cref="TargetObject"/> dependency property.
+        /// </summary>
+        public static readonly DependencyProperty TargetObjectProperty =
+            DependencyProperty.Register(nameof(TargetObject), typeof(UIElement), typeof(StartAnimationActivity), new PropertyMetadata(null));
+
+        /// <inheritdoc/>
+        public override async Task InvokeAsync(UIElement element)
+        {
+            Guard.IsNotNull(Animation, nameof(Animation));
+
+            await base.InvokeAsync(element);
+
+            // If we've specified an explicit target for the Animation, use that
+            if (TargetObject is not null)
+            {
+                await Animation.StartAsync(TargetObject);
+            }
+            //// Otherwise see if the Animation has any context, and if not, we'll run it in our own context
+            else if (Animation.ParentReference is null)
+            {
+                await Animation.StartAsync(element);
+            }
+            //// Otherwise use the Animation's context (usually parent)
+            else
+            {
+                await Animation.StartAsync();
+            }
+        }
+    }
+}

Microsoft.Toolkit.Uwp.UI.Animations/Xaml/AnimationSet.cs

@@ -106,9 +106,9 @@ namespace Microsoft.Toolkit.Uwp.UI.Animations
 
                         await builder.StartAsync(element);
                     }
-                    else if (node is ITrigger trigger)
+                    else if (node is IActivity trigger)
                     {
-                        await trigger.InvokeAsync();
+                        await trigger.InvokeAsync(element);
                     }
                 }
             }
@@ -123,8 +123,8 @@ namespace Microsoft.Toolkit.Uwp.UI.Animations
                         case ITimeline timeline:
                             builder = timeline.AppendToBuilder(builder);
                             break;
-                        case ITrigger trigger:
-                            _ = trigger.InvokeAsync();
+                        case IActivity trigger:
+                            _ = trigger.InvokeAsync(element);
                             break;
                     }
                 }

Microsoft.Toolkit.Uwp.UI.Animations/Xaml/Interfaces/IActivity.cs

@@ -3,18 +3,19 @@
 // See the LICENSE file in the project root for more information.
 
 using System.Threading.Tasks;
+using Windows.UI.Xaml;
 
 namespace Microsoft.Toolkit.Uwp.UI.Animations
 {
     /// <summary>
-    /// An interface representing a XAML model for a custom trigger or action.
+    /// An interface representing a XAML model for a custom activity or action within an <see cref="AnimationSet"/> 'Timeline'.
     /// </summary>
-    public interface ITrigger : AnimationSet.INode
+    public interface IActivity : AnimationSet.INode
     {
         /// <summary>
-        /// Invokes the current trigger.
+        /// Invokes the current activity.
         /// </summary>
-        /// <returns>A <see cref="Task"/> that indicates when the trigger has completed its execution.</returns>
-        Task InvokeAsync();
+        /// <returns>A <see cref="Task"/> that indicates when the activity has completed its execution.</returns>
+        Task InvokeAsync(UIElement element);
     }
 }

Microsoft.Toolkit.Uwp.UI.Animations/Xaml/Interfaces/IImplicitTimeline.cs

@@ -15,7 +15,7 @@ namespace Microsoft.Toolkit.Uwp.UI.Animations
     public interface IImplicitTimeline
     {
         /// <summary>
-        /// Gets a <see cref="CompositionAnimation"/> from the currnet node. This animation might
+        /// Gets a <see cref="CompositionAnimation"/> from the current node. This animation might
         /// be used either as an implicit show/hide animation, or as a direct implicit animation.
         /// </summary>
         /// <param name="element">The target <see cref="UIElement"/> the animation will be applied to.</param>

Microsoft.Toolkit.Uwp.UI.Behaviors/Animations/StartAnimationAction.cs

@@ -32,14 +32,29 @@ namespace Microsoft.Toolkit.Uwp.UI.Behaviors.Animations
             typeof(StartAnimationAction),
             new PropertyMetadata(null));
 
+        /// <summary>
+        /// Gets or sets the object to start the specified animation on. If not specified, will use the current object the parent animation is running on.
+        /// </summary>
+        public UIElement TargetObject
+        {
+            get { return (UIElement)GetValue(TargetObjectProperty); }
+            set { SetValue(TargetObjectProperty, value); }
+        }
+
+        /// <summary>
+        /// Identifies the <seealso cref="TargetObject"/> dependency property.
+        /// </summary>
+        public static readonly DependencyProperty TargetObjectProperty =
+            DependencyProperty.Register(nameof(TargetObject), typeof(UIElement), typeof(StartAnimationActivity), new PropertyMetadata(null));
+
         /// <inheritdoc/>
         public object Execute(object sender, object parameter)
         {
             Guard.IsNotNull(Animation, nameof(Animation));
 
-            if (sender is UIElement element)
+            if (TargetObject is not null)
             {
-                Animation.Start(element);
+                Animation.Start(TargetObject);
             }
             else
             {