自定义控件起步(四)--自定义验证码(下)

接着上一篇,遗留了几个问题,年分别去解决

1,我们先添加一个自定义属性   验证码的数值类型

      <attr name="security_text_type" format="enum">
            <enum name="number" value="1" />
            <enum name="letter" value="2" />
        </attr>

在布局文件上添加:

        dsecurity:security_text_type="number"

在构造方法中获取这个属性值

security_text_type = typedArray.getString(R.styleable.securitycode_security_text_type);

2.现在已经确定验证码的类型是字母还是数字了,接下来我们为他设置点击 监听

   同样是在构造方法中设置,并让这个类实现OnClickListener

setOnClickListener(this);

   重写onClick方法

       	@Override
	public void onClick(View v) {// 根据随机数来设置验证码
		security_text = getRandomText();//获取随机码
		onMeasure(0, 0);//重新测量
		postInvalidate();//刷新界面
	}

注意:  为什么要重新测量?小写字母和大写字母占的位置不一样  就需要重新测量

3.来看下获取验证码的方法

先创建一个存放验证码的变量并在构造方法中创建对象

         private StringBuffer randomText;

获取验证码

          private int[] defrence = { 65, 97 };//asc码的差值   65是大写的A  97是a
          private String getRandomText() {
		randomText.delete(0, randomText.length());//先清空
  		Random random = new Random();//创建一个Random对象
		for (int i = 0; i < 4; i++) {//循环4次  每次往randomText中添加一个字符
			if (TextUtils.equals("1", security_text_type)) {//如果验证码的类型是1(数字)
				randomText.append(random.nextInt(10));//每次添加一个数字进去
			} else {//不然  类型就是字母    
				char zimu = (char) (random.nextInt(26) + defrence[random
						.nextInt(2)]);
				randomText.append(zimu);
			}
		}
		return randomText.toString();
	}

4.添加一个验证码改变的监听

       public void setOnSecurityClickListener(OnSecurityChangedListener listener) {
		this.listener = listener;
	}

	private OnSecurityChangedListener listener;

	public interface OnSecurityChangedListener {
		void onChanged(String security_text);
	}

在点击事件的onClick方法中调用

          if (listener != null) {// 设置验证码改变的监听
			listener.onChanged(security_text);
		}

5.在MainActivity中 测试一下

         	SecurityCodeView security_code = (SecurityCodeView) findViewById(R.id.security_code);
                security_code.setOnSecurityClickListener(new OnSecurityChangedListener() {
			@Override
			public void onChanged(String security_text) {
			    Toast.makeText(MainActivity.this,"验证码更改为:" + security_text, Toast.LENGTH_SHORT).show();
			}});

6.给这个 布局文件中添加一个editext,并在MainActivity中添加一个文字改变的监听

              editext = (EditText) findViewById(R.id.editext);
        editext.addTextChangedListener(new TextWatcher() {

            @Override
            public void onTextChanged(CharSequence s, int start, int before,
                    int count) {
                if (s.length() == 4) {
                    if (TextUtils.equals(s, security_code.getSecurityCode())) {
                        Toast.makeText(MainActivity.this, "验证码输入正确",
                                Toast.LENGTH_SHORT).show();
                    } else {
                        Toast.makeText(MainActivity.this, "验证码输入错误",
                                Toast.LENGTH_SHORT).show();
                    }
                }
            }
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count,
                    int after) {
            }

            @Override
            public void afterTextChanged(Editable s) {
            }
        });

好了运行一下,看看效果

   

点击这里下载源码