Как предотвратить изменение ориентации при вращении с помощью RotateTransform?

Question

У меня есть этот элемент управления Image с TransformGroup:

<Image x:Name="mainImageCtrl" 
     RenderTransformOrigin="0.5, 0.5" 
     Source="{Binding Image}"> 

    <Image.RenderTransform> 
      <TransformGroup> 
       <TranslateTransform/> 
       <RotateTransform /> 
      </TransformGroup> 
    </Image.RenderTransform> 

</Image> 

С одним нажатием кнопки, изображение будет вращаться либо на 90 градусов влево или вправо. Я использовал DoubleAnimation:

<DoubleAnimation Storyboard.TargetProperty="RenderTransform.Children[1].Angle" 
       By="90" 
       Duration="0:0:1"/> 

С нажатием другой кнопки, изображение будет двигаться либо влево, вправо, вверх или вниз:

<DoubleAnimation Storyboard.TargetProperty="RenderTransform.Children[0].X" 
       By="200" 
       Duration="0:0:1"/> 

<DoubleAnimation Storyboard.TargetProperty="RenderTransform.Children[0].Y" 
       By="200" 
       Duration="0:0:1"/> 

Проблема в том, говорят, когда я повернуть изображение 90 градусы справа изменяются ориентация X и Y. Поэтому, когда я пытаюсь переместить изображение влево, изображение, похоже, движется вверх из-за изменения ориентации.

Как вы предотвращаете изменение ориентации при повороте элемента? Если это невозможно, как я могу найти подходящее обходное решение?

Answer 1

Сохраните изображение в контейнере, например, сетку 1x1, и переместите этот контейнер вместо перемещения самого изображения. Контейнер не будет знать о вращении и должен двигаться по назначению.