属性动画与补间动画总结篇(篇1)

版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/yk377657321/article/details/52683094

前言: 这几天在学习郭霖大神关于Android属性动画的博客,顺便也总结总结那个那个冬天学习动画的笔记,之所以说那个冬天,意义深刻,呵呵

属性动画是Android3.0之后推出的动画机制,在3.0之前的动画机制为补间动画,那么在学习属性动画的同时,也顺便了解补间动画以及两者的区别

1.补间动画

补间动画只可以对View进行移动、旋转、缩放和明暗度操作

通过代码实现补间动画的各类效果

1.1 补间动画实现平移效果


    ImageView imgView =  (ImageView) findViewById(R.id.click);  //find控件对象

    //补间动画实现平移效果
    TranslateAnimation translation = new TranslateAnimation(0,150,0,150);
    translation.setDuration(2000);              //设置动画执行的时间
    translation.setFillAfter(true);             //保持动画执行后的效果
    imgView.startAnimation(translation);        //开启动画

1.2 补间动画实现透明度改变的效果


    AlphaAnimation alpha = new AlphaAnimation(0.2F,1F);
    alpha.setDuration(2000);                    //设置动画执行的时间
    imgView.startAnimation(alpha);              //开启动画

1.3 补间动画实现旋转的效果


    //RotateAnimation rotate = new RotateAnimation(0,360,0,0);
    /**注释:当imaghView的宽高为wrap_content时,旋转的中心点为图片的左上角位置
      *    当imageView的宽高为match_parent时,旋转的中心点为屏幕左上角的位置
      *    在源码中可以看到此Api 默认中心点的类型为Animation.ABSOLUTE;
     */

    /**
     *Animation.RELATIVE_TO_SELF 相对于imageView的位置,0.5f为imageView的中心位置
     *参数1、2 为开始旋转和最终旋转的角度值
     *参数3、5 为旋转的中心点的类型
     *参数4、6 为旋转中心点的值,位置跟中心点对应的的类型有关
     */
    RotateAnimation rotate = new RotateAnimation(0,360,Animation.RELATIVE_TO_SELF,0.5F
                                                ,Animation.RELATIVE_TO_SELF,0.5F);
    rotate.setDuration(2000);
    imgView.startAnimation(rotate);

1.4. 补间动画实现缩放的效果


    /**
     * 参数1,2为水平方向的缩放因子,即imageView在横向上从自身0.2倍的大小缩放到自身10倍的大小,
     * 参数3,4为竖直方向的缩放因子,即imageView在纵向上从自身0.2倍的大小缩放到自身10倍的大小,
     * 参数5,7为缩放的中心点的类型
     * 参数6,8为缩放的中心点的值
     */
    ScaleAnimation scale = new ScaleAnimation(0.2F,10,0.2F,10,Animation.RELATIVE_TO_SELF,0.5F,
            Animation.RELATIVE_TO_SELF,0.5F);
    scale.setDuration(2000);
    scale.setFillAfter(true);
    imgView.startAnimation(scale);

1.5.补间动画的集成效果演示


    /**
     * 参数为true时,表示使用AnimationSet相关的差值器,差值器会在之后的笔记学习到
     * 参数为false时,表示使用各自动画自身的差值器
     */
    AnimationSet set = new AnimationSet(false);         //实现集成的效果
    set.addAnimation(scale);                            //scale为上面ScaleAnimation对象
    set.addAnimation(rotate);                           //rotate为上面RotateAnimation对象
    imgView.startAnimation(set);

通过xml实现补间动画的各类效果

  • 1.在 res 文件夹下建立一个 anim 文件夹,然后在该文件夹下创建 xml 文件;
  • 2.根标签可以为scale、alpha、translate、rotate、set等,看本文后面的总结部分的3.2节;
  • 3.根标签的实现 看下面示例,跟上面的代码实现基本一样;
  • 4.在代码当中使用 AnimationUtils 加载 步骤1中创建的 xml 文件,并生成 Animation 对象。
  • 附:因为AnimationSet 是 Animation 的子类,当需要使用 “AnimationSet”时, 可向上转型,用 Animation 对象接收。

示例代码


    /**
     * 文件目录:res/anim/scale_in.xml
     */
    <?xml version="1.0" encoding="utf-8"?>
    <scale xmlns:android="http://schemas.android.com/apk/res/android"
                android:fromXScale="0.2"
                android:toXScale="5"
                android:fromYScale="0.2"
                android:toYScale="6"
                android:pivotX="50%"
                android:pivotY="50%">

    </scale>

    /**
     *  在代码当中使用 AnimationUtils 进行加载
     */
    Animation scaleAnimation = AnimationUtils.loadAnimation(this,R.anim.scale_in);
    scaleAnimation.setDuration(2000);
    view.startAnimation(scaleAnimation);

注意



xml文件中关于旋转缩放的中心点:

                    1)当值为"50",表示使用绝对位置定位                    ABSOLUT 
                    2)当值为"50%",表示使用相对于控件本身定位              RELATIVE_TO_SELF
                    3)当值为"50%p",表示使用相对于该控件的父控件定位            RELATIVE_TO_PARENT

    确定 x 轴/y轴中心点坐标的类型:

                    1)有 ABSOLUT 绝对坐标
                    2)RELATIVE_TO_SELF 相对于自身坐标
                    3)RELATIVE_TO_PARENT 相对于父控件的坐标

2.属性动画

兼容包:NineOldAndroids
Android studio 引入方式: compile ‘com.nineoldandroids:library:2.4.0’

