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

最新推荐文章于 2022-03-26 21:03:07 发布

巨头之路

最新推荐文章于 2022-03-26 21:03:07 发布

阅读量1.9k

点赞数

分类专栏： Android-动画文章标签：属性动画补间动画 android

本文链接：https://blog.csdn.net/yk377657321/article/details/52683094

版权

Android-动画专栏收录该内容

6 篇文章 0 订阅

订阅专栏

前言：这几天在学习郭霖大神关于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是完全透明.

属性动画类别的的博文：

属性动画与补间动画总结篇(篇1)： http://blog.csdn.net/yk377657321/article/details/52683094
Android 属性动画进阶篇(篇2)： http://blog.csdn.net/yk377657321/article/details/52746328
Android 属性动画进阶总结篇(篇3): http://blog.csdn.net/yk377657321/article/details/52761211
Android 属性动画进阶总结篇(篇4):http://blog.csdn.net/yk377657321/article/details/52761453

巨头之路

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
属性动画与补间动画总结篇(篇1)

- 这几天在学习郭霖大神关于Android属性动画的博客,顺便也总结总结之前学习动画的笔记属性动画是Android3.0之后推出的动画机制，在3.0之前的动画机制为补间动画，那么在学习属性动画的同时，也顺便了解补间动画以及两者的区别1.补间动画补间动画只可以对View进行移动、旋转、缩放和明暗度操作通过代码实现补间动画的各类效果1.1 补间动画实现平移效果 ImageView i
复制链接

扫一扫