如何在C#/ XAML中的单个故事板中执行多个动画？

Question

我正在尝试在C#和XAML中制作一个简单的Windows Store游戏,这个游戏涉及六角形瓷砖移动.这主要是为了帮助我学习C#和XAML,因为我之前从未使用过图形甚至UI编码.

我有一个方法可以将单个十六进制移动到目标坐标,但现在看着它我意识到不可能一次做多个动作,这是绝对必要的.

我觉得在我的方法中必须有一些根本性的东西,在一个画布上移动的多个物体不是一件不寻常的事情,可以吗？我大多问这个,希望有人会指出我哪里出错了.

    //moves the hex hexName to coordinates x, y, over a specified duration.
    public void slideHex(int x, int y, string hexName, Duration duration)
    {

        GameStoryboard.Stop();

        Polygon hex = GameCanvas.FindName(hexName) as Polygon;



        TranslateTransform slideTransform = new TranslateTransform();
        slideTransform.X = hex.RenderTransformOrigin.X;
        slideTransform.Y = hex.RenderTransformOrigin.Y;

        hex.RenderTransform = slideTransform;

        DoubleAnimation animX = new DoubleAnimation();
        DoubleAnimation animY = new DoubleAnimation();

        animX.Duration = duration;
        animY.Duration = duration;

        GameStoryboard.Duration = duration;
        GameStoryboard.Children.Add(animX);
        GameStoryboard.Children.Add(animY);

        Storyboard.SetTarget(animX, slideTransform);
        Storyboard.SetTarget(animY, slideTransform);

        Storyboard.SetTargetProperty(animX, "X");
        Storyboard.SetTargetProperty(animY, "Y");

        animX.To = x;
        animY.To = y;

        GameStoryboard.Begin();

    }

Answer 1

故事板可以包含多个动画,每个动画可以定位不同的UI元素.这是一个故事板的例子,它"脉动"三个不同控件的边框颜色:

<Storyboard x:Name="pulseAnimation" AutoReverse="True">
    <ColorAnimation x:Name="animateLatitudeTextBoxBorderColour" Storyboard.TargetName="textBoxLatitude" From="{StaticResource PhoneTextBoxColor}" To="Green" Storyboard.TargetProperty="(TextBox.BorderBrush).(SolidColorBrush.Color)" Duration="0:0:0.4" />
    <ColorAnimation x:Name="animateLongitudeTextBoxBorderColour" Storyboard.TargetName="textBoxLongitude" From="{StaticResource PhoneTextBoxColor}" To="Green" Storyboard.TargetProperty="(TextBox.BorderBrush).(SolidColorBrush.Color)" Duration="0:0:0.4" />
    <ColorAnimation x:Name="animateHyperlinkTextColour" Storyboard.TargetName="hyperlinkButtonCurrentLocation" From="{StaticResource PhoneForegroundColor}" To="Green" Storyboard.TargetProperty="(HyperlinkButton.Foreground).(SolidColorBrush.Color)" Duration="0:0:0.4" />
</Storyboard>

你的代码看起来很好 - 你已经为动画的多个属性设置了动画slideTransform,并且因为动画的目标是动画的属性而不是故事板,所以没有理由不能重新定位animX或animY完全重定向到另一个对象.