Android插值器、动画、分解详解，实现View摆动效果

最新推荐文章于 2021-01-12 15:28:34 发布

独一无二

最新推荐文章于 2021-01-12 15:28:34 发布

阅读量833

点赞数

文章标签： android listview import animation matrix layout

先贴下文件目标结构，方便查看在文件中是如何引用动画资源的，截图如下：

（一）View内容渐变效果图一：

（二）View内容渐变效果图二:

（三） View动画刚开始时效果图如下：

（四）View动画播放到一半时效果图如下：

（五）View动画播放结束时效果图如下：

好了，大体的效果看完了，下面小马来分解下代码，大家不用担心看不懂，小马会在最后将此DEMO源码放在附件中，供大家学习交流：

一：先看下主布局文件，里面没什么重要的东西,但为了完整还是贴下：

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical" > 
     
    <Button  
        android:id="@+id/button" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:text="播放ListView动画" 
        /> 
    <ListView 
        android:id="@+id/listview" 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent" 
        android:layoutAnimation="@anim/list_layout_controller" 
        android:persistentDrawingCache="animation|scrolling" /> 
</LinearLayout>

二：下面来看下主控制类代码，如下：

package com.xiaoma.listviewanimation.demo; 
 
import android.app.Activity; 
import android.graphics.Camera; 
import android.graphics.Matrix; 
import android.os.Bundle; 
import android.view.View; 
import android.view.View.OnClickListener; 
import android.view.animation.AccelerateDecelerateInterpolator; 
import android.view.animation.AccelerateInterpolator; 
import android.view.animation.Animation; 
import android.view.animation.AnticipateInterpolator; 
import android.view.animation.AnticipateOvershootInterpolator; 
import android.view.animation.BounceInterpolator; 
import android.view.animation.CycleInterpolator; 
import android.view.animation.DecelerateInterpolator; 
import android.view.animation.LinearInterpolator; 
import android.view.animation.OvershootInterpolator; 
import android.view.animation.Transformation; 
import android.widget.ArrayAdapter; 
import android.widget.Button; 
import android.widget.ListView; 
 
/** 
 * @Title: ListViewAnimationDemoActivity.java 
 * @Package com.xiaoma.listviewanimation.demo 
 * @Description: ListView控件动画学习测试 
 * @author MZH 
 *  
 */ 
