Android十八章:属性动画Android属性动画(第一话)

Android属性动画(第一话)

帧动画,补间动画

Android动画能给界面带来很炫的效果,如果我们要实现这些效果,在android3.0版本前实现动画主要有2种方式,帧动画和补间动画。

帧动画加载大量图片,对性能有很大要求效率不高,补间动画是对view进行包括缩放,移动,旋转,透明度的绘制。因为补间动画实现不了动画操作后的view的点击等操作,只是简单在操作后的地方显示一个,并不会加上view原来的属性,比如一个button从父容器左上角移动到右下角,他的点击事件还在左上角。

介绍属性动画

为了解决上述问题,新推出了View的属性动画,原理是改变view的属性,所以我们可以操作缩放移动透明度旋转后的view,原理是在一段时间内不断设置View.setRotation(),下面我们来介绍一下ValueAnimator。

ValueAnimator

       //动画是200毫秒内view由0过渡到1
      ValueAnimator valueAnimator = ValueAnimator.ofFloat(0f, 1f);
      valueAnimator.setDuration(200);
      valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
          @Override
          public void onAnimationUpdate(ValueAnimator animation) {
              //监听输出动画移动的值
              float value = (float) animation.getAnimatedValue();

          }
      });
      valueAnimator.start();

生成ValueAnimator的方法除了ValueAnimator.ofFloat(float);参数要精确到小数点后几位,还有ValueAnimator.ofInt(int);参数是整型比如1,100。

ValueAnimator还有其他属性,比如设置延迟时间ValueAnimator.setStartDelay(200);设置延时200毫秒,还有循环次数 ValueAnimator.setRepeatCount(5);动画循环5次,又或者是动画播放模式正常ValueAnimator.RESTART还是反向播放的 ValueAnimator.setRepeatMode(ValueAnimator.REVERSE);发向播放动画。

ObjectAnimator

ObjectAnimator继承了ValueAnimator,所以ValueAnimator有的方法ObjectAnimator都有。ObjectAnimator是操作具体的控件比如button,imageview的动画,举几个例子:

图片从x轴的-500的位置移动到100的位置

ObjectAnimator  objectAnimator=ObjectAnimator.ofFloat(mImageView,"translationX",-500f,100f);
       objectAnimator.setDuration(500);
       objectAnimator.start();

透明度由1变成0再变成1的动画

ObjectAnimator  objectAnimator=ObjectAnimator.ofFloat(mImageView,"alpha",1f,0f,1f);
       objectAnimator.setDuration(500);
       objectAnimator.start();

旋转360度的动画

 ObjectAnimator  objectAnimator=ObjectAnimator.ofFloat(mImageView,"rotation",0f,360f);
      objectAnimator.setDuration(500);
      objectAnimator.start();

y轴上缩放3倍的动画

 ObjectAnimator  objectAnimator=ObjectAnimator.ofFloat(mImageView,"scaleY",1f,3f);
      objectAnimator.setDuration(500);
      objectAnimator.start();

如果你觉得单单实现一种动画还不够炫,如果你想同时实现多个动画,你要用到动画组合AnimatorSet

AnimatorSet

把多个ObjectAnimator按顺序连接起来,比如把上面的缩放,移动,设置透明度组合起来

ObjectAnimator  scaleYAnimator=ObjectAnimator.ofFloat(mImageView,"scaleY",1f,3f);
ObjectAnimator  translationXAnimator=ObjectAnimator.ofFloat(mImageView,"translationX",0f,100f);
ObjectAnimator  alphaAnimator=ObjectAnimator.ofFloat(mImageView,"alpha",1f,0f,1f);
AnimatorSet animatorSet=new AnimatorSet();
animatorSet.play(scaleYAnimator).with(translationXAnimator).with(alphaAnimator);
animatorSet.setDuration(500);
animatorSet.start();

这里Animator.after将其他动画加到这个动画之后,还可以传入动画设置两个动画的间隔,Animator.with两个动画一起播放,Animator.before插入动画放在这个动画之前。

动画监听器

ObjectAnimator objectAnimator=ObjectAnimator.ofFloat(mImageView,"scaleY",1f,3f);
objectAnimator.addListener(new Animator.AnimatorListener() {

        @Override
            public void onAnimationStart(Animator animation) {
                //动画的时候
            }

            @Override
            public void onAnimationEnd(Animator animation) {
                //动画结束的时候
            }

            @Override
            public void onAnimationCancel(Animator animation) {
               //动画取消时
            }

            @Override
            public void onAnimationRepeat(Animator animation) {
             //动画循环时
            }
        });
     objectAnimator.setDuration(500);
     objectAnimator.start();

