仿余额宝数字滚动增长的效果实现

这个已经是被大家做烂了的效果了,之所以我自己做这个效果而不是直接从网上拷贝一个来用,主要是因为网上的工具不太符合我的要求,大部分网友写的工具都不可以带单位的,只是数字方面的增长效果,而我的APP中需要带上单位,比如公里、升之类的,与其改人家的源码不如自己写一个了。
先看效果图:

1.gif

Android中的动画

这里用到了属性动画,Android中的动画主要分为三大类,分别是视图动画和属性动画。
视图动画分为Tween Animation(补间动画)和Frame Animation(逐帧动画)
属性动画分为ValueAnimator 和 ObjectAnimator;

这里一定要注意一下各种动画引入时Android的版本号,否则动画不会启用,视图动画是API Level 1就引入的,所以支持所有Android的版本,而属性动画是API Level 11引入的,即Android 3.0才开始有属性动画相关的API,故而在使用属性动画时一定要判断API的版本,避免一些不必要的Bug.

实现思路

整个思路很简单,在使用这个组件的过程中有几个点是要考虑进去的,第一,可以是整数类型也可以是浮点型的数字,所以这里要做标识区分开,第二,可以加入单位(核心需求),第三,可以开启是否四舍五入,比如需要整数类型的时候,而传入的数字是浮点型,这时会自动把传入的浮点型转化为整数类型,这里就要考虑四舍五入的问题了。

代码实现

下面来看是如何实现的
实现类:


import android.animation.ValueAnimator;
import android.util.Log;
import android.view.animation.AccelerateInterpolator;
import android.widget.TextView;

/**
 * 类描述: 创建人:贾真
 * 创建时间:2017/1/23 15:44 
 */
public class AutoIncrementUtil {

   public static final String FLOATTYPE="FloatType";
    public static final String INTTYPE="IntType";

    public static void startAnimation(String type,final TextView tvView,float floatValue
        ,boolean isRoundUp,final String danwei,int duration){
        ValueAnimator animator=null;
        if(type.equals(FLOATTYPE)){
              animator=ValueAnimator.ofFloat(0,floatValue);
            animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                @Override
                public void onAnimationUpdate(ValueAnimator valueAnimator) {
                    float curValue = (float)valueAnimator.getAnimatedValue();
                    Log.e("curValue ",curValue+"");
                    tvView.setText(NumUtil.FormatFloat(curValue)+danwei);
                }
            });
        }else if(type.equals(INTTYPE)){
            String targetValueString =NumUtil.FormatRoundUp(isRoundUp,floatValue);
            animator=ValueAnimator.ofInt(0,Integer.parseInt(targetValueString));
            animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                @Override
                public void onAnimationUpdate(ValueAnimator valueAnimator) {
                    int curValue = (int)valueAnimator.getAnimatedValue();
                    tvView.setText(curValue+danwei);
                }
            });
        }
        animator.setDuration(duration);
        animator.setInterpolator(new AccelerateInterpolator());
        animator.start();
    }

}

数字转化工具类:

import java.text.DecimalFormat;


public class NumUtil {

    private NumUtil(){


    }

    public static String FormatFloat(float value){
        DecimalFormat df = new DecimalFormat("0.00");
        return df.format(value);
    }
    public static String FormatRoundUp(boolean isRoundUp,float value){
        DecimalFormat df;
        if(isRoundUp){
            df = new DecimalFormat("######0"); //四色五入转换成整数

            return df.format(value);
        }else{
            Float f= new Float(value);
            int i=f.intValue();
            return String.valueOf(i);
        }
    }
}

如何使用:

  AutoIncrementUtil.startAnimation(AutoIncrementUtil.INTTYPE,NumView,153261.93f,false,"公里",1500);

应该说是非常简单了,主要用到了属性动画的ValueAnimator的两个方法,ofInt和ofFloat,剩下的都是按部就班的调用相关的方法即可,大家稍微阅读一下源码就应该懂了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,012评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,628评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,653评论 0 350
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,485评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,574评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,590评论 1 293
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,596评论 3 414
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,340评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,794评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,102评论 2 330
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,276评论 1 344
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,940评论 5 339
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,583评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,201评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,441评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,173评论 2 366
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,136评论 2 352

推荐阅读更多精彩内容