Android下实现手机验证码

简介: Android实现验证码效果图Github地址地址:https://github.

Android实现验证码

效果图

P1

Github地址

地址:https://github.com/kongqw/Android-CheckView

使用

<kong.qingwei.demo.kqwcheckviewdemo.CheckView
        android:id="@+id/checkView"
        android:layout_width="200dp"
        android:layout_height="50dp"
        kongqw:bg_color="#FFFFFF00"
        kongqw:line_num="10"
        kongqw:point_num="100"
        kongqw:text_length="6"
        kongqw:text_size="30dp" />

设置验证码宽度

android:layout_width="200dp"

设置验证码高度

android:layout_height="50dp"

设置验证码背景颜色

kongqw:bg_color="#FFFFFF00"

设置验证码线的条数

kongqw:line_num="10"

设置验证码点的个数

kongqw:point_num="100"

设置验证码长度

kongqw:text_length="6"

设置验证码字符大小

kongqw:text_size="30dp"

验证码的类

package kong.qingwei.demo.kqwcheckviewdemo;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.widget.Toast;

/**
 * Created by kongqw on 2015/10/23.
 */
public class CheckView extends View {
    Context mContext;
    String mCheckCode = null;
    Paint mTempPaint = new Paint();
    private final int mPointNum;
    private final int mLineNum;
    private final int mTextLength;
    private final float mTextSize;
//    private final int mTextColor;
    private final int mBgColor;

    // 验证码
    public CheckView(Context context, AttributeSet attrs) {
        super(context, attrs);
        mContext = context;

        TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.CheckView);
        // 获取随机点的个数
        mPointNum = a.getInteger(R.styleable.CheckView_point_num, 0);
        // 获取随机线的条数
        mLineNum = a.getInteger(R.styleable.CheckView_line_num, 0);
        // 获取验证码长度
        mTextLength = a.getInteger(R.styleable.CheckView_text_length, 4);
        // 获取验证码字体大小
        mTextSize = a.getDimension(R.styleable.CheckView_text_size, 30);
        // 获取验证码字体颜色
//        mTextColor = a.getColor(R.styleable.CheckView_text_color, 0XFFFFFFFF);
        // 获取背景颜色
        mBgColor = a.getColor(R.styleable.CheckView_bg_color, 0XFFFFFFFF);
        a.recycle();

