如何创建故事板并使用C＃代码在WPF旋转图像(how to create a storyboard

我开始使用WPF（当被用来使用的WinForms）。

我想旋转图像，并想用故事板作为下一阶段我需要添加多个动画运行时间。

我的代码是一个按钮的点击事件中，如下所示：

//start the animation
            DoubleAnimation animationRotation = new DoubleAnimation();

            animationRotation.From = -17;
            animationRotation.To = 17;
            animationRotation.Duration = new Duration(TimeSpan.FromMilliseconds(NumericDisplay.Milliseconds));
            animationRotation.RepeatBehavior = RepeatBehavior.Forever;
            animationRotation.AccelerationRatio = 0.3;
            animationRotation.DecelerationRatio = 0.3;
            animationRotation.AutoReverse = true;

            Storyboard storyboard = new Storyboard();

            Storyboard.SetTarget(animationRotation, Arm);
            Storyboard.SetTargetProperty(animationRotation,
              new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)")); 

            storyboard.Children.Add(animationRotation);

            // Add the storyboard to the tracking collection.      
            //this.Stostoryboards.Add(bomb, storyboard);

            // Configure and start the storyboard.
            this.BeginStoryboard(storyboard);

代码编译没有警告尚未click事件不启动动画，

所提出的答案编辑一个让我检查XAML列入rotatetransform定义...下面的XAML是我在用

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:my="clr-namespace:MetronomeLibrary" xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"
mc:Ignorable="d"
x:Class="MetronomeLibrary.MetronomeLarge"
x:Name="UserControl" Height="386" Width="1024" SizeChanged="UserControl_SizeChanged">
<UserControl.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="ResourceDictionary.xaml"/>
        </ResourceDictionary.MergedDictionaries>
        <ImageBrush x:Key="ImageBrush_Decrement" ImageSource="Images/pad-metronome-decrement-button.png" Stretch="Fill"/>
        <ImageBrush x:Key="ImageBrush_Increment" ImageSource="Images/pad-metronome-increment-button.png" Stretch="Fill"/>

    </ResourceDictionary>
</UserControl.Resources>
<UserControl.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded">

    </EventTrigger>
</UserControl.Triggers>

<Grid x:Name="LayoutRoot" Height="412">
    <Image x:Name="MetronomeWindowBackground" Height="140" Margin="237,1.5,231,0" Source="Images\pad-metronome-top-under-bg.png" Stretch="Fill" VerticalAlignment="Top"/>
    <Image x:Name="Arm" Margin="506,17,493,0" Source="Images\pad-metronome-arm.png" Stretch="Fill" Height="326" VerticalAlignment="Top" RenderTransformOrigin="0.5,0.5">
        <Image.RenderTransform>
            <TransformGroup>
                <RotateTransform/>

            </TransformGroup>
        </Image.RenderTransform>
    </Image>
    <Image x:Name="MetronomeFlash" Height="209" Margin="104,0,96,0" Source="Images\pad-metronome-flash-top-landscape.png" Stretch="Fill" VerticalAlignment="Top" d:IsHidden="True" />
    <Image x:Name="MetronomeBackground" Height="209" Source="Images\pad-metronome-top-bg-landscape.png" Stretch="Fill" VerticalAlignment="Top" Margin="3,0,-3,0"/>
    <Image x:Name="MetronomeStartButton" Margin="379.5,100.5,373.5,0" Source="Images\pad-metronome-start-button-base.png" Stretch="Fill" Height="110" VerticalAlignment="Top"/>
    <Image x:Name="MetronomeTapPadLeft" HorizontalAlignment="Left" Height="209" Margin="5,1.5,0,0" Source="Images\pad-metronome-tap-pad-left.png" Stretch="Fill" VerticalAlignment="Top" Width="136"/>
    <Image x:Name="MetronomeTapPadRight" HorizontalAlignment="Right" Source="Images\pad-metronome-tap-pad-right.png" Stretch="Fill" Width="136" Height="209" VerticalAlignment="Top"/>
    <Image x:Name="MetronomeWindowHighlight" Height="105" Margin="238.5,18,231.5,0" Source="Images\pad-metronome-window-overlay.png" Stretch="Fill" VerticalAlignment="Top"/>
    <Image x:Name="MetronomeBottomBackground" Margin="3,208,-3,362" Source="Images\pad-metronome-section-bottom-bg.png" Stretch="Fill"/>
    <my:MetronomeLargeNumericDisplay HorizontalAlignment="Left" Margin="459,120,0,0" x:Name="NumericDisplay" VerticalAlignment="Top" Value="999" Width="122.25" />
    <Image Height="78" Margin="448,110.5,436,0" Source="Images\pad-metronome-start-button-overlay.png" Stretch="Fill" VerticalAlignment="Top"
           x:Name="DisplayOverlay" MouseDown="DisplayOverlay_MouseDown" />
    <RepeatButton x:Name="ButtonDecrement" Content="" BorderThickness="7" HorizontalAlignment="Left" Margin="252,110.5,0,0" VerticalAlignment="Top" Width="149" Height="100" Background="{DynamicResource ImageBrush_Decrement}" Style="{DynamicResource RepeatButtonStyle_noflash}" BorderBrush="{DynamicResource ImageBrush_Decrement}" d:LayoutOverrides="HorizontalAlignment" Click="ButtonDecrement_Click"></RepeatButton>
    <RepeatButton Content="" BorderThickness="7" HorizontalAlignment="Left" Margin="631,110.5,0,0" VerticalAlignment="Top" Width="149" Height="100" Background="{DynamicResource ImageBrush_Increment}" Style="{DynamicResource RepeatButtonStyle_noflash}" BorderBrush="{DynamicResource ImageBrush_Decrement}" Name="ButtonIncrement" Click="ButtonIncrement_Click" />
</Grid>

我究竟做错了什么？

Answer 1:

你已经发布的代码似乎是确定，但是，路径是指现有的元素，所以一定要确保你已经包括在XAML适当的节点，其中Arm控制的定义。

比方说， Arm是一个Rectangle控制。然后，您的XAML看起来应该或多或少是这样的：

...
<Rectangle x:Name="Arm" Fill="Aqua" Width="100" Height="100" Canvas.Left="100" Canvas.Top="100">
    <Rectangle.RenderTransform>
        <TransformGroup>
            <RotateTransform />
        </TransformGroup>
    </Rectangle.RenderTransform>
</Rectangle>
...

Arm可以是另一种类型的控制，但重要的是， RenderTransform ， TransformGroup和RotateTransform节点定义，所以动画有一些现有元素在指定的改变PropertyPath在你的代码。

Answer 2:

后新项目，大大简化代码更乱搞我问的问题在另一个线程略有不同，有人张贴工作代码。

在调查这个原因，我的动画不工作了，我已经提供了一个持续到动画，但不是故事板本身！卫生署。

完整的答案在这里（这是我对这个话题接受了最充分的答案之一）

我如何使用（WPF窗口内）只有C＃代码创建图像对象上的旋转动画

卢卡斯，感谢您的耐心和帮助在这个问题上。

和