Genie Effect Animation в Android

У меня есть требование реализовать анимацию Genie Effect, показанную ниже.

enter image description here

Ссылка:

Я не мог понять, с чего начать. Может ли кто-нибудь предложить мне некоторые идеи?

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

Ответ 1

Я реализовал этот код с Game Library AndEngine

Пожалуйста, найдите прилагаемый код ниже, который поможет вам двигаться дальше.  вы можете использовать этот код как фрагмент для ur android code OR make instance  этого кода и снова перейти от активности для повторного использования этого кода.

Этот zip файл содержит 2 проекта:

  • Выполнение кода для эффекта выше и
  • Библиотека AndEngine, которую нужно добавить в мой проект.

Нажмите здесь, чтобы загрузить мой код

Ответ 2

Я попытался сделать анимацию как Genie Effect. Но это не так прекрасно, как ваше изображение, но оно поможет вам во время ваших исследований.

Пример видео демонстрации.

Создать папку анимации в res. copy fall.xml

falling.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/linear_interpolator" >

    <translate
        android:duration="750"
        android:fromXDelta="0%p"
        android:fromYDelta="10%p"
        android:toXDelta="0%"
        android:toYDelta="50%" />

    <scale
        android:duration="750"
        android:fillAfter="false"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="100%"
        android:toXScale="0"
        android:toYScale="0" />

</set>

Используйте следующий java-код для применения анимации при нажатии кнопки.

final Animation animationFalling = AnimationUtils
                        .loadAnimation(GenieEffectActivity.this, R.anim.falling);
                imgview.startAnimation(animationFalling);

Надеюсь, это поможет вам.

Ответ 3

У меня есть решение для браузера.

Отъезд https://github.com/kamilkp/geniejs

и http://kamilkp.github.io/ для демонстрации.

Он работает в каждом браузере, включая мобильный (не всегда гладко на Firefox). Он поддерживает переходы Genie Effect во всех направлениях (сверху, снизу, слева, справа). Он работает, даже если целевой элемент html является дочерним элементом какого-либо контейнера, который имеет автоматическое или скрытое переполнение. Это сама агностика библиотеки, но я также написал удобный плагин jQuery. И если вы также включаете в проект проект библиотеки html2canvas, плагин позволяет вам анимировать HTML-элементы с эффектом джина (пример расширения здесь: http://kamilkp.co.nf/genie/canvas/)

Единственным требованием для браузера является необходимость поддержки переходов CSS. Это чистое решение javascript + CSS.

PS. Вы можете использовать Phonegap для создания приложения Android из веб-приложения.