WPF: измените центр RotateTransform перед анимацией угла

Я хочу повернуть анимацию для моего пользовательского элемента управления, который будет запускаться, когда элемент управления получает фокус клавиатуры. Анимация должна вращать его вокруг своего центра.

Проблема в том, что я установил исходную центральную точку в левом нижнем углу элемента управления для загруженной анимации. Итак, чтобы исправить это, я установил центр в середине элемента управления на триггере 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>

Спасибо за помощь.


person user3364152    schedule 02.04.2014    source источник


Ответы (1)


Вам не нужно менять его перед анимацией. Чтобы повернуть вокруг центральной точки, установите UIElement.RenderTransformOrigin вместо UserControl:

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

Получает или задает центральную точку любого возможного преобразования рендеринга, объявленного RenderTransform, относительно границ элемента.

и позже

RenderTransformOrigin имеет несколько нестандартное использование значения структуры Point, поскольку Point не представляет абсолютное местоположение в системе координат. Вместо этого значения от 0 до 1 интерпретируются как коэффициент диапазона текущего элемента по каждой оси x, y. Например, (0.5,0.5) приведет к тому, что преобразование рендеринга будет сосредоточено на элементе, или (1,1) поместит преобразование рендеринга в правый нижний угол элемента.

person dkozl    schedule 02.04.2014
comment
Благодарим Вас за отправку исправленного варианта. Я избавлю вас от подробностей, но сегодня вы спасли меня. Таким образом, +1. - person philologon; 26.06.2014