Animate a button when mouse is over
-
What am I doing wrong this time? I want a button to change the scale when mouse is over. I'm really missing something, cause this doesn't work. But what is wrong?
<Button Name="MyScaleButton" >
<Button.Triggers>
<EventTrigger RoutedEvent="Button.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="(Button.RenderTransform).(ScaleTransform.ScaleX)"
From="1" To="2" Duration="0:0:1">
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
My Button
</Button>Nothing at all happens here. Must be wrong in the TargetProperty?
-
What am I doing wrong this time? I want a button to change the scale when mouse is over. I'm really missing something, cause this doesn't work. But what is wrong?
<Button Name="MyScaleButton" >
<Button.Triggers>
<EventTrigger RoutedEvent="Button.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="(Button.RenderTransform).(ScaleTransform.ScaleX)"
From="1" To="2" Duration="0:0:1">
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
My Button
</Button>Nothing at all happens here. Must be wrong in the TargetProperty?
-
Ok, from the beginning I started with a style. Seems like I missed to add..
<Setter Property="LayoutTransform">
<Setter.Value>
<ScaleTransform/>
</Setter.Value>
</Setter>Why is that necessary? Anyway, it works fine now.
I can see why the first one didn't work, since there was no ScaleTransform set on the button's RenderTransform property. I don't understand how this fixed it, however :)
Mark Salsbery Microsoft MVP - Visual C++ :java:
-
Ok, from the beginning I started with a style. Seems like I missed to add..
<Setter Property="LayoutTransform">
<Setter.Value>
<ScaleTransform/>
</Setter.Value>
</Setter>Why is that necessary? Anyway, it works fine now.
That doesn't work for me. This does:
<Grid Width="100" Height="50" >
<Button Name="MyScaleButton" HorizontalAlignment="Center" VerticalAlignment="Center">
<Button.RenderTransform> <ScaleTransform /> </Button.RenderTransform>
<Button.Triggers>
<EventTrigger RoutedEvent="Button.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="(Button.RenderTransform).(ScaleTransform.ScaleX)" From="1" To="2" Duration="0:0:1">
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
My Button
</Button>
</Grid>Mark Salsbery Microsoft MVP - Visual C++ :java: