当前位置: 移动技术网 > 移动技术>移动开发>Android > Android自定义View验证码输入框

Android自定义View验证码输入框

2020年06月23日  | 移动技术网移动技术  | 我要评论

本文实例为大家分享了android自定义view验证码输入框的具体代码,供大家参考,具体内容如下

验证码输入框

1.先看下样式

2.直接上代码

public class myvcode extends appcompatedittext {
  private int mfigures = 0;// 验证码个数
  private int mcodemargin = 0;// 验证码之间的间距
  private int mselectcolor = 0;// 选中框的颜色
  private int mnormalcolor = 0;// 普通框的颜色
  private float mborderwidth = 0f;// 边框的厚度

  paint mnormalpaint = new paint();
  paint mselectpaint = new paint();
  paint mokcontentpain = new paint();//填写了内容的验证码

  private onverifycodechangedlistener onverifycodechangedlistener;
  private int mcurrentposition = 0;// 当前验证码的位置
  private int meachrectlength = 0;// 矩形边长
  public myvcode(context context) {
    super(context, null);
  }


  public myvcode(context context, attributeset attrs) {
    super(context, attrs);
    initattr(context,attrs);
    initpaint();
    setfocusableintouchmode(true);
    inittextchangelisterner();
  }

  private void inittextchangelisterner() {
    addtextchangedlistener(new textwatcher() {
      @override
      public void beforetextchanged(charsequence s, int start, int count, int after) {
        mcurrentposition = gettext().length();
      }

      @override
      public void ontextchanged(charsequence s, int start, int before, int count) {
        mcurrentposition = gettext().length();
        postinvalidate();
        if (onverifycodechangedlistener!=null){
          onverifycodechangedlistener.onvercodechanged(gettext().tostring(),start,before,count);
        }
      }

      @override
      public void aftertextchanged(editable s) {
        mcurrentposition = gettext().length();
        postinvalidate();
        if (gettext().length() == mfigures){
          if (onverifycodechangedlistener!=null){
            onverifycodechangedlistener.oninputcompleted(gettext().tostring());
          }
        }else if (gettext().length()>mfigures){
          gettext().delete(mfigures,gettext().length());
        }
      }
    });
  }

  @override
  public boolean ontouchevent(motionevent event) {
    if (event.getaction()==motionevent.action_down){
      requestfocus();
      setselection(gettext().length());
      showkeyboard(getcontext());
      return false;
    }

    return super.ontouchevent(event);

  }

  private void showkeyboard( context context) {
    inputmethodmanager imm = (inputmethodmanager) context.getsystemservice(context.input_method_service);
    imm.showsoftinput(this, inputmethodmanager.show_forced);
  }

  private void initattr(context context, attributeset attrs) {
    typedarray ta = context.obtainstyledattributes(attrs, r.styleable.verifycodeedittext);
    mfigures = ta.getinteger(r.styleable.verifycodeedittext_figures, 6);
    mcodemargin = (int) ta.getdimension(r.styleable.verifycodeedittext_codemargin, 0f);
    mselectcolor = ta.getcolor(r.styleable.verifycodeedittext_selectbordercolor,getresources().getcolor(r.color.base_barcolor));
    mnormalcolor =
        ta.getcolor(
            r.styleable.verifycodeedittext_normalbordercolor,
            getresources().getcolor(android.r.color.darker_gray)
        );
    mborderwidth = ta.getdimension(r.styleable.verifycodeedittext_borderwidth, 1f);

   /* mcursorcolor =
        ta.getcolor(
            r.styleable.verifycodeedittext_cursorcolor,
            getresources().getcolor(android.r.color.darker_gray)
        );
    ta.recycle();*/

   /* // force ltr because of bug: https://github.com/justkiddingbaby/vercodeedittext/issues/4
    if (build.version.sdk_int >= build.version_codes.jelly_bean_mr1) {
      layoutdirection = layout_direction_ltr
    }*/
  }

  private void initpaint() {
    mnormalpaint.setantialias(true);
    mnormalpaint.setcolor(mnormalcolor);
    mnormalpaint.setstyle(paint.style.fill_and_stroke);
    mnormalpaint.setstrokewidth(mborderwidth);

    mselectpaint.setantialias(true);
    mselectpaint.setcolor(mselectcolor);
    mselectpaint.setstyle(paint.style.stroke);
    mselectpaint.setstrokewidth(mborderwidth);


    mokcontentpain.setantialias(true);
    mokcontentpain.setcolor(mselectcolor);
    mokcontentpain.setstyle(paint.style.fill_and_stroke);
    mokcontentpain.setstrokewidth(mborderwidth);
  }

  @override
  protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {
    super.onmeasure(widthmeasurespec, heightmeasurespec);
    int size = measurespec.getsize(heightmeasurespec);
    // 每个矩形的宽度 相当于我门圆的直径
    meachrectlength = size ;

  }

  @override
  protected void ondraw(canvas canvas) {
    //super.ondraw(canvas);
    editable text = this.gettext();
    mcurrentposition = text.length();
    int width = meachrectlength -getpaddingleft() - getpaddingright();

    for (int i =0 ;i< mfigures;i++){
      canvas.save();
      float start = width*i +mcodemargin*i+mborderwidth;
      float end = start+width - mborderwidth;
      if (i==mfigures-1){
        end -= mborderwidth;
      }
      rectf rect = new rectf(start, mborderwidth, end, width - mborderwidth);
      //画底色
      canvas.drawarc(rect, 0f, 360f, true, mnormalpaint);
      if (i == mcurrentposition) {//选中的下一个状态
        canvas.drawarc(rect, 0f, 360f, true, mnormalpaint);
        canvas.drawarc(rect, 0f, 360f, true, mselectpaint);
      }else {
        canvas.drawarc(rect, 0f, 360f, true, mnormalpaint);
      }

      if (mcurrentposition>i){
        //画已经有内容的
        canvas.drawarc(rect, 0f, 360f, true, mokcontentpain);
      }
      canvas.restore();

    }
    string s = text.tostring();

    //画文字
    for (int i = 0;i<mcurrentposition;i++){
      canvas.save();
      int start = width * i + mcodemargin * i;
      float x = start + width / 2f;
      textpaint paint = getpaint();
      paint.settextalign(paint.align.center);
      paint.setcolor(getcurrenttextcolor());
      paint.fontmetrics fontmetrics = paint.getfontmetrics();
      float baseline = (width - fontmetrics.bottom + fontmetrics.top) / 2 - fontmetrics.top;
      canvas.drawtext(s.substring(i,i+1), x, baseline, paint);
      canvas.restore();
    }


  }

  /**
   * 验证码变化时候的监听事件
   */
  interface onverifycodechangedlistener {
    /**
     * 当验证码变化的时候
     */
    public void onvercodechanged(string s,int start, int before, int count);

    /**
     * 输入完毕后的回调
     */
    public void oninputcompleted(string s);
  }


}

3.自定义的属性

<!--验证码的属性-->
  <declare-styleable name="verifycodeedittext">
    <attr name="figures" format="integer"/><!--验证码的个数-->
    <attr name="codemargin" format="dimension"/><!--验证码的之间的间隔-->
    <attr name="selectbordercolor" format="color|reference"/><!--选中的边框颜色-->
    <attr name="normalbordercolor" format="color|reference"/><!--普通的边框颜色-->
    <attr name="borderwidth" format="dimension"/><!--边框的厚度 -->
    <attr name="cursorcolor" format="color|reference"/><!--已经有内容的颜色 -->
</declare-styleable>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持移动技术网。

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网