1. 程式人生 > >Android自定義倒計時控制元件

Android自定義倒計時控制元件

序:

最近越來越多的APP都是用手機號註冊,一是為了方便使用者記憶,二是為了增加使用者賬戶的安全性。在我們進行交易操作或者修改密碼等操作的時候,這時候需要輸入簡訊驗證碼。這個控制元件會需要有倒計時的功能,這裡主要總結常見的幾種實現方式。

1.Android中實現倒計時的方法

第一種:直接用Handler的訊息機制來實現

這種方式感覺是最原始的,這裡不多說。

第二種:Timer和TimerTask

基本使用:獲得Timer和TimerTask物件,然後啟動,倒計時的邏輯寫在handler裡面

private Timer mTimer=new Timer();    

private TimerTask mTimerTask= new TimerTask() {

@Override

public void run() {

mHandler.sendEmptyMessage(COUNTTIME);

}

};

// 倒計時任務啟動 

mTimer.schedule(mTimerTask, 0, mOnetime);

這裡要注意資源的釋放:在適當的地方清空資源

/*** 清除時間*/ 

private void clearTimer() {

if (mTimerTask != null) {

mTimerTask.cancel();

mTimerTask = null;

}

if (mTimer != null) {

mTimer.cancel();

mTimer = null;

}

}

第三種:直接使用Android自帶的原生倒計時類(也是利用Handler來實現的)

btnGetVerificationCode.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

// 這個是原生的倒計時類,第一個引數是總毫秒數,第二個是倒計時的毫秒數。

new CountDownTimer(10000, 1000) {

@Override

public void onTick(long millisUntilFinished) {

// 倒計時中的方法

btnGetVerificationCode.setEnabled(false);

btnGetVerificationCode.setText(millisUntilFinished / 1000 + "秒");

}

@Override

public void onFinish() {

// 倒計時結束後的方法

btnGetVerificationCode.setEnabled(true);

btnGetVerificationCode.setText("重複獲取驗證碼");

}

}.start();// 開始倒計時的方法

}

});

這種方式,看起來是最簡單的,可是有幾個明顯的缺陷:

1.倒計時一開始顯示的秒數可能不準確

2.倒計時的過程中可能丟失一秒 

3.倒計時的最後顯示“1秒”,然後會卡頓1秒,並不是所期望的0秒。卡頓1秒以後才顯示。

2.商城倒計時庫

這裡推薦一個github上的商品倒計時庫:商品倒計時庫

3.自定義的倒計時控制元件

為了簡化倒計時控制元件的使用,參考商品倒計時庫,編寫了一個自定義控制元件。效果如下


具體的實現原理是:繼承TextView,重新onTouch()方法,使用Timer來進行倒計時。

4.自定義倒計時控制元件基本使用

第一步:在佈局中新增該控制元件:

<android:id="@+id/MSGCTV"

android:layout_width="wrap_content"

android:layout_gravity="center_horizontal"

android:layout_height="wrap_content"

android:padding="16dp"/>

第二步:在合適的地方加入

msgCountTimeView.isAllowRun(true);//允許開始倒計時

部分API的說明

countTimeView.setTotaltime(10000);//設定總時間,單位是毫秒

setInittext("")//設定初始化的文字

setPrefixRuntext("程式碼剩餘時間")//設定執行時的文字的字首

setSuffixRuntext("")//設定執行時的文字的字尾

setFinishtext("程式碼重新獲取")//設定結束後的文字

setTimeColor(color.blueLight);//設定執行時秒數的顏色

5.原始碼地址