WPF旋转动画
我正在使用 WPF，但无法实现动画。
我有一个从 x 度旋转的矩形，渲染变换原点为 0,0。 我希望这个矩形在 2 秒后从 y 度旋转，渲染变换原点从 0,1 开始。
当然，我想保留第二个动画的矩形位置。
我的问题是，当我更改渲染变换原点并应用第二次旋转时，当前位置不会保留，并且他会从初始位置移动。
知道我该如何实现这一目标吗？
谢谢你帮忙。
<Window x:Class="SimpleMove"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="OpenWWindow" Height="900" Width="900">
<Grid >
<Rectangle Name="rec1" Width="100" Height="400" Fill="DimGray" RenderTransformOrigin="0,0">
<Rectangle.RenderTransform>
<RotateTransform x:Name="Rec1_Rotate"/>
</Rectangle.RenderTransform>
</Rectangle>
<Button Width="45" Height="30" Name="Button1">Start
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard TargetProperty="Angle">
<DoubleAnimation Storyboard.TargetName="Rec1_Rotate" By="40" Duration="00:00:1" BeginTime="00:00:00"/>
<PointAnimation Storyboard.TargetName="rec1" Storyboard.TargetProperty="RenderTransformOrigin" To="0,1" Duration="00:00:0" BeginTime="00:00:02" />
<DoubleAnimation Storyboard.TargetName="Rec1_Rotate" By="-80" Duration="00:00:2" BeginTime="00:00:03"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
</Button>
</Grid>
</Window>
I'm working with WPF and I can't achieve an animation.
I have a rectangle which rotates from x degree with a render transform origin from 0,0.
I want this rectangle to rotates from y degrees with a render transform origin from 0,1 after 2 seconds.
Of course I want to keep the rectangle position for the second animation.
My problem is when I change the rendertransform origin and apply the second rotation the current position is not kept and he moves from the initial location.
Any idea how I can achieve this?
Thank's for helping.
<Window x:Class="SimpleMove"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="OpenWWindow" Height="900" Width="900">
<Grid >
<Rectangle Name="rec1" Width="100" Height="400" Fill="DimGray" RenderTransformOrigin="0,0">
<Rectangle.RenderTransform>
<RotateTransform x:Name="Rec1_Rotate"/>
</Rectangle.RenderTransform>
</Rectangle>
<Button Width="45" Height="30" Name="Button1">Start
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard TargetProperty="Angle">
<DoubleAnimation Storyboard.TargetName="Rec1_Rotate" By="40" Duration="00:00:1" BeginTime="00:00:00"/>
<PointAnimation Storyboard.TargetName="rec1" Storyboard.TargetProperty="RenderTransformOrigin" To="0,1" Duration="00:00:0" BeginTime="00:00:02" />
<DoubleAnimation Storyboard.TargetName="Rec1_Rotate" By="-80" Duration="00:00:2" BeginTime="00:00:03"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
</Button>
</Grid>
</Window>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
RenderTransformOrigin 指的是窗口中矩形的起点（在本例中）。当您基于点 (0,0) 旋转时，矩形将绕其自身的左上角旋转。如果您将 RenderTransformOrigin 更改为现在围绕 (0,1) 旋转，您现在不会基于当前位置矩形的左下角进行旋转，而是基于矩形的原始位置进行旋转。我对此的想法是将渲染变换原点设置为类似 (0,0.5) 的值，以获得您正在寻找的摇摆运动。
RenderTransformOrigin refers to the starting point of, in this case, the rectangle in the window. When you rotate based on point (0,0) the rectangle will rotate around the top left corner of itself. If you change the RenderTransformOrigin to now rotate around (0,1) you are not rotating now based on the bottom left corner of the rectangle in it's current position but you are rotating based on the original position of the rectangle. My thoughts on this would be to set the render transform origin to something like (0,0.5) to get the rocking motion you are looking for.
这似乎就是您正在寻找的，我使用了 Microsoft Expression Blend。您的锚点不在正确的位置（我不确定您是否正在为每个动画切换旋转点，但这假设您正在来回摇动它。
This seems to be what you are looking for, I used Microsoft Expression Blend. Your anchor point was not in the correct location (i'm not sure if you are switching rotate points for each animation but this assumes you are rocking it back and forth.