public class ListViewAnimationDemoActivity extends Activity implements 
        OnClickListener { 
 
    private ListView listview; 
    private Button btn; 
 
    /** Called when the activity is first created. */ 
    @Override 
    public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
        init(); 
    } 
 
    /** 
     * 初始化方法实现 
     */ 
    private void init() { 
        btn = (Button) findViewById(R.id.button); 
        btn.setOnClickListener(this); 
        String items[] = { "还记得", "那一年", "那一天", "有个人", "爱过我", 
                "洗刷刷", "爱拉拉", "哇吼吼", "咔酷伊", "咔哇伊", "哦吼吼", "小马果"}; 
        listview = (ListView) findViewById(R.id.listview); 
        //适配器我就用最简单的，要用复杂的，大家可以自定义适配器 
        ArrayAdapter<String> adapter = new ArrayAdapter<String>( 
                getApplicationContext(), android.R.layout.simple_list_item_1, 
                items); 
        listview.setAdapter(adapter); 
    } 
 
    /** 
     * 布局内所有点击事件监听 
     */ 
    @Override 
    public void onClick(View v) { 
        // 因为只有一个按钮,小马就直接写个if简单的判断下了,多个老规矩用分支判断 
        if (v.getId() == R.id.button) { 
            //开始播放ListView动画 
            startPlayAnimation(); 
        } 
    } 
 
    /** 
     * 开始播放ListView动画方法实现 
     */ 
    private void startPlayAnimation() { 
        // ListViewAnimationChange为矩阵控制类 
        listview.startAnimation(new ListViewAnimationChange()); 
    } 
 
    /** 
     * @Title: ListViewAnimationChange.java 
     * @Package com.xiaoma.listviewanimation.demo 
     * @Description: ListView控件的矩阵内部控制类 
     * @author MZH 
     * 在这个地方讲下,要自行控制屏幕矩阵的话必须实现现在两个方法 
     */ 
    private class ListViewAnimationChange extends Animation { 
 
        @Override 
        public void initialize(int width, int height, int parentWidth, 
                int parentHeight) { 
 
            // 将动画播放时间设置为5秒 
            setDuration(5000); 
            // 设置缩放完成后,效果不消失 
            setFillAfter(true); 
 
            // 设置线性插值器,这个地方new出来的对象跟在scale.xml中的插值器没什么区别,也可以用别的 
             
            /** 
             * 顺带着讲下在2D动画中常用的插值器吧,小马先给自己及大伙提醒下:插值器,就是告诉Android,播放动画时 
             * 是从快到慢还是从慢到快,从左到右的旋转还是其它的方式的动画,刚开始很怕这个词,试了下效果,其实不太吓人... 
             * 吼吼,类型如下面的八种，跟scale.xml或alpha.xml中使用的插值器一样的,只是写的形式不一样而已 
             *  
             */ 
 
            /** 
             * 所有的插值器都实现Interpolator接口中的 getInterpolation(float input)方法，好奇的朋友 
             * Ctrl跟进下....只注意一点,插值器不能同时set多个,不然最前面的会被覆盖,即:无效果.. 
             * new AccelerateDecelerateInterpolator();  
             * new AccelerateInterpolator();  
             * new CycleInterpolator(1.0f);  
             * new DecelerateInterpolator();  
             * new AnticipateInterpolator();  
             * new AnticipateOvershootInterpolator();  
             * new BounceInterpolator();  
             * new OvershootInterpolator();  
             * new LinearInterpolator(); 
             * 与以上几种插值器相对应的方法在xml文件中的使用方式大家可以自动ALT+/试下,换汤不换药 
             */ 
             
             
            // setInterpolator(new LinearInterpolator()); 
            // setInterpolator(new CycleInterpolator(1.0f) ); 
            // setInterpolator(new AccelerateDecelerateInterpolator()); 
            // setInterpolator(new DecelerateInterpolator()); 
             
             
            /** 
             * 这两个好玩就选了,这个效果类似于Android 4.0的那个左右摆动..效果可以自己打开注释试下.. 
             * 要用自己效果的可以重新改下矩阵的控制 
             */ 
            setInterpolator(new AnticipateOvershootInterpolator());  
            //setInterpolator(new OvershootInterpolator());  
            super.initialize(width, height, parentWidth, parentHeight); 
        } 
         
        /** 
         * 这个重写是控制矩阵中关键的一步 
         * 介绍一个参数：interpolatedTime 安卓系统在模拟动画时会反复的调用这个方法 
         * 所以这个值是一直变化的,从0-1变化.... 
         * 这个方法就是在某一个时间点上将动画添加到指定的控件上 
         */ 
        @Override 
        protected void applyTransformation(float interpolatedTime, 
                Transformation t) { 
            super.applyTransformation(interpolatedTime, t); 
 
            /* 
             * final Matrix matrix = t.getMatrix(); 
             * matrix.setScale(interpolatedTime, interpolatedTime); 
             * matrix.preTranslate(-50f, -50f); matrix.postTranslate(50f, 50f); 
             */ 
            // matrix.setRotate(45f); 
            // matrix.setTranslate(40f,50f); 
             
            /** 
             * Camera小马犯的错:导相机包...大家注意下就可以了, 
             * 我们应该导入graphics包 
             */ 
            Camera camera = new Camera(); 
            //取得屏幕矩阵对象 
            final Matrix matrix = t.getMatrix(); 
            camera.save(); 
            /** 
             * 下面方法中的参数大家自己CTRL跟下，小马不一一解说， 
             * 不跟进的自己改改看下效果就知道是什么意思了.. 
             */ 
            camera.translate(0.0f, 0.0f, (1300 - 1300.0f * interpolatedTime)); 
            camera.rotateY(360 * interpolatedTime); 
            camera.getMatrix(matrix); 
            //设置矩阵播放动画前的位置.原点为:0,0 
            matrix.preTranslate(-50f, -50f); 
            //设置矩阵播放完动画后的位置 
            matrix.postTranslate(50f, 50f); 
            camera.restore(); 
            // 如果用了以下的效果,则上面Camera做的矩阵变换将被覆盖 
            // matrix.setScale(interpolatedTime, interpolatedTime); 
        } 
    } 
}

在主控制类中，最重要的是那具自定义的动画类，它控制着VIEW的所有动画，如：插值器...2D渲染等，具体的看代码及注释部分的代码即可：

四：下面来看下用来关联View控件与动画的动画控制器代码：

<?xml version="1.0" encoding="utf-8"?> 
<!-- 动画控制器,这个文件只是把要添加的动画与我们的动画资源关联起来 
     下面这个属性来控制控制动画的方向,如:比底部到顶部,或别的... 
     我们在主布局文件中控件的属性里面使用这个地方的动画控制器 
     android:animationOrder="reverse" 
 --> 
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android" 
    android:delay="30%" 
    android:animationOrder="reverse" 
    android:animation="@anim/scale" 
    />

五：一个简单的透明度变化的文件，代码如下：

<?xml version="1.0" encoding="utf-8"?> 
<!-- alpha  
    这个地方说几句,android:interpolator 大家自行换换别的试下 
--> 
<alpha xmlns:android="http://schemas.android.com/apk/res/android"  
    android:interpolator="@android:anim/bounce_interpolator" 
    android:fromAlpha="0.0" 
    android:toAlpha="1.0" 
    android:duration="1000" 
    />

已经在anim文件夹下创建了几个动画文件，大家可以尝试着更改下动画控制XML文件里面的动画文件引用来查看不同的效果哦，更好的效果，也可以再再往里面添加属性完成即可