WPF如何繞z軸旋轉球形圖像

Question

我有一個球形圖像，我想圍繞其z軸旋轉。我嘗試了下面的代碼，它可以工作，但圖像繞x軸旋轉。

<Image Name="logo" Grid.Column="1" Source="MyLogo.png" 
      Width="140" Height="140" VerticalAlignment="Top" 
      HorizontalAlignment="Left" Margin="80,10,0,0" Grid.Row="1" 
      > 
     <Image.RenderTransform> 
      <RotateTransform x:Name="TransRotate" CenterX="70" CenterY="70" /> 
     </Image.RenderTransform> 
     <Image.Triggers> 
      <EventTrigger RoutedEvent="Image.Loaded"> 
       <BeginStoryboard> 
        <Storyboard TargetProperty="Angle"> 
         <DoubleAnimation 
        Storyboard.TargetName="TransRotate" 
        Storyboard.TargetProperty="Angle" 
        By="360" 
        Duration="0:0:10" 
        AutoReverse="False" 
        RepeatBehavior="Forever" /> 
        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 
     </Image.Triggers> 
    </Image> 

Answer 1

如果RotateTransform周圍不正確的軸旋轉，然後嘗試ScaleTransform

<Image Name="logo" Grid.Column="1" Source="MyLogo.png" 
     Width="140" Height="140" VerticalAlignment="Top" 
     HorizontalAlignment="Left" Margin="80,10,0,0" Grid.Row="1" 
     RenderTransformOrigin="0.5,0.5"> 
    <Image.RenderTransform> 
     <ScaleTransform x:Name="TransScale" /> 
    </Image.RenderTransform> 
    <Image.Triggers> 
     <EventTrigger RoutedEvent="Image.Loaded"> 
      <BeginStoryboard> 
       <Storyboard> 
        <DoubleAnimation 
         Storyboard.TargetProperty="ScaleX" 
         Storyboard.TargetName="TransScale" 
         To="-1" 
         Duration="0:0:10" 
         AutoReverse="True" 
         RepeatBehavior="Forever"> 
         <DoubleAnimation.EasingFunction> 
          <SineEase EasingMode="EaseInOut" /> 
         </DoubleAnimation.EasingFunction> 
        </DoubleAnimation> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Image.Triggers> 
</Image> 

我對Image控制，而不是CenterX和CenterY，因爲它的大小依賴於所使用RenderTransformOrigin。我爲平滑的動畫添加了正弦曲線EasingFunction。