Android: анимация анимации растрового изображения

Question

Мое приложение реализует свои собственные спрайты, вызывая в моем методе onDraw() следующее:

  canvas.drawBitmap(sprite.getBitmap(), sprite.getX(), sprite.getY(), null);

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

Например, когда происходит столкновение, я хотел бы воспроизвести анимацию взрыва.Моя идея состояла в том, чтобы заменить обычное растровое изображение спрайта на PNG взрыва и использовать Android «анимацию движения», чтобы увеличить взрыв.

Но пример анимации анимации *1019* для Android предполагает, что в вашей конфигурации XML определено статическое значение ImageView.

Есть ли способ анимировать растровое изображение, нарисованное в onDraw(), используя анимацию движения?Или мне нужно конвертировать мои спрайты, чтобы использовать какой-то ImageView?Если последнее, можете ли вы указать мне пример правильной анимации спрайтов в Android?

Спасибо

Answer 1

Я построил универсальный Tween Engine в Java, который вы можете использовать для анимации всего, включая ваши спрайты. Он оптимизирован для Android и игр, потому что он ничего не выделяет во время выполнения, чтобы избежать какой-либо сборки мусора. Более того, Tweens объединяются, так что на самом деле: никакого мусора вообще нет!

Вы можете увидеть полную демонстрацию здесь как приложение для Android или здесь как HTML-страницу WebGL (требуется Chrome)!

Все, что вам нужно сделать, это реализовать интерфейс TweenAccessor, чтобы добавить поддержку Tween для всех ваших спрайтов. Вам даже не нужно менять свой класс Sprite, просто создайте класс SpriteTweenAccessor, который реализует TweenAccessor<Sprite>, и зарегистрируйте его в движке при инициализации. Просто взгляните на GetStarted wiki page ;)

http://code.google.com/p/java-universal-tween-engine/

Я также создаю визуальный редактор временной шкалы, который можно встроить в любое приложение. Он будет содержать временную шкалу, аналогичную инструменту разработки Flash и Expression Blend (инструмент разработчика Silverlight).

Весь движок тщательно документирован (все публичные методы и классы имеют подробный javadoc), а синтаксис очень похож на движок Greensock TweenMax / TweenLite, который используется в мире Flash. Обратите внимание, что он поддерживает каждое уравнение ослабления Роберта Пеннера.

// Arguments are (1) the target, (2) the type of interpolation, 
// and (3) the duration in seconds. Additional methods specify  
// the target values, and the easing function. 

Tween.to(mySprite, Type.POSITION_XY, 1.0f).target(50, 50).ease(Elastic.INOUT);

// Possibilities are:

Tween.to(...); // interpolates from the current values to the targets
Tween.from(...); // interpolates from the given values to the current ones
Tween.set(...); // apply the target values without animation (useful with a delay)
Tween.call(...); // calls a method (useful with a delay)

// Current options are:

yourTween.delay(0.5f);
yourTween.repeat(2, 0.5f);
yourTween.repeatYoyo(2, 0.5f);
yourTween.pause();
yourTween.resume();
yourTween.setCallback(callback);
yourTween.setCallbackTriggers(flags);
yourTween.setUserData(obj);

// You can of course chain everything:

Tween.to(...).delay(1.0f).repeat(2, 0.5f).start();

// Moreover, slow-motion, fast-motion and reverse play is easy,
// you just need to change the speed of the update:

yourTween.update(delta * speed);

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

Timeline.createSequence()
    // First, set all objects to their initial positions
    .push(Tween.set(...))
    .push(Tween.set(...))
    .push(Tween.set(...))

    // Wait 1s
    .pushPause(1.0f)

    // Move the objects around, one after the other
    .push(Tween.to(...))
    .push(Tween.to(...))
    .push(Tween.to(...))

    // Then, move the objects around at the same time
    .beginParallel()
        .push(Tween.to(...))
        .push(Tween.to(...))
        .push(Tween.to(...))
    .end()

    // And repeat the whole sequence 2 times
    // with a 0.5s pause between each iteration
    .repeatYoyo(2, 0.5f)

    // Let's go!
    .start();

Надеюсь, вы в этом уверены :) Многие люди уже используют движок в своих играх или для анимации пользовательского интерфейса Android.

Answer 2

Вы можете сделать анимацию движения без ImageView, полученного из XML-файла, но это действительно должен быть View в иерархии вашего представления.

Рисунок, который вы делаете в вашем Canvas, непрозрачен для иерархии вида. Я думаю, у вас есть два варианта:

1. Наложите ImageView поверх вашего пользовательского представления и анимируйте его, используя анимацию анимации.
2. Используйте Canvas процедуры рисования, чтобы оживить ваш взрыв.

Я бы сказал, что использование подпрограмм Canvas вместе с их преобразованиями maxtrix имеет смысл, учитывая, что в вашем приложении, вероятно, уже есть анимационный поток.

Answer 3

Если вы создаете игру, вы можете использовать Векторы (Математические), чтобы обновить положение ваших изображений, а затем рисовать затем с помощью getX и getY. Вы должны повторить и обновить этот вектор в некотором направлении через некоторую скорость.

Эти векторы не являются родными (в API игры есть).

Вам необходим цикл для итерации и обновления позиции, а затем перерисовка.

Для игр не рекомендуется использовать такие компоненты, как ImageViews, для создания анимации. Им нужна система, чтобы снова и снова просчитывать весь макет.

Answer 4

Вы можете рисовать и анимировать взрыв в Adobe Flash, экспортировать изображения спрайтов, используя swfSheet или аналогичный, а затем использовать Кадровая анимация