变换提供了自定义元素的最强大方式之一。每个元素都能以两种不同的方式使用 变换,RenderTransform属性和LayoutTransform属性。RenderTransform属性效 率更高。因为是在布局之后应用变换,并且用于变换最终的渲染输出。LayoutTransform在布局前应用,从而其他控件需要重新排列以适应变换。 使用RotateTransform时,一定要使用TransformGroup,否则不能进行动画RotateTransform:能够让某对象产生旋转变化,根据中心点进行顺时针旋转或逆时针旋转

效果图:

动态变换

<Window.Resources>

        <Style TargetType="{x:Type Button}">

            <Setter Property="Width" Value="150"/>

            <Setter Property="Height" Value="60"/>

            <Setter Property="Margin" Value="10"/>

            <Setter Property="FontSize" Value="20"/>

            <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>

            <Setter Property="RenderTransform">

                <Setter.Value>

                    <TransformGroup>

                      <RotateTransform/>

                    </TransformGroup>

                </Setter.Value>

            </Setter>

            <Style.Triggers>

                <EventTrigger RoutedEvent="Button.MouseEnter">

                    <EventTrigger.Actions>

                        <BeginStoryboard>

                            <Storyboard RepeatBehavior="Forever" Storyboard.TargetProperty="RenderTransform.Children[0].Angle">

                                <DoubleAnimation From="0" To="360" Duration="0:0:0.08"/>

                            </Storyboard>

                        </BeginStoryboard>

                    </EventTrigger.Actions>

                </EventTrigger>

                <EventTrigger RoutedEvent="Button.MouseLeave">

                    <EventTrigger.Actions>

                        <BeginStoryboard>

                            <Storyboard Storyboard.TargetProperty="RenderTransform.Children[0].Angle">

                                <DoubleAnimation To="0" Duration="0:0:0.08"/>

                            </Storyboard>

                        </BeginStoryboard>

                    </EventTrigger.Actions>

                </EventTrigger>

            </Style.Triggers>

        </Style>

    </Window.Resources>

    <StackPanel>

        <Button Content="爱你魔力转圈圈"/>

        <Button Content="爱你魔力转圈圈"/>

        <Button Content="爱你魔力转圈圈"/>

        <Button Content="爱你魔力转圈圈"/>

        <Button Content="爱你魔力转圈圈"/>

 </StackPanel>

相关文章: