CODEWITHSUNDEEP
animationuwp
Quark Soup
Quark Soup

Reputation: 4733

How do you animate the color of text in UWP?

I need an example of animating the brush of a text control (TextBlock, TextBox). When the value of a text block/box changes, I want to highlight it in red, then have it fade to black. This was easily done in WPF, but I can't find any examples in UWP.

Upvotes: 2

Views: 468

Answers (1)

Anran Zhang
Anran Zhang

Reputation: 7727

In UWP, animation can be set through Storyboard. According to your needs, what you want should be ColorAnimation.

Here is an example:

xaml

<Page.Resources>
    <Storyboard x:Name="InputBoxBorderAnimation">
        <ColorAnimation Duration="0:0:1" From="Red" To="Black" Storyboard.TargetName="MyTextBox"
                        Storyboard.TargetProperty="(MyTextBox.BorderBrush).(SolidColorBrush.Color)"/>
    </Storyboard>
</Page.Resources>

<Grid>
    <TextBox x:Name="MyTextBox" HorizontalAlignment="Center" 
             VerticalAlignment="Center" Width="300" TextChanged="MyTextBox_TextChanged"/>
</Grid>

xaml.cs

private void MyTextBox_TextChanged(object sender, TextChangedEventArgs e)
{
    InputBoxBorderAnimation.Begin();
}

This will change the border color each time you enter text in the text box.

If you want to learn more about UWP animation, these documents may help you:

Upvotes: 3

Related Questions