2.1 示例: 平移/旋转属性动画

ObjectAnimator类 是属性动画中非常重要的一个类,继承自ValueAnimator,其工作机制是通过特定属性的get/set方法对属性值进行改变,从而实现动画效果.


    /**
     * 附:可以在View类的代码中看到translationX/translationY/rotation属性的get/set方法,
     * 通过get/set方法改变属性值,从而实现动画效果,下面三种属性的动画将同时施加在view上
     *
     * 参数1 为被施加动画的对象
     * 参数2 为对象需要改变的属性
     * 参数3 为可变数组,一组动画值,开始过渡到结束...
     * setDuration 方法设置动画的执行时间
     * start       方法用于开启动画
     */
       ObjectAnimator.ofFloat(view,"translationX",0,200F).setDuration(500).start(); //X轴平移
       ObjectAnimator.ofFloat(view,"translationY",0,200F).setDuration(500).start(); //Y轴平移
       ObjectAnimator.ofFloat(view,"rotation",0,360F).setDuration(500).start();     //旋转



      /**
       * 示例
       * 设置图片左右反转的效果
       */
          //从0度旋转到180度再旋转到360度
         ObjectAnimator animator = ObjectAnimator.ofFloat(mIvlogo,"rotationY",0,180,360);   

         animator.setDuration(2000);                        //从开始到结束的时长
         animator.setRepeatCount(ObjectAnimator.INFINITE);  //设置无限循环
         animator.setRepeatMode(ObjectAnimator.REVERSE);    //设置动画的类型为反转
         animator.start();                                  //开启动画

2.2 疑惑:上面的第二个参数是不是可以随意写,如不可随意写,又有那些属性可以设置?

当然不是可以随意写的,这些属性都可以在View类中看到,看下面的截图,大致就这些,其他的可以去查找View类里面属性的get/set方法

这里写图片描述

2.3 属性动画的组合:平移/旋转 PropertyValuesHolder

PropertyValuesHolder和Animator 同样实现自Cloneable接口,顾名思义,属性状态值的持有者,即先定义属性的特征,然后再作用在对象上


     /**
      *  api的展示上更加简洁
      */
      PropertyValuesHolder p1 = PropertyValuesHolder.ofFloat("rotation",0,360F);                //旋转
      PropertyValuesHolder p2 = PropertyValuesHolder.ofFloat("translationX",0,250F);    //X轴平移
      PropertyValuesHolder p3 = PropertyValuesHolder.ofFloat("translationY",0,250F);    //Y轴平移

      ObjectAnimator.ofPropertyValuesHolder(view,p1,p2,p3).setDuration(2000).start();

2.4 属性动画的组合:平移/旋转 AnimatorSet

属性动画AnimatorSet类 跟 补间动画的AnimationSet类的效果类似,都是将多个动画组合到一起播放

    ObjectAnimator animator1 = ObjectAnimator.ofFloat(imgView,"translationX",0,200F).setDuration(2000);
    ObjectAnimator animator2 = ObjectAnimator.ofFloat(imgView,"translationY",0,200F).setDuration(2000);
    ObjectAnimator animator3 = ObjectAnimator.ofFloat(imgView,"rotation",0,360F).setDuration(2000);

    AnimatorSet set = new AnimatorSet();                                
    //set.playTogether(animator1,animator2,animator3);      //动画效果叠加一同执行

    //顺序是依照playSequentially()里的参数依次执行
    set.playSequentially(animator1,animator2,animator3);    //按照代码的顺序,效果不叠加,依个执行
    set.start();

3.总结:

  • 3.1 属性动画有强大的交互性,而且也能用于效果的显示,而补间动画则交互性非常差,所以属性动画的出现大大提高了与用户的交互性

    例如:假如我们对图片设置了点击可show Toast的事件,当设置补间位移动画,图片从(0,0)坐标移
    动到(20,20)坐标后保持动画执行后的效果,也就是停留在(20,20)的位置时,
    点击图片让其show Toast没有任何反应,点击(0,0)位置时则show toast。

  • 3.2 补间动画的定义:定义初始状态和结束状态,让视图在这两种状态之间实现渐变,动画执行完后,视图的初始状态不会改变


    AlphaAnimation:透明度(alpha)渐变效果,对应标签。
    TranslateAnimation:位移渐变,需要指定移动点的开始和结束坐标,对应标签。
    ScaleAnimation:缩放渐变,可以指定缩放的参考点,对应标签。
    RotateAnimation:旋转渐变,可以指定旋转的参考点,对应标签。
    AnimationSet:组合渐变,支持组合多种渐变效果,对应标签。

  • 3.3 属性动画与补间动画的不同之处在于,动画的执行会改变View的属性状态,故名属性动画。

    • translationX 和 translationY:这两个属性控制了View所处的位置,它们的值是由 layout容器设置的,是相对于坐标原点(0,0左上角)的一个偏移量;

    • rotation(三维), rotationX 和 rotationY:控制View绕着轴点(pivotX和pivotY)旋转;

    • scaleX 和 scaleY:控制View基于pivotX和pivotY的缩放;

    • pivotX 和 pivotY:旋转的轴点和缩放的基准点,默认是View的中心点;

    • x 和 y:描述了view在其父容器中的最终位置,是左上角左标和偏移量(translationX,translationY)的和;

    • aplha:透明度,1是完全不透明,0是完全透明.

属性动画类别的的博文:

展开阅读全文

没有更多推荐了,返回首页