『Android』一个简单易用的验证码输入框(6位)


spaceX.jpg

  之前开发中验证码输入的时候,找了各种各样的验证码输入框,各种奇葩= =,最近抽空写了一个,正好熟悉一下自定义控件。

github 地址:https://github.com/ymwm-lxl/VerificationCodeEditText

一、实现思路:

之前在看其他人的之前方式,大概有以下几类:

  • 监听键盘输入内容,将内容存入 StringBuffer 或者集合中,界面上使用多个 TextView 展示数据。
  • 前边放置多个 EditText ,通过控制切换,实现验证码输入。
  • 后边使用一个 EditText 接收输入内容,在页面上放置多个 TextView 展示输入框中输入的内容。

  我使用的就是最后一种:后边使用一个 EditText 接收输入内容,在页面上放置多个 TextView 展示输入框中输入的内容。

二、实现代码

null

三、使用方法

1、导入依赖:

在根目录 build.build中加入:

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}

添加依赖:

dependencies {
        implementation 'com.github.ymwm-lxl:VerificationCodeEditText:1.0'
}

因为其中显示的光标我使用的是动图,所以还需要引入 glide 的依赖:

    //glide
    implementation 'com.github.bumptech.glide:glide:4.8.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.8.0'

2、使用控件:

xml文件中:

    
     
2.1、属性说明:
属性 说明 备注
android:layout_width 控件宽度 dp
android:layout_height 控件高度 dp
app:codeTextColor 验证码输入框中的文字颜色 color
app:codeTextSize 验证码输入框中的文字大小 sp
app:codeTextBackgroud 验证码输入框的单个框的背景样式 drawable文件
app:codeCursorImg 光标图片 gif图
app:codeCursorHeight 光标高度 dp
2.2、控件说明:
2.2.1、请根据上方备注中的格式来走,不要创新使用= =。
2.2.2、属性的默认值很夸张,是希望使用的时候能够尽量使用自己的样式。
2.2.3、输入框背景样式:

a> 下边线样式:


线框背景.png

xml文件内容:




    
        
            
          
    

b> 四周都有框样式:


四周都有框.png

xml文件内容:



    
        
            
            
        
    

2.2.4、光标样式:

建议使用 gif 图片,在控件中可以设置光标的高度,光标在输入框中上下居中。效果图片:


光标.gif

四、未来会加入的功能

  • 输入内容指定。
  • 背景样式支持直接使用颜色。
  • 光标改为动画实现。

有需要的功能或者使用中遇到问题,可以留言或者发邮件给我:
邮箱:[email protected]


你可能感兴趣的:(『Android』一个简单易用的验证码输入框(6位))