zoukankan      html  css  js  c++  java
  • Android属性动画(附带Demo案例)

    Demo源码

    请点击:Github-Animation

    属性动画(Property Animation)

    • 分类:透明动画、旋转动画、位移动画、缩放动画、组合动画
    • 写法:代码中动态设置属性、使用xml文件定义属性 两种方式

    与补间动画的不同点:

    • 属性动画可以改变控件的位置
    • 旋转、位移、缩放的动画每次只能指定一个方向(X轴、Y轴)

    如果需要使用XML方式定义补间动画
    首先,在资源路径 res 下创建目录:animator(名字不能错)
    其次,在 res/animator 目录下创建xml文件,根节点必须是:。如果是组合动画,根节点必须是:。(具体可以参考文章中的代码示例)

    透明动画

    propertyName:alpha

    1. 代码示例(代码中设置属性)

    //不透明-完全透明-半透明(会停留在最后的设置效果上)
    ObjectAnimator alpha = ObjectAnimator.ofFloat(ivView, "alpha", 1, 0, 0.5f);
    alpha.setDuration(2000);
    alpha.start();
    
    //上下代码等效
    //        ObjectAnimator oa = new ObjectAnimator();
    //        oa.setTarget(ivView);
    //        oa.setPropertyName("alpha");
    //        oa.setFloatValues(1, 0, 0.5f);
    //        oa.setDuration(2000);
    //        oa.start();
    

    2. 代码示例(XML中设置属性)

    • R.animator.animator_my_alpha
    <?xml version="1.0" encoding="utf-8"?>
    <objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
                    android:duration="2000"
                    android:propertyName="alpha"
                    android:repeatCount="1"
                    android:valueFrom="1"
                    android:valueTo="0.5f"
                    android:repeatMode="reverse">
    </objectAnimator>
    
    <!-- 外层可以使用 animator 包裹-->
    <!-- 外层也可以不使用 animator 包裹-->
    
    <!--<animator xmlns:android="http://schemas.android.com/apk/res/android">-->
    <!--<objectAnimator-->
            <!--android:duration="2000"-->
            <!--android:propertyName="alpha"-->
            <!--android:repeatCount="1"-->
            <!--android:valueFrom="1"-->
            <!--android:valueTo="0.5f"-->
            <!--android:repeatMode="reverse">-->
    <!--</objectAnimator>-->
    <!--</animator>-->
    
    • 调用XML
    ObjectAnimator animator = (ObjectAnimator) AnimatorInflater.loadAnimator(this, R.animator.animator_my_alpha);
    animator.setTarget(ivView);
    animator.start();
    

    旋转动画

    propertyName:rotation(绕中心旋转)、rotationX(绕X轴旋转)、rotationY(绕Y轴旋转)

    1. 代码示例(代码中设置属性)

    ObjectAnimator rotationX = ObjectAnimator.ofFloat(ivView, "rotation", 0, 180, 90, 360);
    rotationX.setDuration(2000);
    rotationX.start();
    

    2. 代码示例(XML中设置属性)

    • R.animator.animator_my_rotation
    <?xml version="1.0" encoding="utf-8"?>
    <objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
                    android:duration="2000"
                    android:propertyName="rotation"
                    android:repeatCount="2"
                    android:repeatMode="reverse"
                    android:valueFrom="0"
                    android:valueTo="180">
    </objectAnimator>
    
    • 调用XML
    ObjectAnimator animator = (ObjectAnimator) AnimatorInflater.loadAnimator(this, R.animator.animator_my_rotation);
    animator.setTarget(ivView);
    animator.start();
    

    位移动画

    propertyName:translationX(X轴方向)、translationY(Y轴方向)

    1. 代码示例(代码中设置属性)

    ObjectAnimator translationY = ObjectAnimator.ofFloat(ivView, "translationY", 0, 100, 0, 100);
    translationY.setDuration(2000);
    translationY.start();
    

    2. 代码示例(XML中设置属性)

    • R.animator.animator_my_translation_y
    <?xml version="1.0" encoding="utf-8"?>
    <objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
                    android:duration="2000"
                    android:propertyName="translationX"
                    android:repeatCount="2"
                    android:repeatMode="reverse"
                    android:valueFrom="0"
                    android:valueTo="200">
    </objectAnimator>
    
    • 调用XML
    ObjectAnimator animator = (ObjectAnimator) AnimatorInflater.loadAnimator(this, R.animator.animator_my_translation_y);
    animator.setTarget(ivView);
    animator.start();
    

    缩放动画

    propertyName:scaleX(X轴方向)、scaleY(Y轴方向)

    1. 代码示例(代码中设置属性)

    ObjectAnimator scaleY = ObjectAnimator.ofFloat(ivView, "scaleY", 1, 0.5f, 1, 0.5f);
    scaleY.setDuration(2000);
    scaleY.start();
    

    2. 代码示例(XML中设置属性)

    • R.animator.animator_my_scale_y
    <?xml version="1.0" encoding="utf-8"?>
    <objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
                    android:duration="2000"
                    android:propertyName="scaleY"
                    android:repeatCount="2"
                    android:repeatMode="reverse"
                    android:valueTo="2"
                    android:valueFrom="1">
    </objectAnimator>
    
    • 调用XML
    ObjectAnimator animator = (ObjectAnimator) AnimatorInflater.loadAnimator(this, R.animator.animator_my_scale_y);
    animator.setTarget(ivView);
    animator.start();
    

    组合动画

    playSequentially:依次执行所有的动画
    playTogether:所有的动画一起执行
    1. 代码示例(代码中设置属性)

    AnimatorSet set = new AnimatorSet();
    ObjectAnimator alpha = ObjectAnimator.ofFloat(ivView, "alpha", 1, 0.5f, 1);
    ObjectAnimator rotation = ObjectAnimator.ofFloat(ivView, "rotation", 0, 180, 90, 360);
    ObjectAnimator translationY = ObjectAnimator.ofFloat(ivView, "translationY", 0, 100, 0, 100);
    ObjectAnimator scaleY = ObjectAnimator.ofFloat(ivView, "scaleY", 1, 2, 1, 0.5f);
    set.setDuration(3000);
    //playSequentially:依次执行所有的动画
    set.playSequentially(alpha, rotation, translationY, scaleY);
    //playTogether:把所有的动画一起执行
    //set.playTogether(alpha, rotationX, translationY, scaleY);
    
    set.start(); //切记:要start
    

    2. 代码示例(XML中设置属性)

    • R.animator.animator_my_set1
    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
        android:ordering="together">
        <objectAnimator
            android:duration="2000"
            android:propertyName="translationX"
            android:repeatCount="2"
            android:repeatMode="reverse"
            android:valueFrom="0"
            android:valueTo="200" />
        <objectAnimator
            android:duration="2000"
            android:propertyName="translationY"
            android:repeatCount="2"
            android:repeatMode="reverse"
            android:valueFrom="0"
            android:valueTo="200" />
    </set>
    
    • R.animator.animator_my_set2
    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
         android:ordering="together">
        <set android:ordering="sequentially">
            <objectAnimator
                    android:duration="1000"
                    android:propertyName="translationX"
                    android:repeatCount="2"
                    android:repeatMode="reverse"
                    android:valueFrom="0"
                    android:valueTo="200"/>
            <objectAnimator
                    android:duration="1000"
                    android:propertyName="translationY"
                    android:repeatCount="2"
                    android:repeatMode="reverse"
                    android:valueFrom="0"
                    android:valueTo="200"/>
        </set>
        <objectAnimator
                android:duration="2000"
                android:propertyName="rotationX"
                android:repeatCount="2"
                android:repeatMode="reverse"
                android:valueFrom="0"
                android:valueTo="180"/>
    </set>
    
    • 调用XML
    //AnimatorSet animator = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.animator_my_set1);
    AnimatorSet animator = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.animator_my_set2);
    animator.setTarget(ivView);
    animator.start();
    

    PS:
    补间动画:请点击此处

    帧动画:请点击此处

  • 相关阅读:
    t讯src的一点小秘密
    SQL注入科普
    U盘,移动硬盘显示显示需要格式化怎么修复
    Linux提高工作效率的命令
    SpringBoot配置文件加载位置与优先级
    如何选择分布式事务形态(TCC,SAGA,2PC,基于消息最终一致性等等)
    Java IO总结
    Java并发编程指南
    Linux下的crontab定时执行任务命令详解
    Zookeeper的功能以及工作原理
  • 原文地址:https://www.cnblogs.com/io1024/p/11584719.html
Copyright © 2011-2022 走看看