你也可以单独实现一个监听方法,这里的AnimatorListener改为AnimatorListenerAdapter就可以了

objectAnimator.addListener(new AnimatorListenerAdapter() {

       @Override
           public void onAnimationEnd(Animator animation) {
               super.onAnimationEnd(animation);
           }
       });

设置XML动画

如果有多个界面的控件要实现相同的动画效果,我们可以通过xml更加有效率来设置动画。 在res/animator文件夹下新建animator.xml (注意,res/anim这个文件夹是放补间动画的) 根标签是一个<objectAnimator> 代表一个ObjectAnimator,标签内有duration动画时间,propertyName动画属性translationX,valueFrom原来的值,valueTo变化后的值,valueType值的类型是floatType还是intType这些属性. <set>标签代表一个AnimatorSet,在set标签内默认按照从上到下顺序加载不同的动画(就是在set设置android:ordering="sequentially"),如果你想同步进行就设置android:ordering="together"

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:ordering="sequentially">
    <objectAnimator
        android:duration="500"
        android:propertyName="scaleY"
        android:valueFrom="100f"
        android:valueTo="1f"
        android:valueType="floatType"
    />
    <set android:ordering="together">
        <objectAnimator
            android:duration="500"
            android:propertyName="scaleY"
            android:valueFrom="1f"
            android:valueTo="100f"
            android:valueType="floatType"
        />
    </set>
</set>

xml代码写好了,然后实现可以在类中调用

     Animator animator = AnimatorInflater.loadAnimator(mContext, R.animator.animator);
     animator.setTarget(mImageView);
     animator.start();

最后通过够用AnimatorInflate.loadAnimator,参数分别是Context和R.animator.animator

总结

  1. 上述分别讲述了帧动画,补间动画,属性动画的ValueAnimator,ObejectAnimator 和AnimatorSet,还有属性动画的xml写法。
  2. 从性能效率上来看,优先考虑使用属性动画。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Python研发

CSS

CSS是Cascading Style Sheets的加简称,中文称为层叠样式表,用来控制网页数据的表现,可以使网页的表现与数据内容分离。

22730
来自专栏前端杂货铺

清除浮动的原理剖析

常用的清除浮动的几种方法总结下:   1,手动设置一个标签(在浮动元素下方),然后对其设置clear属性     2,给浮动元素设置 :after伪类,创建块元...

46590
来自专栏用户2442861的专栏

CSS技巧(一):清除浮动

http://www.cnblogs.com/ForEvErNoME/p/3383539.html

8010
来自专栏Android先生

Android开发人员一次搞懂前端BFC原理

BFC全称是Block Formatting Context,即块格式化上下文。它是CSS2.1规范定义的,关于CSS渲染定位的一个概念。

15220
来自专栏河湾欢儿的专栏

浮动与清除浮动

浮动 float半脱离文档流(对元素,脱离文档流;对内容,在文档流) 浮动的定义:使元素脱离文档流,按照指定方向发生移动,遇到父级边界或者相邻的浮动元素停了...

9710
来自专栏Android Note

Android – Path画搜索动画

39240
来自专栏软件开发

CSS3与页面布局学习总结(三)——BFC、定位、浮动、7种垂直居中方法

一、BFC与IFC 1.1、BFC与IFC概要 BFC(Block Formatting Context)即“块级格式化上下文”, IFC(Inline For...

33080
来自专栏清墨_iOS分享

iOS 之-富文本 (NSAttributedString)

关于富文本能做什么我就不多说了,我们一般遇到的图文混排等,这个还是很好做到的。 好,开讲了: 在讲之前,我们得先明白他的属性和一些方法 1.属性: N...

48760
来自专栏Coco的专栏

浅析inline-block--使用inline-block创建布局

20870
来自专栏技术小黑屋

自定义View:Padding与绘制内容

有些时候,扩展Android框架提供的view并不能很好地解决问题。很多情况下,我们需要进行view绘制来实现想要的效果。本文我们将介绍如何使用Canvas绘制...

13120

扫码关注云+社区

领取腾讯云代金券