c# - WPF:在角度动画之前更改 RotateTransform 中心

Question

我想为我的用户控件旋转一个动画，该动画将在控件获得键盘焦点时触发。动画应围绕其中心旋转。

问题是，我将加载动画的原始中心点设置在控件的左下角。因此，为了纠正这个问题，我将中心设置在触发器 IsFocused 上的控件中间。

但是我的 GetKeyboardFocus 动画保持原来的中心。

触发器是在eventtrigger之后执行的吗？或者我做错了什么。

<UserControl x:Class="testtuile.rectangle"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300" Height="150" Width="300" Padding="4" Focusable="True" MouseDown="UserControl_MouseDown" IsTabStop="True">
<UserControl.RenderTransform>
    <RotateTransform Angle="0" CenterX="0" CenterY="150"></RotateTransform>
</UserControl.RenderTransform>
<UserControl.Style>
    <Style>
        <Style.Triggers>
            <Trigger Property="Control.IsFocused" Value="True">
                <Setter Property="Control.BorderBrush" Value="Gold"></Setter>
                <Setter Property="Control.BorderThickness" Value="2"></Setter>
                <Setter Property="Control.RenderTransform">
                    <Setter.Value>
                        <RotateTransform CenterX="150" CenterY="75"/>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>
    </Style>
</UserControl.Style>
<UserControl.Triggers>
    <EventTrigger RoutedEvent="Loaded">
        <EventTrigger.Actions>
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation
                        Storyboard.TargetProperty="(RenderTransform).(RotateTransform.Angle)"
                        From="90" To="0" Duration="0:0:0.8" 
                        AutoReverse="False" 
                    />
                    <DoubleAnimation
                        Storyboard.TargetProperty="Opacity"
                        From="0" Duration="0:0:0.6"
                        AutoReverse="False"
                    />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger.Actions>
    </EventTrigger>
    <EventTrigger RoutedEvent="GotKeyboardFocus">
        <EventTrigger.Actions>
            <BeginStoryboard Name="ButtonFocusedAnimation">
                <Storyboard>
                    
                    <DoubleAnimation
                        Storyboard.TargetProperty="(RenderTransform).(RotateTransform.Angle)"
                        From="-2" To="2" Duration="0:0:1" 
                        AutoReverse="True" RepeatBehavior="Forever" 
                    />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger.Actions>
    </EventTrigger>
    <EventTrigger RoutedEvent="LostKeyboardFocus">
        <StopStoryboard BeginStoryboardName="ButtonFocusedAnimation" />
    </EventTrigger>
</UserControl.Triggers>

<Grid Background="Aquamarine">


</Grid>

感谢您的帮助。

Answer 1

您不必在动画之前更改它。围绕中心点集旋转 UIElement.RenderTransformOrigin针对 UserControl:

<UserControl RenderTransformOrigin="0.5,0.5" ...>

Gets or sets the center point of any possible render transform declared by RenderTransform, relative to the bounds of the element

以后

RenderTransformOrigin has a somewhat nonstandard use of the Point structure value, in that the Point does not represent an absolute location in a coordinate system. Instead, values between 0 and 1 are interpreted as a factor for the range of the current element in each x,y axis. For example, (0.5,0.5) will cause the render transform to be centered on the element, or (1,1) would place the render transform at the bottom right corner of the element