WPF —— 动画旋转变换

最新推荐文章于 2025-04-30 11:32:48 发布

小刘同志..

最新推荐文章于 2025-04-30 11:32:48 发布

阅读量899

点赞数 1

CC 4.0 BY-SA版权

分类专栏： WPF # WPF动画文章标签： wpf

本文链接：https://blog.youkuaiyun.com/lu2023_8_6/article/details/137564770

WPF 同时被 2 个专栏收录

29 篇文章

订阅专栏

WPF动画

7 篇文章

订阅专栏

文章讲述了如何在WPF中使用RotateTransform在二维坐标系中控制按钮的动态旋转，包括RenderTransform.Angle的设置，以及利用TransformGroup和EventTrigger实现在鼠标进入和离开时的旋转动画控制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

RotateTransform:在二维x-y坐标系统内围绕指定点顺时针旋转某个对象:
在故事板中依赖属性为:RenderTransform.Angle就是要进行旋转的角度
直接给按钮添加 RenderTransformOrigin="0.5,0.5" 是中心位置。值是比例0 和1，


 <Button Width="100" Height="40" RenderTransformOrigin="0.5,0.5">

TransformGroup 可以支持多个变换支持平移也支持旋转

<TransformGroup>
    <TranslateTransform></TranslateTransform>
    <!--Angle = "90" 一开始旋转的效果 正值是顺时针，赋值是逆时针-->
    <!--CenterX="50" CenterY="20" 可以设置旋转的中心点，这两个值是宽度的一般和高度的一半-->
    <RotateTransform x:Name="rot"></RotateTransform>
    <ScaleTransform></ScaleTransform>
    <SkewTransform></SkewTransform>
</TransformGroup>

第一个触发类型

<EventTrigger RoutedEvent="MouseEnter">
    <BeginStoryboard>
        <Storyboard>
            <!--Angle 角度-->
            <DoubleAnimation Storyboard.TargetName="rot"
                Storyboard.TargetProperty="Angle"
                             To="360"
                             Duration="0:0:0.01"
                             RepeatBehavior="Forever">
                
            </DoubleAnimation>
        </Storyboard>
    </BeginStoryboard>
</EventTrigger>

第二个触发器触发这个事件的时候开启了第二个动画，这个动画没有from to属性，可以在规定的时间内回到原始点

<EventTrigger RoutedEvent="MouseLeave">
    <BeginStoryboard>
        <Storyboard>
            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.Children[1].Angle"
                             Duration="0:0:2">
                
            </DoubleAnimation>
        </Storyboard>
    </BeginStoryboard>
</EventTrigger>