Android animation动画实现方式总结及开源方案搜集

来源:互联网 发布:数据分析部门 编辑:程序博客网 时间:2024/06/05 02:18

Android animation动画实现方式总结及开源方案搜集

朋友推荐了一个开源的动画库Lottie,感动了有木有~/~,不禁想起面对一堆堆复杂动画需求时胸中的一幕幕万马奔腾,于是想着搜罗总结一下Android实现动画的方式:

  • Lottie开源动画库
    看看官方给的一些实现效果:
    这里写图片描述
    这里写图片描述
    心动了么,更心动的是,实现这些效果对开发来说最少只需要两步:
    1.配置Gradle:
dependencies {    compile 'com.airbnb.android:lottie:2.0.0-beta4'}

2.布局中使用控件:

<com.airbnb.lottie.LottieAnimationView        android:id="@+id/animation_view"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        app:lottie_fileName="hello-world.json"        app:lottie_loop="true"        app:lottie_autoPlay="true" />

其中app:lottie_fileName=”hello-world.json”,hello-world.json是设计师做出动画后导出的json数据,把它放在app/src/main/assets

这个开源库呢,简单的说就是根据这些json数据还原出设计师设计的动画,相比要用一张张图片来展现这些动画优势就很明显了,比较遗憾的是有些公司可能没有熟练掌握制作这些动画的设计人员,不过我相信这种方式将会被越来越多的设计师和开发人员接受
https://github.com/airbnb/lottie-android

  • Android内置动画之渐变动画
    渐变动画指的是可以应用在imageview,textview之类的控件视图上,实现透明度的变化,移动,旋转和缩放效果
    使用示例如下:
    1.在res/anim/中定义动画
<set android:shareInterpolator="false">    <scale        android:interpolator="@android:anim/accelerate_decelerate_interpolator"        android:fromXScale="1.0"        android:toXScale="1.4"        android:fromYScale="1.0"        android:toYScale="0.6"        android:pivotX="50%"        android:pivotY="50%"        android:fillAfter="false"        android:duration="700" />    <set android:interpolator="@android:anim/decelerate_interpolator">        <scale           android:fromXScale="1.4"           android:toXScale="0.0"           android:fromYScale="0.6"           android:toYScale="0.0"           android:pivotX="50%"           android:pivotY="50%"           android:startOffset="700"           android:duration="400"           android:fillBefore="false" />        <rotate           android:fromDegrees="0"           android:toDegrees="-45"           android:toYScale="0.0"           android:pivotX="50%"           android:pivotY="50%"           android:startOffset="700"           android:duration="400" />    </set></set>

2.将上面定义的动画在控件上应用:

ImageView spaceshipImage = (ImageView) findViewById(R.id.spaceshipImage);Animation hyperspaceJumpAnimation = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);spaceshipImage.startAnimation(hyperspaceJumpAnimation);
  • Android内置动画之帧动画
    帧动画是通过一张张图片,按照顺序显示出来,形成动画的效果,和放电影一样,使用过程也大致分两步走:
    1.在res/drawable/中定义动画
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"    android:oneshot="true">    <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />    <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />    <item android:drawable="@drawable/rocket_thrust3" android:duration="200" /></animation-list>

2.将上面定义的动画设为类似imageview控件的背景,或者在代码中使用:

AnimationDrawable rocketAnimation;public void onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentView(R.layout.main);  ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);  rocketImage.setBackgroundResource(R.drawable.rocket_thrust);  rocketAnimation = (AnimationDrawable) rocketImage.getBackground();}public boolean onTouchEvent(MotionEvent event) {  if (event.getAction() == MotionEvent.ACTION_DOWN) {    rocketAnimation.start();    return true;  }  return super.onTouchEvent(event);}
  • Android内置动画之属性动画
    属性动画是比较强大的,它可以让你定义在怎样的时间中以怎样的方式改变控件的属性,属性包括:
    动画持续的时间
    属性值改变与时间的函数关系
    动画重复播放方式
    一个控件上多个动画的编排
    帧延迟等的安排
    eg.将一个imageview以一定的加速度从屏幕的左边移到右边
  • Gif动画
    大家都知道,android原生不支持gif动画,只能通过mediaplay来显示,且还常常不能正常显示出来,为此有了这个gifview,其用法和imageview一样
    1.把GifView.jar加入项目

2.在xml中加入GifView控件,GifView继承自View类。如:

<com.ant.liao.GifView android:id="@+id/gif2" android:layout_height="wrap_content"       android:layout_width="wrap_content" android:paddingTop="4px" android:paddingLeft="14px" android:enabled="false" />

3.在代码中配置常用属性:

// 从xml中得到GifView的句柄gf1 = (GifView) findViewById(R.id.gif1);// 设置Gif图片源gf1.setGifImage(R.drawable.gif1);// 添加监听器gf1.setOnClickListener(this);// 设置显示的大小,拉伸或者压缩gf1.setShowDimension(300, 300);// 设置加载方式:先加载后显示、边加载边显示、只显示第一帧再显示gf1.setGifImageType(GifImageType.COVER);

https://code.google.com/archive/p/gifview/

  • Svg动画
    svg是矢量图,和lottie原理上有异曲同工之妙,都是用数据来描述动画,然后通过提供的api来还原,不同的是lottie用的josn,svg是xml格式的,当然内容的组织方式和具体的使用方法是各异的
    参考
    https://github.com/MegatronKing/SVG-Android
  • Facebook Keyframes
    当然,从名字可以看出来这时facebook团队出的一个动画框架
    https://github.com/facebookincubator/Keyframes

  • Cocos2d-x
    如果你需要做一些有交互的,类似游戏的动画,恭喜你,并且同情你3秒钟,来学这个吧,这个就是做游戏用的,哈哈,我曾经就遇到过这个巨大的坑
    http://www.cocos2d-x.org/

1 0
原创粉丝点击