Below is the sample code to Animate the button (Change the width,Change the Background color,Change the border color ) on Mouse Over
<PageFunction
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
x:Class="TestWPF.ExAnimation1"
x:TypeArguments="sys:String"
Title="ExAnimation1">
<StackPanel>
<StackPanel.Triggers>
<EventTrigger RoutedEvent="Rectangle.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard Storyboard.TargetName="btnAnimate"
Storyboard.TargetProperty="Width">
<DoubleAnimation From="120"
To="180"
Duration="0:0:2"/>
</Storyboard>
</BeginStoryboard>
<BeginStoryboard>
<Storyboard Storyboard.TargetName="btnAnimate"
Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)">
<ColorAnimation From="orange"
To="Blue"
By="Beige"
Duration="0:0:5" />
</Storyboard>
</BeginStoryboard>
<BeginStoryboard>
<Storyboard Storyboard.TargetName="btnAnimate"
Storyboard.TargetProperty="BorderBrush.Color">
<ColorAnimation From="Black"
To="Orange"
By="Red"
Duration="0:0:5" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</StackPanel.Triggers>
<Button Name="btnAnimate"
Width="120"
Height="50"
Margin="40"
Background="OrangeRed" BorderBrush="Cyan">
ANIMATE
</Button>
</StackPanel>
</PageFunction>
No comments:
Post a Comment