今天给大家带来一个新的控件——验证码倒计时,先看下效果图
1 效果演示
2 使用方式
<com.landptf.view.CountDownM
android:id="@+id/cdm_identifying_code"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_alignParentRight="true"
android:text="获取验证码"
landptf:backColor="@color/colorPrimary"
landptf:countDownSeconds="10"/>
CountDownM cdmIdentifyingCode = (CountDownM) findViewById(R.id.cdm_identifying_code);
if (cdmIdentifyingCode != null) {
cdmIdentifyingCode.setOnClickListener(new CountDownM.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(CountDownMTestActivity.this, "验证码发送成功", Toast.LENGTH_SHORT).show();
}
});
}
以上几行代码即可实现倒计时的功能,这里面我们可以设置背景色以及倒计时的总时长。
3 实现方法
/**
* Created by landptf on 2017/03/15.
* 获取验证码倒计时控件
*/
public class CountDownM extends ButtonM {
private OnClickListener onClickListener = null;
private CountDownTimer countDownTimer;
/**
* 倒计时总时长
*/
private int countDownSeconds = 60;
/**
* 按钮的背景色
*/
private int backColor = 0;
public interface OnClickListener{
void onClick(View v);
}
public CountDownM(Context context) {
this(context, null);
}
public CountDownM(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public CountDownM(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.countDownM, defStyle, 0);
if (a != null) {
//设置背景色
ColorStateList colorList = a.getColorStateList(R.styleable.countDownM_backColor);
if (colorList != null) {
backColor = colorList.getColorForState(getDrawableState(), 0);
if (backColor != 0) {
setBackColor(backColor);
}
} else {
setBackColor(getResources().getColor(R.color.mainColor));
}
//获取倒计时总时长
int countDownSeconds = a.getInteger(R.styleable.countDownM_countDownSeconds, 60);
setCountDownSeconds(countDownSeconds);
a.recycle();
}
//设置文字颜色
setTextColor(getResources().getColor(android.R.color.white));
//设置位置相关属性
setGravity(Gravity.CENTER);
setPadding(ConvertM.dp2px(context, 8), 0, ConvertM.dp2px(context, 8), 0);
setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (onClickListener != null) {
onClickListener.onClick(v);
}
//点击后开始计时
start();
}
});
}
/**
* 设置倒计时总时长
* @param countDownSeconds
*/
public void setCountDownSeconds(int countDownSeconds){
this.countDownSeconds = countDownSeconds;
}
/**
* 设置背景色
* @param backColor
*/
@Override
public void setBackColor(int backColor) {
this.backColor = backColor;
super.setBackColor(backColor);
}
/**
* 停止倒计时
*/
public void stop(){
countDownTimer.cancel();
resetButton();
}
public void setOnClickListener(OnClickListener l){
this.onClickListener = l;
}
private void start(){
setEnabled(false);//设置不能点击
countDownTimer = new CountDownTimer(countDownSeconds * 1000, 1000) {
@Override
public void onTick(long millisUntilFinished) {
setText(millisUntilFinished / 1000 + getResources().getString(R.string.count_down_m_recapture_after));//设置倒计时时间
//设置按钮为灰色,这时是不能点击的
CountDownM.super.setBackColor(Color.GRAY);
Spannable span = new SpannableString(getText().toString());//获取按钮的文字
span.setSpan(new ForegroundColorSpan(Color.RED), 0, 2, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);//讲倒计时时间显示为红色
setText(span);
}
@Override
public void onFinish() {
resetButton();
}
};
countDownTimer.start();
}
private void resetButton(){
setText(getResources().getString(R.string.count_down_m_recapture));
setEnabled(true);//重新获得点击
if (backColor != 0) {
setBackColor(backColor);//还原背景色
} else {
setBackColor(getResources().getColor(R.color.mainColor));//还原背景色
}
}
}
代码比较短,这里面继承了ButtonM,有不了解的可以看一下我之前的博客
Android自定义控件系列(一)—Button七十二变
全部代码已托管到开源中国的码云上,欢迎下载,地址:https://git.oschina.net/landptf/landptf.git