Pre Built Animations (#1667)

* Add tada animation (#1468)

* Base class implementation for pre-built animations

* TADA! Added the first animation

* Max and Min scales for Tada

* Added the RubberBand animation

Co-authored-by: Pedro Jesus <[email protected]>

* Feature/animation samples (#1527)

* Initial attempt at an Animations sample section

* Move all responsibility to AnimationTypes

* Code tidy up

* changed the null and empty verification to be more performant

* Inverted `if` to make the code more readable

* An attempt at async with cancellation

* Remove the need for Task.Delay

* Removed the Type suffix

* Code tidy up and xml docs

Co-authored-by: Pedro Jesus <[email protected]>

* Consolidate AnimationViewModel, Remove Unnecessary Nullables

* TaskExtensions tidy up

* AnimationWrapper tidy up

Remove default parameters

* Rename to CompoundAnimationBase

* Unit tests added around animations

* Reversed the >= check to keep the constant on the right

* Switched to TimeSpan

* Disabled/removed inconsistent tests

* No longer share a ticker instance

* Clear PlatformServices after each animation test

* Code tidy up

* Remove the inconsistent asserts

* Further test ticker changes

- only use AsyncTicker when really needed.
- extra protection around enabling
- set and clear default ticker before/after each test

* Add Missing Asserts

* Update Unit Test NuGet Packages

* Update for Nullable

Co-authored-by: Shaun Lawrence <[email protected]>
Co-authored-by: Brandon Minnick <[email protected]>
Co-authored-by: Gerald Versluis <[email protected]>

Author: 4 people

samples/XCT.Sample/Pages/Animations/AnimationPage.xaml

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<pages:BasePage xmlns="http://xamarin.com/schemas/2014/forms"
+                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                xmlns:pages="clr-namespace:Xamarin.CommunityToolkit.Sample.Pages"
+                xmlns:vm="clr-namespace:Xamarin.CommunityToolkit.Sample.ViewModels.Animations"
+                x:Class="Xamarin.CommunityToolkit.Sample.Pages.Animations.AnimationPage"
+                x:DataType="{x:Null}">
+    <pages:BasePage.BindingContext>
+        <vm:AnimationViewModel />
+    </pages:BasePage.BindingContext>
+
+    <Grid RowDefinitions="*,*">
+        <Label Text="Select an animation below and then tap start."
+               HorizontalTextAlignment="Center"
+               x:Name="Lab"/>
+
+        <StackLayout Grid.Row="1">
+            <Picker ItemsSource="{Binding Animations}"
+                    SelectedItem="{Binding SelectedAnimation}"
+                    ItemDisplayBinding="{Binding Name}"/>
+
+            <Button Text="Start"
+                    Command="{Binding StartAnimationCommand}"
+                    CommandParameter="{x:Reference Name=Lab}"/>
+
+            <Button Text="Stop"
+                    Command="{Binding StopAnimationCommand}"/>
+        </StackLayout>
+        
+
+    </Grid>
+</pages:BasePage>

samples/XCT.Sample/Pages/Animations/AnimationPage.xaml.cs

@@ -0,0 +1,10 @@
+namespace Xamarin.CommunityToolkit.Sample.Pages.Animations
+{
+	public partial class AnimationPage : BasePage
+	{
+		public AnimationPage()
+		{
+			InitializeComponent();
+		}
+	}
+}

samples/XCT.Sample/Pages/Behaviors/AnimationBehaviorPage.xaml

@@ -16,6 +16,22 @@
             <Label Text="This sample demonstrates how to use ViewTappedAnimationBehaviour applying it in different UI elements."
                    Padding="10,10,10,50"/>
 
+            <Button Text="Tada"
+                    FontSize="40"
+                    FontAttributes="Bold"
+                    TextColor="#2D1767"
+                    BackgroundColor="#F8E3C8">
+                 <Button.Behaviors>
+                      <xct:AnimationBehavior EventName="Clicked">
+                            <xct:AnimationBehavior.AnimationType>
+                                <xct:TadaAnimation Easing="{x:Static Easing.Linear}"
+                                                   IsRepeated="True"
+                                                   Duration="1000"/>
+                            </xct:AnimationBehavior.AnimationType>
+                        </xct:AnimationBehavior>
+                </Button.Behaviors>
+            </Button>
+
             <Button Text="Testing Fade Animation"
                    TextColor="HotPink">
                  <Button.Behaviors>

samples/XCT.Sample/Pages/Behaviors/AnimationBehaviorPage.xaml.cs

@@ -3,5 +3,5 @@
 	public partial class AnimationBehaviorPage : BasePage
 	{
 		public AnimationBehaviorPage() => InitializeComponent();
-	}
+    }
 }

samples/XCT.Sample/ViewModels/Animations/AnimationViewModel.cs

@@ -0,0 +1,92 @@
+using System;
+using System.Collections.ObjectModel;
+using System.Linq;
+using System.Threading;
+using System.Threading.Tasks;
+using Xamarin.CommunityToolkit.Behaviors;
+using Xamarin.CommunityToolkit.ObjectModel;
+using Xamarin.Forms;
+
+namespace Xamarin.CommunityToolkit.Sample.ViewModels.Animations
+{
+	public class AnimationViewModel : BaseViewModel
+	{
+		AnimationDetailModel selectedAnimation;
+		CompoundAnimationBase? currentAnimation;
+		CancellationTokenSource? cancellationTokenSource;
+
+		public AnimationViewModel()
+		{
+			Animations = new ObservableCollection<AnimationDetailModel>
+			{
+				new AnimationDetailModel("Tada", (view, onFinished) => new TadaAnimation()),
+				new AnimationDetailModel("RubberBand", (view, onFinished) => new RubberBandAnimation())
+			};
+
+			selectedAnimation = Animations.First();
+			StartAnimationCommand = new AsyncCommand<View>(v => OnStart(v), _ => SelectedAnimation is not null);
+			StopAnimationCommand = new Command(OnStop, () => cancellationTokenSource is not null);
+		}
+
+		public ObservableCollection<AnimationDetailModel> Animations { get; }
+
+		public AsyncCommand<View> StartAnimationCommand { get; }
+
+		public Command StopAnimationCommand { get; }
+
+		public AnimationDetailModel SelectedAnimation
+		{
+			get => selectedAnimation;
+			set => SetProperty(ref selectedAnimation, value);
+		}
+
+		async Task OnStart(View? view)
+		{
+			if (view is null)
+			{
+				return;
+			}
+
+			if (cancellationTokenSource != null)
+			{
+				cancellationTokenSource.Cancel();
+			}
+
+			currentAnimation = SelectedAnimation.CreateAnimation(view, (d, b) =>
+			{
+				StartAnimationCommand.ChangeCanExecute();
+				StopAnimationCommand.ChangeCanExecute();
+			});
+
+			cancellationTokenSource = new CancellationTokenSource();
+			StopAnimationCommand.ChangeCanExecute();
+
+			await currentAnimation.Animate(cancellationTokenSource.Token, view);
+
+			cancellationTokenSource = null;
+			StopAnimationCommand.ChangeCanExecute();
+		}
+
+		void OnStop()
+		{
+			if (cancellationTokenSource != null)
+			{
+				cancellationTokenSource.Cancel();
+			}
+		}
+	}
+
+	public class AnimationDetailModel
+	{
+		public string Name { get; }
+
+		public Func<View, Action<double, bool>, CompoundAnimationBase> CreateAnimation { get; }
+
+		public AnimationDetailModel(string name, Func<View, Action<double, bool>, CompoundAnimationBase> createAnimation)
+		{
+			Name = name;
+			CreateAnimation = createAnimation;
+		}
+	}
+}
+

samples/XCT.Sample/ViewModels/WelcomeViewModel.cs renamed to samples/XCT.Sample/ViewModels/Views/Tabs/WelcomeViewModel.cs

@@ -1,5 +1,6 @@
 using System.Collections.Generic;
 using Xamarin.CommunityToolkit.Sample.Models;
+using Xamarin.CommunityToolkit.Sample.Pages.Animations;
 using Xamarin.CommunityToolkit.Sample.Pages.Behaviors;
 using Xamarin.CommunityToolkit.Sample.Pages.Converters;
 using Xamarin.CommunityToolkit.Sample.Pages.Effects;
@@ -14,6 +15,9 @@ public class WelcomeViewModel : BaseGalleryViewModel
 	{
 		protected override IEnumerable<SectionModel> CreateItems() => new[]
 		{
+			new SectionModel(typeof(AnimationPage), "Animations", Color.FromHex("#41337A"),
+				"A set of pre-built animations to give your app a real edge."),
+
 			new SectionModel(typeof(BehaviorsGalleryPage), "Behaviors", Color.FromHex("#8E8CD8"),
 				"Behaviors lets you add functionality to user interface controls without having to subclass them. Behaviors are written in code and added to controls in XAML or code"),
 

src/CommunityToolkit/Xamarin.CommunityToolkit.UnitTests/Behaviors/Animations/AnimationTypes/RubberbandAnimation_Tests.cs

@@ -0,0 +1,60 @@
+using System;
+using System.Linq;
+using System.Threading;
+using System.Threading.Tasks;
+using NUnit.Framework;
+using Xamarin.CommunityToolkit.Behaviors;
+using Xamarin.CommunityToolkit.UnitTests.Mocks;
+using Xamarin.Forms;
+using Xamarin.Forms.Internals;
+
+namespace Xamarin.CommunityToolkit.UnitTests.Behaviors.Animations.AnimationTypes
+{
+	public class RubberBandAnimation_Tests
+	{
+		[SetUp]
+		public void SetUp()
+		{
+			Device.PlatformServices = new MockPlatformServices();
+			Ticker.SetDefault(new AsyncTicker(TimeSpan.FromMilliseconds(16)));
+		}
+
+		[TearDown]
+		public void TearDown()
+		{
+			Device.PlatformServices = null;
+			Ticker.SetDefault(null);
+		}
+
+		[Test]
+		public async Task AFullAnimationShouldReturnToOriginalValues()
+		{
+			var animation = new RubberBandAnimation();
+			var view = new MockView();
+
+			await animation.Animate(view);
+
+			Assert.IsTrue(view.ValuesSet.ContainsKey(nameof(View.ScaleX)));
+			Assert.AreEqual(1, view.ValuesSet[nameof(View.ScaleX)].Last());
+
+			Assert.IsTrue(view.ValuesSet.ContainsKey(nameof(View.ScaleY)));
+			Assert.AreEqual(1, view.ValuesSet[nameof(View.ScaleY)].Last());
+		}
+
+		[Test]
+		public async Task AnAbortedAnimationShouldNotReturnToOriginalValues()
+		{
+			var animation = new RubberBandAnimation();
+			var view = new MockView();
+			var cancellationTokenSource = new CancellationTokenSource(100);
+
+			await animation.Animate(cancellationTokenSource.Token, view);
+
+			Assert.IsTrue(view.ValuesSet.ContainsKey(nameof(View.ScaleX)));
+			Assert.AreNotEqual(1, view.ValuesSet[nameof(View.ScaleX)].Last());
+
+			Assert.IsTrue(view.ValuesSet.ContainsKey(nameof(View.ScaleY)));
+			Assert.AreNotEqual(1, view.ValuesSet[nameof(View.ScaleY)].Last());
+		}
+	}
+}

src/CommunityToolkit/Xamarin.CommunityToolkit.UnitTests/Behaviors/Animations/AnimationTypes/TadaAnimation_Tests.cs

@@ -0,0 +1,60 @@
+using System;
+using System.Linq;
+using System.Threading;
+using System.Threading.Tasks;
+using NUnit.Framework;
+using Xamarin.CommunityToolkit.Behaviors;
+using Xamarin.CommunityToolkit.UnitTests.Mocks;
+using Xamarin.Forms;
+using Xamarin.Forms.Internals;
+
+namespace Xamarin.CommunityToolkit.UnitTests.Behaviors.Animations.AnimationTypes
+{
+	public class TadaAnimation_Tests
+	{
+		[SetUp]
+		public void SetUp()
+		{
+			Device.PlatformServices = new MockPlatformServices();
+			Ticker.SetDefault(new AsyncTicker(TimeSpan.FromMilliseconds(16)));
+		}
+
+		[TearDown]
+		public void TearDown()
+		{
+			Device.PlatformServices = null;
+			Ticker.SetDefault(null);
+		}
+
+		[Test]
+		public async Task AFullAnimationShouldReturnToOriginalValues()
+		{
+			var animation = new TadaAnimation();
+			var view = new MockView();
+
+			await animation.Animate(view);
+
+			Assert.IsTrue(view.ValuesSet.ContainsKey(nameof(View.Scale)));
+			Assert.AreEqual(1, view.ValuesSet[nameof(View.Scale)].Last());
+
+			Assert.IsTrue(view.ValuesSet.ContainsKey(nameof(View.Rotation)));
+			Assert.AreEqual(0, view.ValuesSet[nameof(View.Rotation)].Last());
+		}
+
+		[Test]
+		public async Task AnAbortedAnimationShouldNotReturnToOriginalValues()
+		{
+			var animation = new TadaAnimation();
+			var view = new MockView();
+			var cancellationTokenSource = new CancellationTokenSource(100);
+
+			await animation.Animate(cancellationTokenSource.Token, view);
+
+			Assert.IsTrue(view.ValuesSet.ContainsKey(nameof(View.Scale)));
+			Assert.AreNotEqual(1, view.ValuesSet[nameof(View.Scale)].Last());
+
+			Assert.IsTrue(view.ValuesSet.ContainsKey(nameof(View.Rotation)));
+			Assert.AreNotEqual(0, view.ValuesSet[nameof(View.Rotation)].Last());
+		}
+	}
+}

src/CommunityToolkit/Xamarin.CommunityToolkit.UnitTests/Behaviors/Animations/AnimationWrapper_Tests.cs

@@ -0,0 +1,77 @@
+using System;
+using NUnit.Framework;
+using Xamarin.CommunityToolkit.Behaviors;
+using Xamarin.CommunityToolkit.UnitTests.Mocks;
+using Xamarin.Forms;
+using Xamarin.Forms.Internals;
+
+namespace Xamarin.CommunityToolkit.UnitTests.Behaviors.Animations
+{
+	public class AnimationWrapper_Tests
+	{
+		[SetUp]
+		public void SetUp()
+		{
+			Device.PlatformServices = new MockPlatformServices();
+			Ticker.SetDefault(new AsyncTicker(TimeSpan.FromMilliseconds(16)));
+		}
+
+		[TearDown]
+		public void TearDown()
+		{
+			Device.PlatformServices = null;
+			Ticker.SetDefault(null);
+		}
+
+		[Test]
+		public void AbortShouldStopAnimationRunning()
+		{
+			var animation = new Animation
+			{
+				{ 0, 1, new Animation(d => { }) }
+			};
+
+			var animationWrapper = new AnimationWrapper(
+				animation,
+				Guid.NewGuid().ToString(),
+				new BoxView(),
+				16,
+				100,
+				Easing.Linear,
+				(v, t) => { },
+				() => false);
+
+			Assert.IsFalse(animationWrapper.IsRunning);
+
+			animationWrapper.Commit();
+			animationWrapper.Abort();
+
+			Assert.IsFalse(animationWrapper.IsRunning);
+		}
+
+		[Test]
+		public void IsRunningShouldReportStatus()
+		{
+			var animation = new Animation
+			{
+				{ 0, 1, new Animation(d => { }) }
+			};
+
+			var animationWrapper = new AnimationWrapper(
+				animation,
+				Guid.NewGuid().ToString(),
+				new BoxView(),
+				16,
+				100,
+				Easing.Linear,
+				(v, t) => { },
+				() => false);
+
+			Assert.IsFalse(animationWrapper.IsRunning);
+
+			animationWrapper.Commit();
+
+			Assert.IsTrue(animationWrapper.IsRunning);
+		}
+	}
+}