        mTempPaint.setAntiAlias(true);
        mTempPaint.setTextSize(mTextSize);
        mTempPaint.setStrokeWidth(3);
//        Log.d("CheckView", "point_num = " + mPointNum);
//        Log.d("CheckView", "line_num = " + mLineNum);
//        Log.d("CheckView", "text_length = " + mTextLength);
//        Log.d("CheckView", "text_color = " + mTextColor);
//        Log.d("CheckView", "text_size = " + mTextSize);
//        Log.d("CheckView", "bg_color = " + mBgColor);
    }


    public void onDraw(Canvas canvas) {
        // 生成验证码
        mCheckCode = makeCheckCode();
        // 设置二维码背景色
        canvas.drawColor(mBgColor);

        final int height = getHeight();
        // 获得CheckView控件的高度
        final int width = getWidth();
        // 获得CheckView控件的宽度
        int dx = width / mTextLength / 2;

        char[] checkNum = mCheckCode.toCharArray();
        for (int i = 0; i < mTextLength; i++) {
            // 绘制验证控件上的文本
            canvas.drawText("" + checkNum[i], dx, getPositon(height), mTempPaint);
            dx += width / (mTextLength + 1);
        }
        int[] line;
        for (int i = 0; i < mLineNum; i++) {
            // 划线
            line = getLine(height, width);
            canvas.drawLine(line[0], line[1], line[2], line[3], mTempPaint);
        }
        // 绘制小圆点
        int[] point;
        for (int i = 0; i < mPointNum; i++) {
            // 画点
            point = getPoint(height, width);
            canvas.drawCircle(point[0], point[1], 1, mTempPaint);
        }
    }

    /**
     * 生成新的验证码
     */
    public void invaliChenkCode() {
        invalidate();
    }

    public String getCheckCode() {
        return mCheckCode;
    }

    /**
     * 产生随机验证码
     *
     * @return
     */
    public String makeCheckCode() {
        StringBuffer sb = new StringBuffer();
        for (int i = 0; i < mTextLength; i++) {
            int temp = (int) (Math.random() * 10);
            sb.append(temp);
        }
        return sb.toString();
    }

    /**
     * 计算验证码的绘制y点位置
     *
     * @param height 传入CheckView的高度值
     * @return
     */
    public int getPositon(int height) {
        int tempPositoin = (int) (Math.random() * height);
        if (tempPositoin < 50) {
            tempPositoin += 50;
        }
        return tempPositoin;
    }


    /**
     * 随机产生划线的起始点坐标和结束点坐标
     *
     * @param height 传入CheckView的高度值
     * @param width  传入CheckView的宽度值
     * @return 起始点坐标和结束点坐标
     */
    public static int[] getLine(int height, int width) {
        int[] tempCheckNum = {0, 0, 0, 0};
        for (int i = 0; i < 4; i += 2) {
            tempCheckNum[i] = (int) (Math.random() * width);
            tempCheckNum[i + 1] = (int) (Math.random() * height);
        }
        return tempCheckNum;
    }

    /**
     * 随机产生点的圆心点坐标
     *
     * @param height 传入CheckView的高度值
     * @param width  传入CheckView的宽度值
     * @return
     */
    public static int[] getPoint(int height, int width) {
        int[] tempCheckNum = {0, 0, 0, 0};
        tempCheckNum[0] = (int) (Math.random() * width);
        tempCheckNum[1] = (int) (Math.random() * height);
        return tempCheckNum;
    }
}

测试类

package kong.qingwei.demo.kqwcheckviewdemo;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;


public class MainActivity extends Activity implements View.OnClickListener {
    private CheckView mCheckView;
    private EditText mEditPass;
    private Button mSubmit;
    private Button mRef;
    //     验证码:
    private String mCheckCode = null;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // 初始化控件
        mCheckView = (CheckView) findViewById(R.id.checkView);
        mEditPass = (EditText) findViewById(R.id.checkTest);
        mSubmit = (Button) findViewById(R.id.submit);
        mRef = (Button) findViewById(R.id.ref);
        mSubmit.setOnClickListener(this);
        mRef.setOnClickListener(this);

        // 生成验证码
        mCheckView.invaliChenkCode();
    }

    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.submit:
                if (mEditPass.getText().toString().equals(mCheckView.getCheckCode())) {
                    Toast.makeText(this, "通过", Toast.LENGTH_SHORT).show();
                } else {
                    Toast.makeText(this, "未通过", Toast.LENGTH_SHORT).show();
                }
                break;
            case R.id.ref:
                // 生成新的验证码
                mCheckView.invaliChenkCode();
                break;
            default:
                break;
        }
    }
}

XML布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:kongqw="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <kong.qingwei.demo.kqwcheckviewdemo.CheckView
        android:id="@+id/checkView"
        android:layout_width="200dp"
        android:layout_height="50dp"
        kongqw:bg_color="#FFFFFF00"
        kongqw:line_num="10"
        kongqw:point_num="100"
        kongqw:text_length="6"
        kongqw:text_size="30dp" />

    <EditText
        android:id="@+id/checkTest"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="请出入验证码" />

    <Button
        android:id="@+id/submit"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="验证" />

    <Button
        android:id="@+id/ref"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="换一张" />

