[Proposal] TextColorTo extension for ITextStyle

TextColorTo extension for ITextStyle

• Proposed
• Prototype
• Implementation
  • iOS Support
  • Android Support
  • macOS Support
  • Windows Support
• Unit Tests
• Sample
• Documentation

Link to Discussion

Extend ColorAnimationExtensions with ‘TextColorTo’ for ITextStyle

Summary

Extend the ColorAnimationExtenions class with a TextColorTo extension method on the ITextStyle interface, allowing developers to animate the color transition of the TextColor property of controls implementing ITextStyle.

Motivation

Currently the ColorAnimationExtensions class has 1 method BackgroundColorTo which helps animating the color transition of a VisualElement’s BackgroundColor. Almost the exact same code can be re-used for this proposed TextColorTo extension method. Effort is low, value is pretty descent as ITextStyle is implemented by several controls.

Detailed Design

public static Task<bool> TextColorTo(this ITextStyle element, Color color, uint rate = 16u, uint length = 250u, Easing? easing = null)
{
	ArgumentNullException.ThrowIfNull(element);
	ArgumentNullException.ThrowIfNull(color);

	element.TextColor ??= Colors.Transparent;

	var animationCompletionSource = new TaskCompletionSource<bool>();

	try
	{
		new Animation
		{
			{ 0, 1, GetRedTransformAnimation(element, color.Red) },
			{ 0, 1, GetGreenTransformAnimation(element, color.Green) },
			{ 0, 1, GetBlueTransformAnimation(element, color.Blue) },
			{ 0, 1, GetAlphaTransformAnimation(element, color.Alpha) },
		}
		.Commit(element, nameof(TextColorTo), rate, length, easing, (d, b) => animationCompletionSource.SetResult(true));
	}
	catch (ArgumentException aex)
	{
		animationCompletionSource.SetResult(false);
	}

	return animationCompletionSource.Task;
}

static Animation GetRedTransformAnimation(ITextStyle element, float targetRed) =>
	new(v => element.TextColor = element.TextColor.WithRed(v), element.TextColor.Red, targetRed);

static Animation GetGreenTransformAnimation(ITextStyle element, float targetGreen) =>
	new(v => element.TextColor= element.TextColor.WithGreen(v), element.TextColor.Green, targetGreen);

static Animation GetBlueTransformAnimation(ITextStyle element, float targetBlue) =>
	new(v => element.TextColor = element.TextColor.WithBlue(v), element.TextColor.Blue, targetBlue);

static Animation GetAlphaTransformAnimation(ITextStyle element, float targetAlpha) =>
	new(v => element.TextColor = element.TextColor.WithAlpha(v), element.TextColor.Alpha, targetAlpha);

Usage Syntax

XAML Usage

N/A

C# Usage

var label = new Label();
await label.TextColorTo(Colors.Red, 16, 1500, Easing.SinIn);

var button = new TextButton();
await button.TextColorTo(Colors.Green, 16, 1500);

var entry = new Entry();
await entry.TextColorTo(Colors.Pink);

[brminnick]

You’re totally right, @PieEatingNinjas!

I decided that the best way to implement this is to use source generators. This allows us to generate a TextColorTo method for each class that implements ITextStyle. And it ensures that any new classes created by the .NET MAUI team that implement ITextStyle will also be supported.

I just opened the PR and I’d love for you to give it a review! https://github.com/CommunityToolkit/Maui/pull/224

[brminnick]

Approved!

Thanks @PieEatingNinjas! Assigned ✅