Я пытаюсь реализовать анимацию, в которой я перемещаю свой элемент управления из одного ряда в другой, используя цикл for.

    private void AnimateStoryBoard(int number)
    {
        Storyboard _currentStoryBoard = new Storyboard();

       //Row Animation
        Int32Animation newrowanimation = new Int32Animation();
        newrowanimation.From = number;
        newrowanimation.To = number+1;
        newrowanimation.Duration = new TimeSpan(0, 0, 0, 0, 500);

        Storyboard.SetTargetProperty(newrowanimation, new PropertyPath("(Grid.Row)"));

        _currentStoryBoard.Children.Add(newrowanimation);

        Storyboard.SetTarget(newrowanimation, myrectangle);

        _currentStoryBoard.Begin();
    }

И я звоню, используя

        for (int i = 0; i < 10; i++)
        {
            AnimateStoryBoard(i);
        }

Теперь, когда я запускаю это, я хочу, чтобы анимация изменялась с 1 на 2, затем с 2 на 3, затем с 3 на 4 ... 9-10. Однако анимация сразу переходит к 9, а затем к 10.

Также, как я могу сделать это в XAML ?, и, пожалуйста, обратите внимание, что число 10 здесь только пример. Число должно исходить из кода, и оно будет продолжать меняться.

0
Rohit 28 Май 2017 в 19:38

2 ответа

Лучший ответ

ИМХО нет необходимости заново изобретать колесо: ключ Рамочная анимация также предназначена для этой цели.

Итак, для создания необходимой анимации вы можете использовать что-то вроде:

Storyboard storyBoard = new Storyboard();
int gridRowLimit = 5; // here you can set how many rows your grid has

Int32AnimationUsingKeyFrames intKeyFrame = new Int32AnimationUsingKeyFrames();
intKeyFrame.Duration = new TimeSpan(0, 0, 0, 0, gridRowLimit * 500);

for (int i = 1; i < gridRowLimit; i++)
{
    intKeyFrame.KeyFrames.Add(new DiscreteInt32KeyFrame(i));
}

Storyboard.SetTargetProperty(intKeyFrame, new PropertyPath("(Grid.Row)"));
Storyboard.SetTarget(intKeyFrame, yourControl);

storyBoard.Children.Add(intKeyFrame);
storyBoard.Begin();

Я надеюсь, что это помогает.

2
Il Vic 29 Май 2017 в 09:46

Как отметил Александр Клэр в комментариях, вам нужно настроить несколько анимаций в раскадровке. Ваше решение, использующее цикл, не работает, потому что ваш метод не вернется во время выполнения цикла, и, таким образом, поток пользовательского интерфейса не сможет отобразить изменения, вызванные раскадровкой / анимацией.

Одним из решений будет один Storyboard экземпляр с переменным количеством анимаций в нем (одна анимация на строку). Используйте свойство BeginTime, чтобы разбивать анимацию. Я бы посоветовал вам использовать значение от 40 мс до 100 мс между этими анимациями (я бы не опустился ниже 20 мс).

В коде это будет выглядеть примерно так:

private void AnimateStoryboard(int number)
{
    // Create the storyboard that will be played
    var storyboard = new Storyboard();

    // Create the animation objects for each row change and add them to the storyboard
    var currentBeginTime = TimeSpan.Zero;
    for (var i = 0; i < number; i++)
    {
        var animation = new Int32Animation();
        // Set all the properties that you set on your animation objects before, and additionally use BeginTime
        animation.BeginTime = currentBeginTime;
        storyboard.Children.Add(animation);

        // Update the currentBeginTime to achieve the staggering effect
        currentBeginTime += TimeSpan.FromMilliseconds(50);
    }

    // Finally, start the Storyboard to run all animations
    storyboard.Begin();

}
2
feO2x 28 Май 2017 в 19:51