Android TextView自定義數(shù)字滾動(dòng)動(dòng)畫
背景
在開發(fā)需求當(dāng)中,當(dāng)有總收益、總用戶數(shù)等數(shù)字要顯示時(shí),為了更好的給用戶提供展示效果,往往會(huì)想加入炫酷的數(shù)字滾動(dòng)動(dòng)畫,使呆板平靜的數(shù)字變得靈活起來,給人一種增值的直觀感受。
簡介
NumberRollingView是一個(gè)自定義的自帶數(shù)字滾動(dòng)動(dòng)畫的TextView,通過使用setContent(String str)方法進(jìn)行數(shù)字字符串設(shè)置,傳入相應(yīng)的金額數(shù)字字符串(如"9686.86")或者整數(shù)數(shù)字字符串(如"968"),設(shè)置的數(shù)字必須是正數(shù)。當(dāng)顯示頁面初始化完成的過程中,就可以看到數(shù)字滾動(dòng)的效果了。
效果圖:

使用
1.在attr.xml中配置NumberRollingView的自定義屬性
<declare-styleable name="NumberRollingView">
<!--幀數(shù)-->
<attr name="frameNum" format="integer"></attr>
<!--內(nèi)容的格式-->
<attr name="textType">
<enum name="money" value="0"></enum>
<enum name="num" value="1"></enum>
</attr>
<!--是否設(shè)置每三位數(shù)字一個(gè)逗號(hào)-->
<attr name="useCommaFormat" format="boolean"></attr>
<!--是否當(dāng)內(nèi)容改變的時(shí)候使用動(dòng)畫,反之則不使用動(dòng)畫-->
<attr name="runWhenChange" format="boolean"></attr>
</declare-styleable>
frameNum:動(dòng)畫的幀數(shù),默認(rèn)為30幀;
textType:內(nèi)容的格式,有money(金額、兩位小數(shù))和num(整數(shù))兩種格式,默認(rèn)為0(金額格式);
useCommaFormat:是否設(shè)置每三位數(shù)字一個(gè)逗號(hào),默認(rèn)為true(設(shè)置逗號(hào)顯示);
runWhenChange:是否當(dāng)內(nèi)容改變的時(shí)候使用動(dòng)畫,反之則不使用動(dòng)畫,默認(rèn)為true(內(nèi)容改變時(shí)使用動(dòng)畫);
2.在XML布局文件中引用View
<com.wiggins.digitalchange.widget.NumberRollingView android:id="@+id/tv_money" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="0.00" android:textColor="@color/white" android:textSize="@dimen/font_max" android:textStyle="bold" /> <com.wiggins.digitalchange.widget.NumberRollingView android:id="@+id/tv_num" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="0" android:textColor="@color/white" android:textSize="@dimen/font_max" android:textStyle="bold" app:textType="num" />
前者是金額數(shù)字View,后者是整數(shù)數(shù)字View。
3.Java文件中調(diào)用
tvMoney.setContent("9686.86");
tvNum.setContent("9686");
4.取消數(shù)字的自動(dòng)格式化(設(shè)置每三位數(shù)字一個(gè)逗號(hào))
默認(rèn)情況下顯示的數(shù)字經(jīng)過了格式化處理,設(shè)置每三位數(shù)字添加一個(gè)逗號(hào)分隔,這使得數(shù)字看起來清晰明了,不會(huì)顯得臃腫繁雜。如果不想將數(shù)字進(jìn)行格式化處理,可以在布局文件中將useCommaFormat屬性設(shè)置為false,或者在代碼中設(shè)置setUseCommaFormat(boolean useCommaFormat)為false,這樣顯示的數(shù)字就不會(huì)是帶有逗號(hào)了。
5.設(shè)置無論內(nèi)容是否改變都要執(zhí)行滾動(dòng)動(dòng)畫
默認(rèn)情況下NumberRollingView會(huì)自動(dòng)判斷傳入的內(nèi)容是否有變化,當(dāng)內(nèi)容發(fā)生變化時(shí)執(zhí)行數(shù)字滾動(dòng)動(dòng)畫,內(nèi)容未變時(shí)不執(zhí)行數(shù)字滾動(dòng)動(dòng)畫。如果想無論內(nèi)容是否有變化都要執(zhí)行滾動(dòng)動(dòng)畫的話,可以在布局文件中將runWhenChange屬性設(shè)置為false,或者在代碼中設(shè)置setRunWhenChange(boolean runWhenChange)為false,這樣無論內(nèi)容是否有變化都會(huì)執(zhí)行滾動(dòng)動(dòng)畫。
6.設(shè)置動(dòng)畫幀數(shù)
默認(rèn)情況下數(shù)字滾動(dòng)動(dòng)畫幀數(shù)為30幀,如果需要修改動(dòng)畫幀數(shù),可根據(jù)實(shí)際需要在在布局文件中將frameNum屬性設(shè)置為自己想要的幀數(shù),或者在代碼中設(shè)置setFrameNum(int frameNum)為自己想要的幀數(shù)即可。
7.數(shù)字字符串格式化(每三位數(shù)字添加一個(gè)逗號(hào))
/**
* @param str 字符串只能為兩位小數(shù)或者整數(shù)
* @param isDecimal 是否是小數(shù)
* @Description 格式化字符串,每三位用逗號(hào)隔開
*/
public static String addComma(String str, boolean isDecimal) {
//先將字符串顛倒順序
str = new StringBuilder(str).reverse().toString();
if (str.equals("0")) {
return str;
}
String str2 = "";
for (int i = 0; i < str.length(); i++) {
if (i * 3 + 3 > str.length()) {
str2 += str.substring(i * 3, str.length());
break;
}
str2 += str.substring(i * 3, i * 3 + 3) + ",";
}
if (str2.endsWith(",")) {
str2 = str2.substring(0, str2.length() - 1);
}
//最后再將順序反轉(zhuǎn)過來
String temp = new StringBuilder(str2).reverse().toString();
if (isDecimal) {
//去掉最后的","
return temp.substring(0, temp.lastIndexOf(",")) + temp.substring(temp.lastIndexOf(",") + 1, temp.length());
} else {
return temp;
}
}
8.開始金額數(shù)字動(dòng)畫的方法
如果傳入的金額中包含格式化的字符如","或"-"符號(hào),就將符號(hào)去除;將傳入的數(shù)字進(jìn)行格式轉(zhuǎn)換,轉(zhuǎn)換為Double類型的金額格式,如果發(fā)生轉(zhuǎn)換異常則直接進(jìn)行顯示;同時(shí)判斷傳入的數(shù)字大小,如果為0則直接顯示,若不為0則設(shè)置每幀間隔的大小,發(fā)送Message消息給Handler進(jìn)行內(nèi)容的更新。
/**
* @Description 開始金額數(shù)字動(dòng)畫的方法
*/
public void startMoneyAnim(String moneyStr) {
// 如果傳入的數(shù)字已經(jīng)格式化了,則將包含的符號(hào)去除
String money = moneyStr.replace(",", "").replace("-", "");
try {
finalMoneyNum = Double.parseDouble(money);
if (finalMoneyNum == 0) {
// 如果傳入的數(shù)字為0則直接使用setText()進(jìn)行顯示
NumberRollingView.this.setText(moneyStr);
return;
}
nowMoneyNum = 0;
threadPool.execute(new Runnable() {
@Override
public void run() {
Message msg = handler.obtainMessage();
// 將傳入的數(shù)字除以幀數(shù),得到每幀間隔的大小
double size = finalMoneyNum / frameNum;
msg.what = MONEY_TYPE;
// 如果每幀的間隔小于0.01,則設(shè)置間隔為0.01
msg.obj = size < 0.01 ? 0.01 : size;
// 發(fā)送消息改變UI
handler.sendMessage(msg);
}
});
} catch (NumberFormatException e) {
e.printStackTrace();
//如果轉(zhuǎn)換Double失敗則直接用setText()
NumberRollingView.this.setText(moneyStr);
}
}
9.開始數(shù)字動(dòng)畫的方法
同上述金額數(shù)字一般,先進(jìn)行格式化符號(hào)去除,然后進(jìn)行類型轉(zhuǎn)換,將其轉(zhuǎn)換為Integer類型的整數(shù)格式,如果發(fā)生轉(zhuǎn)換異常則直接進(jìn)行顯示;為了更加人性化,我們將傳入的數(shù)字與幀數(shù)作了比較,如果數(shù)值小于幀數(shù)就直接顯示,當(dāng)然你想不管數(shù)字大小都能進(jìn)行動(dòng)畫展示,只需將下面的幀數(shù)間隔的獲取稍加改造即可;若大于等于設(shè)置的幀數(shù)則設(shè)置每幀間隔的大小,發(fā)送Message消息給Handler進(jìn)行內(nèi)容的更新。
/**
* @Description 開始數(shù)字動(dòng)畫的方法
*/
public void startNumAnim(String numStr) {
// 如果傳入的數(shù)字已經(jīng)格式化了,則將包含的符號(hào)去除
String num = numStr.replace(",", "").replace("-", "");
try {
finalNum = Integer.parseInt(num);
if (finalNum < frameNum) {
// 如果傳入的數(shù)字比幀數(shù)小,則直接使用setText()
NumberRollingView.this.setText(numStr);
return;
}
// 默認(rèn)從0開始動(dòng)畫
nowNum = 0;
threadPool.execute(new Runnable() {
@Override
public void run() {
Message msg = handler.obtainMessage();
// 將傳入的數(shù)字除以幀數(shù),得到每幀間隔的大小
int temp = finalNum / frameNum;
msg.what = NUM_TYPE;
msg.obj = temp;
// 發(fā)送消息改變UI
handler.sendMessage(msg);
}
});
} catch (NumberFormatException e) {
e.printStackTrace();
//如果轉(zhuǎn)換Integer失敗則直接用setText
NumberRollingView.this.setText(numStr);
}
}
項(xiàng)目地址 :傳送門
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- android開發(fā)教程之textview內(nèi)容超出屏幕寬度顯示省略號(hào)
- Android設(shè)置TextView顯示指定個(gè)數(shù)字符,超過部分顯示...(省略號(hào))的方法
- Android中Textview和圖片同行顯示(文字超出用省略號(hào),圖片自動(dòng)靠右邊)
- Android設(shè)置當(dāng)TextView中的文字超過TextView的容量時(shí)用省略號(hào)代替
- 解析在Android中為TextView增加自定義HTML標(biāo)簽的實(shí)現(xiàn)方法
- Android TextView顯示Html類解析的網(wǎng)頁和圖片及自定義標(biāo)簽用法示例
- Android自定義View之繼承TextView繪制背景
- Android自定義TextView實(shí)現(xiàn)文字傾斜效果
- Android 自定義TextView實(shí)現(xiàn)文本內(nèi)容自動(dòng)調(diào)整字體大小
- Android自定義豎排TextView實(shí)現(xiàn)實(shí)例
- Android自定義textview實(shí)現(xiàn)豎直滾動(dòng)跑馬燈效果
- Android開發(fā)自定義TextView省略號(hào)樣式的方法
相關(guān)文章
Android xmlns 的作用及其自定義實(shí)例詳解
這篇文章主要介紹了 Android xmlns 的作用及其自定義實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下2017-06-06
淺談Android Studio如何Debug對應(yīng)so文件C/C++代碼
本篇文章主要介紹了淺談Android Studio如何Debug對應(yīng)so文件C/C++代碼,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-12-12
Android中TextView顯示圓圈背景或設(shè)置圓角的方法
TextView顯示文本給用戶,并允許他們選擇編輯。TextView是一個(gè)完整的文本編輯器,但是其基本類配置為不允許編輯。下面這篇文章主要給大家介紹了關(guān)于Android中TextView顯示圓圈背景或設(shè)置圓角的方法,需要的朋友可以參考借鑒,下面來一起看看吧。2017-05-05
Android編程實(shí)現(xiàn)ListView中item部分區(qū)域添加點(diǎn)擊事件功能
這篇文章主要介紹了Android編程實(shí)現(xiàn)ListView中item部分區(qū)域添加點(diǎn)擊事件功能,涉及Android ListView相關(guān)適配器及事件響應(yīng)操作技巧,需要的朋友可以參考下2018-01-01
RecyclerView焦點(diǎn)跳轉(zhuǎn)BUG優(yōu)化的方法
這篇文章主要介紹了RecyclerView焦點(diǎn)跳轉(zhuǎn)BUG優(yōu)化的方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-04-04
Android實(shí)現(xiàn)手勢滑動(dòng)多點(diǎn)觸摸放大縮小圖片效果
這篇文章主要介紹了Android實(shí)現(xiàn)手勢滑動(dòng)多點(diǎn)觸摸放大縮小圖片效果的相關(guān)資料,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-02-02
Android開發(fā)實(shí)現(xiàn)Gallery畫廊效果的方法
這篇文章主要介紹了Android開發(fā)實(shí)現(xiàn)Gallery畫廊效果的方法,結(jié)合具體實(shí)例形式分析了Android使用Gallery實(shí)現(xiàn)畫廊功能的具體操作技巧與相關(guān)注意事項(xiàng),需要的朋友可以參考下2017-06-06
Android開發(fā)Kotlin語言協(xié)程的依賴及使用示例
這篇文章主要為大家介紹了Android開發(fā)Kotlin語言協(xié)程的依賴及使用示例解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
Android編程之九宮格實(shí)現(xiàn)方法實(shí)例分析
這篇文章主要介紹了Android編程之九宮格實(shí)現(xiàn)方法,結(jié)合實(shí)例形式分析了Android九宮格的實(shí)現(xiàn)方法與具體步驟,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-01-01
Android Studio真機(jī)無線連接USB設(shè)備調(diào)試運(yùn)行詳解流程
你在Android Studio寫app時(shí)是否也有想過如果可以不用數(shù)據(jù)線連接手機(jī)調(diào)試運(yùn)行就好了?如果需要取出數(shù)據(jù)線插接的話我肯定是嫌麻煩的,但是模擬器有時(shí)候需要測試一些需要硬件支持的功能時(shí)又不管用,所以最好的測試還是在真機(jī)上,本篇教你扔掉數(shù)據(jù)線來無線調(diào)試2021-11-11

