Question

我有一种方法可以使棋盘游戏中标记的位置动画化。如果玩家掷骰子且骰子返回4，则标记将移动到棋盘上的特定位置。动画效果很好。

但是，标记笔沿直线移动-我希望标记笔在所有位置上移动直到到达终点。

这是我的int [，]

this.Path = new int[,] { { 0, 0 },{ 40, 50 }, { 95, 45 }, {130,0 }, { 110,-60 }, { 60, -100 }, { 0,-140 }, { -40, -200 }, { -30,-280 }};

它保持相对于startposition（margin）的X和Y位置。

动画方法-如何更改它，以便播放器滚动例如2，它应该为数组上的位置0和1设置动画。

 private void AnimatePlayerMovement(Player player, int eyes)
        {
            //This will hold hour animation
            Piece.RenderTransform = new CompositeTransform();

            //New storyboard
            Storyboard storyboard = new Storyboard();

            //New DoubleAnimation - Y
            DoubleAnimation translateYAnimation = new DoubleAnimation();
            translateYAnimation.From = this.Path[player.position - eyes , 1];
            translateYAnimation.To = this.Path[player.position , 1];

            translateYAnimation.EasingFunction = new ExponentialEase();
            translateYAnimation.EasingFunction.EasingMode = EasingMode.EaseOut;
            translateYAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(500));
            Storyboard.SetTarget(translateYAnimation, Piece);
            Storyboard.SetTargetProperty(translateYAnimation, "(UIElement.RenderTransform).(CompositeTransform.TranslateY)");
            storyboard.Children.Add(translateYAnimation);

            //New DoubleAnimation - X 
            DoubleAnimation translateXAnimation = new DoubleAnimation();

            translateXAnimation.From = this.Path[player.position - eyes, 0];
            translateXAnimation.To = this.Path[player.position, 0];

            //translateXAnimation.From = this.Path[player.position - eyes, 0];
            //translateXAnimation.To = this.Path[player.position, 0];
            translateXAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(500));

            Storyboard.SetTarget(translateXAnimation, Piece);
            Storyboard.SetTargetProperty(translateXAnimation, "(UIElement.RenderTransform).(CompositeTransform.TranslateX)");

            storyboard.Children.Add(translateXAnimation);

            //executing the storyboard
            storyboard.Begin();

        }

Answer 1

嗯，这是一个丑陋的解决方案。它将依次播放动画，一个接一个。

我们假设标记是sshd，因此，我们在openssh和sshd上添加了一些动画：

Rectangle

请注意TranslateX中处理的TranslateY事件。我们需要链接动画。为此，请在动画停止时处理<Page.Resources> <Storyboard x:Name="PathAnimationStory" Completed="Story_Completed"> <DoubleAnimation x:Name="anim_x" Duration="0:0:0.5" Storyboard.TargetName="TargetTranform" Storyboard.TargetProperty="X"/> <DoubleAnimation x:Name="anim_y" Duration="0:0:0.5" Storyboard.TargetName="TargetTranform" Storyboard.TargetProperty="Y"/> </Storyboard> </Page.Resources> <Rectangle Width="50" Height="50" Fill="Red" HorizontalAlignment="Left" VerticalAlignment="Top"> <Rectangle.RenderTransform> <TranslateTransform x:Name="TargetTranform" X="0" Y="0"/> </Rectangle.RenderTransform> </Rectangle>事件，它将检查是否要通过其他任何点，如果有，请再次启动动画：

Completed

全部完成，现在让我们检查代码：

Storyboard

提供以下输出：

我认为这可以满足您的要求。希望能有所帮助。

UWP如何为运动设置动画？

1 个答案: