[android]仿制新浪微博消息页面图标切换动画

研究了下以前不怎么用到的动画效果的实现

顺便做了一个新浪微博消息页面图标切换动画效果的实例

如图

然后封装了一下这个效果的实现代码

如下

package com.lurencun.unit.unit;import android.app.Activity;import android.graphics.BitmapFactory;import android.graphics.Matrix;import android.view.animation.Animation;import android.view.animation.TranslateAnimation;import android.widget.ImageView;/** * 标签切换对应动画效果实现类 *  * @author poolo * @since 2012年8月10日 * @version 1.0.0 完成了2,3,4个标签的情况下的处理(越多- -就要以笛卡尔积的数量增长- -我觉得呢2~4够用了) */public class Unit {    private int current = 0;    private Activity at;    private ImageView cursor;    private float bmpW;    private float screenW;    private float offset;// 偏移量    /**     *      * @param a     *            当前Activity     * @param layoutId     *            当前作为图标使用的ImageViewId     * @param drawId     *            当前图标的drawId     * @param num     *            当前标签个数     */    public Unit(Activity a, int viewId, int drawId, int num) {        at = a;        init(viewId, drawId, num);    }    /**     * 纯粹是为了好看些的一个初始化数据包 无视这里吧     *      * @param viewId     * @param drawId     * @param num     */    private void init(int viewId, int drawId, int num) {        cursor = (ImageView) at.findViewById(viewId);        bmpW = BitmapFactory.decodeResource(at.getResources(), drawId)                .getWidth();        screenW = at.getWindowManager().getDefaultDisplay().getWidth();        offset = (screenW / num - bmpW) / 2;        Matrix matrix = new Matrix();        matrix.postTranslate(offset, 0);        cursor.setImageMatrix(matrix);    }    /**     * 两个标签的情况     * @param selectId 被选中的id     */    public void move2tag(int selectId) {        Animation animation = null;        float zero = 0;        float one = offset * 2 + bmpW;        switch (selectId) {        case 0:            if (current == 1) {                animation = new TranslateAnimation(one, zero, 0, 0);            }            break;        case 1:            if (current == 0) {                animation = new TranslateAnimation(zero, one, 0, 0);            }            break;        }        current = selectId;        animation.setFillAfter(true);        animation.setDuration(300);        cursor.startAnimation(animation);    }    /**     * 三个标签的情况     * @param selectId 被选中的id     */    public void move3tag(int selectId) {        Animation animation = null;        float zero = 0;        float one = offset * 2 + bmpW;        float two = one * 2;        switch (selectId) {        case 0:            if (current == 1) {                animation = new TranslateAnimation(one, zero, 0, 0);            }            if (current == 2) {                animation = new TranslateAnimation(two, zero, 0, 0);            }            break;        case 1:            if (current == 0) {                animation = new TranslateAnimation(zero, one, 0, 0);            }            if (current == 2) {                animation = new TranslateAnimation(two, one, 0, 0);            }            break;        case 2:            if (current == 0) {                animation = new TranslateAnimation(zero, two, 0, 0);            }            if (current == 1) {                animation = new TranslateAnimation(one, two, 0, 0);                break;            }        }        current = selectId;        animation.setFillAfter(true);        animation.setDuration(300);        cursor.startAnimation(animation);    }    /**     * 四个标签的情况     * @param selectId 被选中的id     */    public void move4tag(int selectId) {        Animation animation = null;        float zero = 0;        float one = offset * 2 + bmpW;        float two = one * 2;        float three = one * 3;        switch (selectId) {        case 0:            if (current == 1) {                animation = new TranslateAnimation(one, zero, 0, 0);            }            if (current == 2) {                animation = new TranslateAnimation(two, zero, 0, 0);            }            if (current == 3) {                animation = new TranslateAnimation(three, zero, 0, 0);            }            break;        case 1:            if (current == 0) {                animation = new TranslateAnimation(zero, one, 0, 0);            }            if (current == 2) {                animation = new TranslateAnimation(two, one, 0, 0);            }            if (current == 3) {                animation = new TranslateAnimation(three, one, 0, 0);            }            break;        case 2:            if (current == 0) {                animation = new TranslateAnimation(zero, two, 0, 0);            }            if (current == 1) {                animation = new TranslateAnimation(one, two, 0, 0);            }            if (current == 3) {                animation = new TranslateAnimation(three, two, 0, 0);            }            break;        case 3:            if (current == 0) {                animation = new TranslateAnimation(zero, three, 0, 0);            }            if (current == 1) {                animation = new TranslateAnimation(one, three, 0, 0);            }            if (current == 2) {                animation = new TranslateAnimation(two, three, 0, 0);            }            break;        }        current = selectId;        animation.setFillAfter(true);        animation.setDuration(300);        cursor.startAnimation(animation);    }}

一个需要注意的地方使用此方法的童鞋切记自己的ImageView需要设置 android:scaleType="matrix" 才能使图形作为矩形计算不至于出现错误

    <ImageView        android:id="@+id/testImg1"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:contentDescription="@string/hello"        android:scaleType="matrix"        android:src="@drawable/jian_tou" />

部分借鉴与：http://www.eoeandroid.com/code/2012/0322/994_2.html

另如果路过的同学知道如何截android手机上的动态图麻烦留言告知下，谢谢。

jar包,源码,apk,截图都在下面。

已经交给团队封装代码的童鞋将会封装到这个工具jar中

https://github.com/chenyoca/ToolkitForAndroid

更多相关文章

随机推荐

[android]仿制新浪微博消息页面 图标切换动画

更多相关文章

随机推荐

[android]仿制新浪微博消息页面图标切换动画