how to apply Animation to image on click of button?

Hi

I am not able to apply animation to image on click of button in XAMl but i am able to do this in c#.

Following is the code I am writting;

<Button Name="myButton" Width="75" Height="25" />
<Image Source="c:\images\a.jpg" Height="400" Width="400" >
<Image.RenderTransform>
<TranslateTransform X="100" Y="100" x:Name="myImageTranslate" />
</Image.RenderTransform>
<Image.Triggers>
<EventTrigger RoutedEvent="Button.Click" SourceName="myButton" >
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
To="800" From="0"
Storyboard.TargetName="myImageTranslate" Storyboard.TargetProperty="TranslateTransform.XProperty"
Duration="0:0:5" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Image.Triggers>
</Image>

It is giving exception.

Thanks in advance.

Gagandeep

Answer this question

how to apply Animation to image on click of button?

Peter Peng
Hi ,

Thanks for the reply but i was able to that by defining the storyboard in the window resource and in c# applying the required storyboard to the image.by this way i have to write less line of code.

Thanks a lot for prompt reply.

Gagandeep Singh.
LouisPeter
The following code can do the trick:
<StackPanel>
<Button Name="myButton" Width="75" Height="25">
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation To="100" Duration="0:0:1.5"
Storyboard.TargetName="myImageTranslate"
Storyboard.TargetProperty="(TranslateTransform.X)" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
</Button>
<Image Source="c:\images\a.jpg">
<Image.RenderTransform>
<TranslateTransform X="10" Y="10" x:Name="myImageTranslate"/>
</Image.RenderTransform>
</Image>
</StackPanel>

Sheva
how to apply Animation to image on click of button?

Answer this question