In this article I am going to explain, how to do color animation in .NET 3.0 with XAML. In this application I am using a rectangle and their property to achieve a colour animation application.
This is the XAML code.
<Window x:Class="AnimationApplication.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="AnimationApplication" Height="300" Width="300"
>
<Grid Name="myGrid">
<Canvas Margin="15,18,18,26" MinHeight="50" MinWidth="50" Name="canvas1">
<!-- Rahul Saxena -->
<Rectangle Height="200" Width="250" Stroke="Blue" StrokeThickness="4.0" ToolTip="C-Sharpcorner.com">
<Rectangle.Fill>
<SolidColorBrush Color="Red" x:Name="myBrush"></SolidColorBrush>
</Rectangle.Fill>
<Rectangle.Triggers>
<EventTrigger RoutedEvent="Polygon.Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetName="myBrush"
Storyboard.TargetProperty="Color"
From="Red" To="Blue" Duration="0:0:5"
RepeatBehavior="Forever" AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>
</Canvas>
</Grid>
</Window>
When user run the application the colour become change after a time duration. For colour chane I used here a property From="ColorName" To="ColorName" and for time duration I used a property Duration="0:0:5".
The Running Window will become look like as:
Figure 1.
After some time the color of rectangle becomes change.
Figure 2.
Figure 3.
Here if I put my mouse in rectangle then it shows a message, it's because of ToolTip property.