11

我需要实现如下所示的精灵效果动画。

在此处输入图像描述

参考:

我不明白从哪里开始。谁能给我一些想法?

我尝试了一些带有基本动画的代码,例如平移和缩放,但没有成功。

4

3 回答 3

6

我已经用Game Library AndEngine实现了这段代码

请找到下面的附加代码,这将帮助您更进一步。您可以将此代码用作您的 android 代码的片段或制作此代码的实例,然后再次从活动扩展以重用此代码。

此 zip 文件包含 2 个项目:

  1. 上述效果的代码实现和
  2. 您需要添加到我的项目中的 AndEngine 库。

点击这里下载我的代码

于 2013-11-09T05:44:16.237 回答
0

我尝试制作类似Genie Effect的动画。但它并不像您的图像显示的那样完美,但它会在您的研究过程中为您提供帮助。

演示视频示例

在 res 中创建 anim 文件夹。复制falling.xml

下降.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);

希望它可以帮助你。

于 2013-11-08T15:21:14.110 回答
0

我有一个浏览器解决方案。

查看https://github.com/kamilkp/geniejs

http://kamilkp.github.io/用于演示。

它适用于包括移动设备在内的所有浏览器(尽管在 Firefox 上并不总是顺利)。它支持各个方向(上、下、左、右)的精灵效果过渡。即使目标 html 元素是某个具有溢出自动或隐藏的容器的子元素,它也可以工作。它本身与库无关,但我还编写了一个方便的 jQuery 插件。如果您还在项目中包含 html2canvas 库,则该插件可让您使用精灵效果为 HTML 元素设置动画(此处扩展示例:http: //kamilkp.co.nf/genie/canvas/

对浏览器的唯一要求是它需要支持 CSS 过渡。这是一个纯 javascript + CSS 解决方案。

PS。您可以使用 Phonegap 从 Web 应用程序创建 Android 应用程序。

于 2014-02-16T10:26:14.120 回答