时间:2021-05-20
开发过程中会遇见很多app注册时,需要通过手机发送验证码验证 ,这是可以封装一个验证码按钮:
attrs.xml
<?xml version="1.0" encoding="utf-8"?><resources> <declare-styleable name="VerifyCodeButton"> <!--默认背景--> <attr name="android:background" /> <!--点击后背景--> <attr name="clickedBackground" format="reference" /> <!--倒计时间--> <attr name="countdownTime" format="integer" /> <!--倒计时间后提示文字--> <attr name="countdownText" format="string" /> </declare-styleable></resources>自定义Button
public class VerifyCodeButton extends Button { private Context mContext; private int mClickedBackground;//点击后背景 private int mBackground;//当前背景 private String mCountdownownText; private int mCountdownTime = 60; private TimeCount mTimeCount; public VerifyCodeButton(Context context) { this(context, null); } public VerifyCodeButton(Context context, AttributeSet attrs) { this(context, attrs, android.R.attr.buttonStyle); } public VerifyCodeButton(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); mContext = context; initAttrs(attrs); init(); } private void initAttrs(AttributeSet attrs) { TypedArray typedArray = mContext.obtainStyledAttributes(attrs, R.styleable.VerifyCodeButton); mBackground = typedArray.getResourceId(R.styleable.VerifyCodeButton_android_background, mBackground); mClickedBackground = typedArray.getResourceId(R.styleable.VerifyCodeButton_clickedBackground, mClickedBackground); mCountdownTime = typedArray.getInt(R.styleable.VerifyCodeButton_countdownTime, mCountdownTime); mCountdownownText = typedArray.getString(R.styleable.VerifyCodeButton_countdownText); typedArray.recycle(); } private void init() { setBackgroundResource(mBackground); mTimeCount = new TimeCount(mCountdownTime * 1000, 1000); } /** * 开始计时 */ public void start() { mTimeCount.start(); } /** * 取消计时 */ public void cancle() { mTimeCount.cancel(); setClickable(true); setText(mCountdownownText != null ? mCountdownownText : ""); setBackgroundResource(mBackground); } class TimeCount extends CountDownTimer { /** * @param millisInFuture 总时间 * @param countDownInterval 间隔时间 */ public TimeCount(long millisInFuture, long countDownInterval) { super(millisInFuture, countDownInterval); } /** * @param millisUntilFinished 当前时间 */ @Override public void onTick(long millisUntilFinished) { setClickable(false); setText(String.valueOf(millisUntilFinished / 1000 + "s")); setBackgroundResource(mClickedBackground); } @Override public void onFinish() { setClickable(true); setText(mCountdownownText != null ? mCountdownownText : ""); setBackgroundResource(mBackground); } }}自定义2个drawable
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <corners android:radius="5dp" /> <solid android:color="#feacc3" /></shape><?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <corners android:radius="5dp" /> <solid android:color="#999999" /></shape>layout.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="com.sample.verify.MainActivity"> <com.sample.verify.widget.VerifyCodeButton android:id="@+id/btn_verify_code" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_margin="10dp" android:background="@drawable/bg_btn_default" android:gravity="center" android:text="获取验证码" android:textColor="#ffffff" android:textSize="14sp" app:clickedBackground="@drawable/bg_btn_clicked" app:countdownText="重新获取" app:countdownTime="10" /> <Button android:id="@+id/btn_cancle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:text="取消倒计时" /></LinearLayout>Activity
package com.sample.verify;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.view.View;import android.widget.Button;import com.sample.verify.widget.VerifyCodeButton;public class MainActivity extends AppCompatActivity implements View.OnClickListener { private VerifyCodeButton btn_verify_code; private Button btn_cancle; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); setTitle("验证码"); btn_verify_code = (VerifyCodeButton) findViewById(R.id.btn_verify_code); btn_cancle = (Button) findViewById(R.id.btn_cancle); btn_verify_code.setOnClickListener(this); btn_cancle.setOnClickListener(this); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.btn_verify_code: btn_verify_code.start(); break; case R.id.btn_cancle: btn_verify_code.cancle(); break; } } @Override protected void onDestroy() { super.onDestroy(); if (btn_verify_code != null) { btn_verify_code.cancle(); } }}代码下载:android实现验证码按钮
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文首先分析手机发送验证码的原理,再对javascript发送短信验证码予以实现,具体思路如下:实现点击“发送验证码”按钮后,按钮依次显示为“59秒后重试”、“
1.具体思路点击获取验证码按钮—>调用获取验证码接口(忽略)—>获取验证码按钮切换到不可点击状态,按钮背景色呈灰色,按钮文字呈现为“倒计时秒数+后可重新获取”—
两种验证码验证实现,一种直接在form表单提交按钮实现验证,一种使用ajax传递参数实现验证:1、直接在form表单提交按钮实现验证,在控制器VerifyCon
场景:注册账号页面时,我们点击按钮发送验证码,在等待验证码时,界面会有倒计时提示,这此期间按钮不可点击。当倒计时结束时,按钮恢复。实现与功能都不难,这次用RxB
本文实例为大家分享了js实现随机五位数验证码的具体代码,供大家参考,具体内容如下功能展示:点击按钮,随机生成数字+大小写字母验证码所有代码:随机生成验证码/*验