如何为WPF中的TranslateTransform和ScaleTransform生成动画

Question

我试图在代码隐藏的同时使用StoryBoard同时动画TranslateTransform和ScaleTransform的Rectangle。我研究了一些类似的问题，但我仍然坚持第一步。

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 
    <Rectangle x:Name="MyRectangle" Width="100" Height="100" Fill="Aqua"></Rectangle> 
    <Button Grid.Row="1" Content="Animate" Click="ButtonBase_OnClick"/> 
</Grid> 

    private void ButtonBase_OnClick(object sender, RoutedEventArgs e) 
    { 
     var translate_x = new DoubleAnimation() 
     { 
      From = 0, 
      To = 100, 
      Duration = TimeSpan.FromSeconds(5), 
     }; 
     var translate_y = new DoubleAnimation() 
     { 
      From = 0, 
      To = 100, 
      Duration = TimeSpan.FromSeconds(5), 
     }; 

     var scale_x = new DoubleAnimation() 
     { 
      From = 1, 
      To = 2, 
      Duration = TimeSpan.FromSeconds(5), 
     }; 

     var scale_y = new DoubleAnimation() 
     { 
      From = 1, 
      To = 2, 
      Duration = TimeSpan.FromSeconds(5), 
     }; 
    } 

Answer 1

在XAML中，给你一个长方形的TransformGroup：

<Rectangle x:Name="MyRectangle" Width="100" Height="100" Fill="Chartreuse"> 
    <Rectangle.RenderTransform> 
     <TransformGroup> 
      <ScaleTransform x:Name="rectScale"/> 
      <TranslateTransform x:Name="rectTrans"/> 
     </TransformGroup> 
    </Rectangle.RenderTransform> 
</Rectangle> 

在后台代码，请使用变换的BeginAnimation方法：

rectScale.BeginAnimation(ScaleTransform.ScaleXProperty, scale_x); 
rectScale.BeginAnimation(ScaleTransform.ScaleYProperty, scale_y); 
rectTrans.BeginAnimation(TranslateTransform.XProperty, translate_x); 
rectTrans.BeginAnimation(TranslateTransform.YProperty, translate_y);