mercredi 6 mai 2015

Why Grid is needed predetermined background?

I made in style a button animation. All elements of a button placed in the Grid. But if do not set background in grid, animation does not work correctly.

Button:

<Grid>
  <Rectangle Fill="{TemplateBinding Background}"
    RenderTransformOrigin="0.5,0.5"
    Margin="5">
    <Rectangle.RenderTransform>
        <RotateTransform x:Name="RotateTransform" 
            Angle="0"/>
    </Rectangle.RenderTransform>
  </Rectangle>
</Grid>

Animation:

<ControlTemplate.Triggers>

<EventTrigger RoutedEvent="MouseEnter">
    <BeginStoryboard>
        <Storyboard>
            <DoubleAnimation Storyboard.TargetName="RotateTransform"
                Storyboard.TargetProperty="Angle"
                RepeatBehavior="Forever" 
                Duration="0:0:0.3" 
                To="60"/>
            <!--360 / 6 (number of gear teeth on the image) = 60-->
        </Storyboard>
    </BeginStoryboard>
</EventTrigger>

<EventTrigger RoutedEvent="MouseLeave">
    <BeginStoryboard>
        <Storyboard>
            <DoubleAnimation Storyboard.TargetName="RotateTransform"
                Storyboard.TargetProperty="Angle"
                Duration="0:0:0.2"
                To="0"/>
        </Storyboard>
    </BeginStoryboard>
</EventTrigger>

Grid without a background:

http://ift.tt/1EPDU7k

Grid with background:

http://ift.tt/1EWJKFj

Why is this happening?

Aucun commentaire:

Enregistrer un commentaire