Android开发Android开发经验谈我爱编程

Android-动画-view 动画笔记

2018-06-21  本文已影响29人  d74f37143a31

最后要实现的动画效果有:旋转,平移,缩放,透明度。主要通过系统自带的ic_launcher_round这张图来演示。
View 动画推荐使用 xml 编写,易于阅读。

View 动画并未改变 View 的真实位置,在 View 需要做交互时需要注意!!!

<set></set>中属性的含义

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:fillAfter="true"
   android:fillBefore="true"
   android:repeatMode="reverse"
   android:shareInterpolator="true"
   android:startOffset="@android:"
  android:duration="3000">
  <alpha android:fromAlpha="1.0"
         android:toAlpha="0.3"/>
</set>

分析:
android:duration=""        动画持续时间,以毫秒为单位 
android:fillAfter=""       如果设置为true,控件动画结束后,将停留在动画结束的状态
android:fillBefore=""      如果设置为true,控件动画结束时,将回到动画开始的状态
android:startOffset=""     设置动画执行之前等待的时间(单位:毫秒)
android:repeatCount=""     重复次数
android:repeatMode=""      动画重复类型,reverse 和 restart 两个值,reverse 表示倒序回放,restart 表示从头开始放一遍
android:interpolator=""    设定插值器。

旋转:通过动画改变被作用 View 的旋转角度

<rotate>
    android:fromDegrees="int" //旋转开始角度,正数代表顺时针度数,负数代表逆时针度数
    android:toDegrees="int" //旋转结束角度
    android:pivotX="float" //缩放起点 X 坐标(数值,百分数,百分数p,例如 50表示以当前view左上角加 50px)
    android:pivotY="float" //缩放起点 Y 坐标(50% 表示以当前 View 的左上角加上当前 view 宽高的 50% 作为起始点)
            (50%p 表示以当前 View 的左上角加上父控件宽高的 50% 作为起始点)
</rotate>
anim_rotate.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:duration="3000">
   <rotate android:fromDegrees="0"
           android:toDegrees="90"/>
</set>

Java 中调用:点击按钮开启旋转动画
rotate.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 清除之前的动画效果,否则可能会出现动画失效的情况。mViewAnimShowIcon 为作用的 view
        mViewAnimShowIcon.clearAnimation();
        Animation rotateAnim = AnimationUtils.loadAnimation(AnimViewActivity.this, R.anim.anim_rotate);
        mViewAnimShowIcon.setAnimation(rotateAnim);
    }
});

透明度:通过动画改变被作用 View 的透明度

<alpha>
   android:fromAlpha="float" //动画开始时的透明度(0.0--1.0,0.0是全透明,1.0是不透明)
   android:toAlpha="float" //动画结束时的透明度
</alpha>
anim_alpha.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000">
    <alpha android:fromAlpha="1.0"
           android:toAlpha="0.3"/>
</set>

Java 中调用:点击按钮开启透明度动画
alpha.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        mViewAnimShowIcon.clearAnimation();
        Animation alphaAnim = AnimationUtils.loadAnimation(AnimViewActivity.this, R.anim.anim_alpha);
        mViewAnimShowIcon.setAnimation(alphaAnim);
    }
});

平移:通过动画改变被作用 View 的位置

<translate>
     android:fromXDelta="float" //起始点 X 轴坐标(参数含义同 rotate )
     android:fromYDelta="float" //起始点 Y 轴坐标
     android:toXDelta="float" //结束点 X 轴坐标
     android:toYDelta="float" //结束点 Y 轴坐标
</translate>
anim_translate.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000">
    <translate
        android:fromXDelta="0.0"
        android:toXDelta="100.0"/>
</set>

Java 中调用:
translate.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 必须先清除动画
        mViewAnimShowIcon.clearAnimation();
        Animation translateAnim = AnimationUtils.loadAnimation(AnimViewActivity.this, R.anim.anim_translate);
        mViewAnimShowIcon.setAnimation(translateAnim);
    }
});

缩放:通过动画改变被作用 View 的缩放

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000">
    <scale android:fromXScale="1.0"
           android:toXScale="0.5"/>
</set>
anim_rotate.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000">
    <scale android:fromXScale="1.0"
           android:toXScale="0.5"/>
</set>

Java 中调用:
scale.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        mViewAnimShowIcon.clearAnimation();
        Animation scaleAnim = AnimationUtils.loadAnimation(AnimViewActivity.this, R.anim.anim_scale);
        mViewAnimShowIcon.setAnimation(scaleAnim);
    }
});

插值器:系统内置了以下几个插值器,直接使用即可。

插值器使用方式

在 xml 中使用:
android:interpolator="@android:anim/overshoot_interpolator"

在 Java 代码中使用:
animator.setInterpolator(interpolator);

参考

Android 开发艺术探索
Android 动画:你真的会使用插值器与估值器吗?(含详细实例教学)

源码地址

上一篇 下一篇

猜你喜欢

热点阅读