Android之實現倒計時的那點事兒
阿新 • • 發佈：2019-02-19
前言
LZ-Says：今天收到轉正通知了，內心也就1~2s開心，隨之而來的就是不平不淡。16年10月18號入職，感覺一切都好像眨眼之間，過得好快，各種忙~
答應了自己，要好好努力。答應了家人，要好好奮鬥。答應了心，要好好堅持。有什麼理由不去努力
開始正題
好吧，今天一起回顧下，關於Android中實現倒計時功能吧~
今天為大家介紹倆種方式，都可以實現倒計時功能。這倆種方式分別是：
1. Handler+Thread
2. CountDownTimer
想必大家對於第一種實現方式肯定不會陌生了，簡直So easy~那再次回顧下第一種寫法~
1.通過使用Handler+Thread實現倒計時
首先編寫佈局檔案
佈局檔案很簡單，就是一個TextView，預設顯示Handler獲取驗證碼，點選TextView，進行倒計時操作，完成後恢復預設顯示。
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
放大招，編寫Activity，實現效果~
public class MainActivity extends Activity {
private TextView tvShowH;
private Handler handler = new Handler() {
public void handleMessage(Message msg) {
tvShowH.setText(msg.what - 1 + "s");
if (msg.what == 0) {
// 倒計時結束讓按鈕可用
tvShowH.setEnabled(true);
tvShowH.setText("Handler獲取驗證碼");
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tvShowH = (TextView) findViewById(R.id.tv_show_h);
tvShowH.setOnClickListener(listenerH);
}
private OnClickListener listenerH = new View.OnClickListener() {
@Override
public void onClick(View v) {
tvShowH.setEnabled(false);
new Thread(new Runnable() {
@Override
public void run() {
for (int i = 10; i >= 0; i--) {
handler.sendEmptyMessage(i);
try {
Thread.sleep(1000);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}).start();
}
};
}- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
來張效果圖瞅瞅唄~
2.通過CountDownTimer實現倒計時
CountDownTimer簡介
CountDownTimer是好的一個關於實現倒計時功能的類。所在包：package android.os;其內部實現也是通過咱第一種實現方式，沒啥好說的，看看人家官方簡介吧
官方使用方式
new CountdownTimer(30000, 1000) {
public void onTick(long millisUntilFinished) {
mTextField.setText("seconds remaining: " + millisUntilFinished / 1000);
}
public void onFinish() {
mTextField.setText("done!");
}
}.start();- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
The calls to onTick(long) are synchronized to this object so that one call to onTick(long) won’t ever occur before the previous callback is complete. This is only relevant when the implementation of onTick(long) takes an amount of time to execute that is significant compared to the countdown interval.
從上面官方提供例子可以看出，如果想要使用CountDownTimer去實現倒計時，需要如下幾個步驟：
- 例項化CountDownTimer物件；
- 提供計時時間毫秒以及時間間隔毫秒；
- 重寫onTick()和onFinish()方法；
那麼這倆個方法分別都是什麼作用呢？
3.1 onTick(long millisUntilFinished)
引數millisUntilFinished是倒計時的剩餘時間。在倒計時結束後會呼叫onFinish。
3.2 onFinish()
倒計時結束後需要執行的操作可以寫在這裡。- start()開始倒計時~
開始Coding
首先在原有介面新增一個TextView，操作流程都一樣。
新增後layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="@+id/tv_show_c"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_show_h"
android:layout_centerHorizontal="true"
android:layout_marginTop="25dp"
android:text="CountDownTimer獲取驗證碼" />
<TextView
android:id="@+id/tv_show_h"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="178dp"
android:text="Handler獲取驗證碼" />
</RelativeLayout>- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
新增後Activity
package com.example.hlqcountdowntimer;
import android.app.Activity;
import android.os.Bundle;
import android.os.CountDownTimer;
import android.os.Handler;
import android.os.Message;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;
public class MainActivity extends Activity {
private TextView tvShowH, tvShowC;
private Handler handler = new Handler() {
public void handleMessage(Message msg) {
tvShowH.setText(msg.what - 1 + "s");
if (msg.what == 0) {
// 倒計時結束讓按鈕可用
tvShowH.setEnabled(true);
tvShowH.setText("Handler獲取驗證碼");
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tvShowH = (TextView) findViewById(R.id.tv_show_h);
tvShowH.setOnClickListener(listenerH);
tvShowC = (TextView) findViewById(R.id.tv_show_c);
tvShowC.setOnClickListener(listenerC);
}
private OnClickListener listenerH = new View.OnClickListener() {
@Override
public void onClick(View v) {
tvShowH.setEnabled(false);
new Thread(new Runnable() {
@Override
public void run() {
for (int i = 10; i >= 0; i--) {
handler.sendEmptyMessage(i);
try {
Thread.sleep(1000);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}).start();
}
};
private OnClickListener listenerC = new View.OnClickListener() {
@Override
public void onClick(View v) {
tvShowC.setEnabled(false);
timer.start();
}
};
private CountDownTimer timer = new CountDownTimer(10000, 1000) {
@Override
public void onTick(long millisUntilFinished) {
long time = millisUntilFinished / 1000;
if (time == 0) {
tvShowC.setText(time + "秒後可重發");
onFinish();
}
tvShowC.setText(time + "秒後可重發");
}
@Override
public void onFinish() {
tvShowC.setEnabled(true);
tvShowC.setText("CountDownTimer獲取驗證碼");
}
};
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
來個效果圖~
不知道大家有沒有發現一個小問題，怎麼到1秒時，會出現短暫延遲？而且使用CountDownTimer可以顯示0秒麼？
關於以上問題，讓我們一起去看看人家是什麼寫的，從他們寫的程式碼中看看能不能發現相關蛛絲馬跡~關於可以顯示0秒麼這個問題，個人覺得，那必須啊~就看怎麼改他了~
深入瞭解CountDownTimer
讓我們一起進入它內部去瞅瞅~
//首先就是相關的介紹，LZ英文很LOW，就不多說了~
/*
* Copyright (C) 2008 The Android Open Source Project
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package android.os;
//下面就是為大家簡單介紹如何使用CountDownTimer去實現倒計時效果
/**
* Schedule a countdown until a time in the future, with
* regular notifications on intervals along the way.
*
* Example of showing a 30 second countdown in a text field:
*
* <pre class="prettyprint">
* new CountDownTimer(30000, 1000) {
*
* public void onTick(long millisUntilFinished) {
* mTextField.setText("seconds remaining: " + millisUntilFinished / 1000);
* }
*
* public void onFinish() {
* mTextField.setText("done!");
* }
* }.start();
* </pre>
*
* The calls to {@link #onTick(long)} are synchronized to this object so that
* one call to {@link #onTick(long)} won't ever occur before the previous
* callback is complete. This is only relevant when the implementation of
* {@link #onTick(long)} takes an amount of time to execute that is significant
* compared to the countdown interval.
*/
public abstract class CountDownTimer {
/**
* Millis since epoch when alarm should stop.
*/
private final long mMillisInFuture;
/**
* The interval in millis that the user receives callbacks
*/
private final long mCountdownInterval;
private long mStopTimeInFuture;
/**
* boolean representing if the timer was cancelled
*/
private boolean mCancelled = false;
/**
* @param millisInFuture The number of millis in the future from the call
* to {@link #start()} until the countdown is done and {@link #onFinish()}
* is called.
* @param countDownInterval The interval along the way to receive
* {@link #onTick(long)} callbacks.
*/
public CountDownTimer(long millisInFuture, long countDownInterval) {
mMillisInFuture = millisInFuture;
mCountdownInterval = countDownInterval;
}
/**
* Cancel the countdown.
*/
public synchronized final void cancel() {
mCancelled = true;
mHandler.removeMessages(MSG);
}
/**
* Start the countdown.
*/
public synchronized final CountDownTimer start() {
mCancelled = false;
if (mMillisInFuture <= 0) {
onFinish();
return this;
}
mStopTimeInFuture = SystemClock.elapsedRealtime() + mMillisInFuture;
mHandler.sendMessage(mHandler.obtainMessage(MSG));
return this;
}
/**
* Callback fired on regular interval.
* @param millisUntilFinished The amount of time until finished.
*/
public abstract void onTick(long millisUntilFinished);
/**
* Callback fired when the time is up.
*/
public abstract void onFinish();
private static final int MSG = 1;
// handles counting down
private Handler mHandler = new Handler() {
@Override
public void handleMessage(Message msg) {
synchronized (CountDownTimer.this) {
if (mCancelled) {
return;
}
final long millisLeft = mStopTimeInFuture - SystemClock.elapsedRealtime();
if (millisLeft <= 0) {
onFinish();
} else if (millisLeft < mCountdownInterval) {
// no tick, just delay until done
sendMessageDelayed(obtainMessage(MSG), millisLeft);
} else {
long lastTickStart = SystemClock.elapsedRealtime();
onTick(millisLeft);
// take into account user's onTick taking time to execute
long delay = lastTickStart + mCountdownInterval - SystemClock.elapsedRealtime();
// special case: user's onTick took more than interval to
// complete, skip to next interval
while (delay < 0) delay += mCountdownInterval;
sendMessageDelayed(obtainMessage(MSG), delay);
}
}
}
};
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
- 126
- 127
- 128
- 129
- 130
- 131
- 132
- 133
- 134
- 135
- 136
- 137
- 138
- 139
- 140
- 141
- 142
- 143
- 144
- 145
- 146
- 147
- 148
- 149
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
- 126
- 127
- 128
- 129
- 130
- 131
- 132
- 133
- 134
- 135
- 136
- 137
- 138
- 139
- 140
- 141
- 142
- 143
- 144
- 145
- 146
- 147
- 148
- 149
CountDownTimer分析
首先從上面可以看出，一上來他就給我們進行一些簡單的介紹，之後就是提供使用方法，接下來就是重點，讓我們瞅瞅他們是什麼寫的~
- 方法使用synchronized修飾，保證一次操作只能有一個進行訪問；
- 在文章開頭，我簡單說過他內部同樣是通過Handler去實現倒計時效果，但是我們發現他使用了一個SystemClock.elapsedRealtime()，那麼這個東西又是什麼呢？經過百度後得知，他的作用就是返回系統啟動到現在的毫秒數，包含休眠時間。不難理解，其實個人覺得和我們第一種寫法差不多。
- 那麼問題他為什麼會出現短暫卡頓呢？其實大家在仔細查閱後會發現，當它等於1時，接下來再走不就是0了麼，小於等於0的時候同樣也會走一次，但是這次卻不會更新UI，所以造成一種假象，就會讓我們覺得介面出現了稍微卡頓。那麼說到這，大家也就知道了怎麼使用CountDownTimer去顯示0.下面請看修改後的CountDownTimer~
改造後的CountDownTimer
基於以上分析，我們明白，只需要當計時毫秒數小於等於0的時候，他不會進行更新UI操作，那麼我們只需要讓它在小於等於0的時候，進行更新UI操作即可。
修改CountDownTimer
這部分很簡單，建立一個類，將CountDownTimer中複製到我們新的類中，小小修改下即可實現我們的效果~
package com.example.hlqcountdowntimer.weight;
import android.os.Handler;
import android.os.Message;
import android.os.SystemClock;
import android.widget.TextView;
public abstract class CountDownTimer {
private final TextView test;
/**
* Millis since epoch when alarm should stop.
*/
private final long mMillisInFuture;
/**
* The interval in millis that the user receives callbacks
*/
private final long mCountdownInterval;
private long mStopTimeInFuture;
/**
* boolean representing if the timer was cancelled
*/
private boolean mCancelled = false;
/**
* @param millisInFuture
* The number of millis in the future from the call to
* {@link #start()} until the countdown is done and
* {@link #onFinish()} is called.
* @param countDownInterval
* The interval along the way to receive {@link #onTick(long)}
* callbacks.
*/
public CountDownTimer(TextView test, long millisInFuture, long countDownInterval) {
this.test = test;
mMillisInFuture = millisInFuture;
mCountdownInterval = countDownInterval;
}
/**
* Cancel the countdown.
*/
public synchronized final void cancel() {
mCancelled = true;
mHandler.removeMessages(MSG);
}
/**
* Start the countdown.
*/
public synchronized final CountDownTimer start() {
mCancelled = false;
if (mMillisInFuture <= 0) {
onFinish();
return this;
}
mStopTimeInFuture = SystemClock.elapsedRealtime() + mMillisInFuture;
mHandler.sendMessage(mHandler.obtainMessage(MSG));
return this;
}
/**
* Callback fired on regular interval.
*
* @param millisUntilFinished
* The amount of time until finished.
*/
public void onTick(long millisUntilFinished) {
long time = millisUntilFinished / 1000;
test.setText(time + "秒後可重發");
};
/**
* Callback fired when the time is up.
*/
public void onFinish() {
test.setEnabled(true);
test.setText("完犢子");
};
private static final int MSG = 1;
// handles counting down
private Handler mHandler = new Handler() {
@Override
public void handleMessage(Message msg) {
synchronized (CountDownTimer.this) {
if (mCancelled) {
return;
}
final long millisLeft = mStopTimeInFuture - SystemClock.elapsedRealtime();
if (millisLeft <= 0) {
onFinish();
}
// else if (millisLeft < mCountdownInterval) {
// // no tick, just delay until done
// sendMessageDelayed(obtainMessage(MSG), millisLeft);
// }
else {
long lastTickStart = SystemClock.elapsedRealtime();
onTick(millisLeft);
// take into account user's onTick taking time to execute
long delay = lastTickStart + mCountdownInterval - SystemClock.elapsedRealtime();
// special case: user's onTick took more than interval to
// complete, skip to next interval
while (delay < 0)
delay += mCountdownInterval;
sendMessageDelayed(obtainMessage(MSG), delay);
}
}
}
};
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
呼叫的時候需要傳遞當前TextView，計時毫秒數以及呼叫間隔毫秒數即可，如下：
new com.example.hlqcountdowntimer.weight.CountDownTimer(test, 10000, 1000) {
}.start();
來個圖瞅瞅~
原始碼奉上~
感謝大家觀看~