Android自定义方形验证码输入框

• 效果动图
  

实现思路

• 绘制多个TextView控件用来显示数字
  
• 绘制隐藏EditText用来接收输入法内容(防止部分手机或输入法监听不到内容)
  
• 将EditText的内容显示到TextView中

代码实现

• 自定义控件继承至LinearLayout

public class CodeEditView extends LinearLayout
复制代码

• 绘制多个TextView并绘制方块边框背景用来显示数字

for (int i = 0; i < EditViewNum; i++) {
            TextView textView = new TextView(mContext);
            textView.setBackgroundResource(R.drawable.shape_border_normal);
            textView.setGravity(Gravity.CENTER);
            textView.setTextSize(DensityUtil.sp2px(mContext,textSize));
            textView.getPaint().setFakeBoldText(true);
            textView.setLayoutParams(params);
            textView.setInputType(inputTyte);
            textView.setTextColor(textColor);
            textView.setOnClickListener(this);
            mTextViewsList.add(textView);
            addView(textView);
        }
复制代码

• 绘制EditText并将背景设为透明(不让用户看到,仅用来监听输入法内容,防止部分手机或输入法不兼容)
  

mEditText = new EditText(context);
        mEditText.setBackgroundColor(Color.parseColor("#00000000"));
        mEditText.setMaxLines(1);
        mEditText.setInputType(EditorInfo.TYPE_CLASS_NUMBER);
        mEditText.setFilters(new InputFilter[]{new InputFilter.LengthFilter(EditViewNum)});
        mEditText.addTextChangedListener(this);
        mEditText.setTextSize(0);
        addView(mEditText);
复制代码

• 监听输入法内容进行逻辑处理
  

@Override
    public void beforeTextChanged(CharSequence s, int start, int count, int after) {}
    @Override
    public void onTextChanged(CharSequence s, int start, int before, int count) {}
    @Override
    public void afterTextChanged(Editable s) {
        if (callBack!=null) {
            callBack.afterTextChanged(s.toString());
        }
        if (s.length() <= 1) {
            mTextViewsList.get(0).setText(s);
        } else {
            mTextViewsList.get(mEditText.getText().length() - 1).setText(s.subSequence(s.length() - 1, s.length()));
        }
        if (s.length()==EditViewNum) {
            if (callBack!=null) {
                callBack.input(mEditText.getText().toString());
            }
        }
    }
复制代码

• 当点击TextView时,将EditText获取到焦点并弹出输入法
  

    @Override
    public void onClick(View v) { //TextView点击时获取焦点弹出输入法
        mEditText.setFocusable(true);
        mEditText.setFocusableInTouchMode(true);
        mEditText.requestFocus();
        InputMethodManager imm = (InputMethodManager) mContext.getSystemService(Context.INPUT_METHOD_SERVICE);
        imm.toggleSoftInput(0, InputMethodManager.HIDE_NOT_ALWAYS);
    }
复制代码

Demo地址

• GitHub地址: github.com/lvkaixuan/C…
• CSDN博客地址: blog.csdn.net/lvkaixuan/a…

扫码下载apk