</LinearLayout>
相关文章
|
5月前
|
网络协议 Android开发 数据安全/隐私保护
Android手机上使用Socks5全局代理-教程+软件
Android手机上使用Socks5全局代理-教程+软件
4653 2
|
3月前
|
JavaScript NoSQL Redis
Vue中实现修改邮箱、手机号等流程的大致过程、验证码由后端的redis生成验证(版本1.0)
这篇文章记录了在Vue中实现修改手机号和邮箱的大致流程,包括使用过滤器部分隐藏展示的手机号和邮箱,以及通过点击触发路由跳转的便捷方式。文章还描述了旧号码和新号码验证的界面实现,其中验证码由后端生成并通过弹窗展示给用户,未来可以接入真正的手机验证码接口。此外,还提供了修改邮箱的页面效果截图,并强调了学习是一个永无止境的过程。
Vue中实现修改邮箱、手机号等流程的大致过程、验证码由后端的redis生成验证(版本1.0)
|
21天前
|
安全 搜索推荐 Android开发
Android vs. iOS:解锁智能手机操作系统的奥秘####
【10月更文挑战第21天】 在当今这个数字化时代,智能手机已成为我们生活中不可或缺的伙伴。本文旨在深入浅出地探讨两大主流操作系统——Android与iOS的核心差异、优势及未来趋势,帮助读者更好地理解这两个平台背后的技术哲学和用户体验设计。通过对比分析,揭示它们如何塑造了我们的数字生活方式,并展望未来可能的发展路径。无论您是技术爱好者还是普通用户,这篇文章都将带您走进一个充满创新与可能性的移动世界。 ####
40 3
|
1月前
|
Ubuntu Linux Android开发
termux+anlinux+Rvnc viewer来使安卓手机(平板)变成linux服务器
本文介绍了如何在Android设备上安装Termux和AnLinux,并通过这些工具运行Ubuntu系统和桌面环境。
123 2
termux+anlinux+Rvnc viewer来使安卓手机(平板)变成linux服务器
|
1月前
|
Web App开发 Android开发
利用firefox调试安卓手机端web
该教程详细介绍如何通过Firefox浏览器实现手机与电脑的远程调试。手机端需安装最新版Firefox,并按指定步骤设置完成;电脑端则需安装15版及以上Firefox。设置完成后,通过工具栏中的“远程调试”选项,输入手机IP地址即可连接。连接确认后,即可使用电脑端Firefox调试器调试手机上的Web信息。注意,调试前手机需提前打开目标网页。
64 2
|
5月前
|
存储 小程序 前端开发
【微信小程序 - 工作实战分享】1.微信小程序发送手机短信验证码(阿里云)
【微信小程序 - 工作实战分享】1.微信小程序发送手机短信验证码(阿里云)
473 0
|
24天前
|
Android开发 iOS开发 UED
安卓与iOS的较量:谁才是智能手机市场的王者?
本文将深入探讨安卓和iOS两大智能手机操作系统之间的竞争关系,分析它们各自的优势和劣势。通过对比两者在市场份额、用户体验、应用生态等方面的表现,我们将揭示出谁才是真正的市场领导者。无论你是安卓粉丝还是iOS忠实用户,这篇文章都将为你提供一些有趣的观点和见解。
|
1月前
|
数据采集 消息中间件 API
Python爬虫验证码识别——手机验证码的自动化处理
Python爬虫验证码识别——手机验证码的自动化处理
|
3月前
|
存储 NoSQL Java
使用redis进行手机验证码的验证、每天只能发送三次验证码 (redis安装在虚拟机linux系统中)
该博客文章展示了如何在Linux虚拟机上使用Redis和Jedis客户端实现手机验证码的验证功能,包括验证码的生成、存储、验证以及限制每天发送次数的逻辑,并提供了测试结果截图。
使用redis进行手机验证码的验证、每天只能发送三次验证码 (redis安装在虚拟机linux系统中)
|
3月前
|
存储 监控 开发工具
Django 后端架构开发:手机与邮箱验证码接入、腾讯云短信SDK和网易邮箱
Django 后端架构开发:手机与邮箱验证码接入、腾讯云短信SDK和网易邮箱
63 0