您的位置:首页 > 移动开发 > Android开发

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

2012-03-09 13:33 856 查看
先贴下文件目标结构,方便查看在文件中是如何引用动画资源的,截图如下:





(一)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文件里面的动画文件引用来查看不同的效果哦,更好的效果,也可以再再往里面添加属性完成即可
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: