这篇文章主要为大家分享了功能强大的登录界面机器人实现代码，验证码制作方法，自带一键删除功能，用户名密码为空时抖动提示效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
前言
一个好的应用需要一个有良好的用户体验的登录界面，现如今，许多应用的的登录界面都有着用户名，密码一键删除，用户名，密码为空提示，以及需要输入验证码的功能。看着csdn上的大牛们的文章，心里想着也写一个登录界面学习学习，许多东西都是参考别的文章，综合起来的。废话少说，接下来看看是如何实现的。
ps:由于懒得抠图。所以程序的图标很难看。
程序运行时的图示：
首先是布局文件没有什么难度。
相对布局xmlns:Android=' http://模式。安卓。' com/apk/RES/Android '
xmlns:tools=' http://模式。安卓。' Android:layout _ width=' match _ parent '
Android:layout _ height=' match _ parent ' Android:padding left=' @ dimen/activity _ horizontal _ margin '
Android:padding right=' @ dimen/activity _ horizontal _ margin '
Android:padding top=' @ dimen/activity _ vertical _ margin '
Android:padding bottom=' @ dimen/activity _ vertical _ margin ' tools:context=' .主要活动'
图像视图
android:id='@ id/tv_login '
Android:src=' @ drawable/IC _ launcher '
Android:layout _ width=' match _ parent '
Android:layout _ height=' wrap _ content '
Android:layout _ alignParentTop=' true '
安卓：重力='中心'
/
com。举例。管理员。文本测试。deletableedittext
android:id='@ id/tv_user '
Android:layout _ width=' match _ parent '
Android:layout _ height=' wrap _ content '
android:textSize='30dp '
Android:layout _ below=' @ id/TV _ log in '
Android:drawable left=' @ drawable/IC _ launcher '
Android:drawable right=' @ drawable/IC _ launcher '
android:hint='请输入账户'
android:ems='10'/
com。举例。管理员。文本测试。deletableedittext
android:id='@ id/tv_psd '
Android:layout _ width=' match _ parent '
Android:layout _ height=' wrap _ content '
android:textSize='30dp '
Android:layout _ below=' @ id/TV _ user '
Android:drawable left=' @ drawable/IC _ launcher '
Android:drawable right=' @ drawable/IC _ launcher '
android:hint='请输入密码'
Android:inputType='文本密码'
android:ems='10'/
线性布局
android:id='@ id/lyYanzhengma '
安卓：方向='水平'
Android:layout _ width=' match _ parent '
Android:layout _ height=' wrap _ content '
Android:layout _ below=' @ id/TV _ PSD '
线性布局
android:id='@ id/lyVerify '
安卓：方向='水平'
Android:layout _ width=' wrap _ content '
Android:layout _ height=' wrap _ content '
文本视图
android:id='@ id/tvHideA '
android:layout_width='70dp '
android:layout_height='70dp '
安卓系统：可见性="消失"
安卓：重力='中心'
android:textSize='30dp '
/
文本视图
android:id='@ id/tvHideB '
android:layout_width='70dp '
android:layout_height='70dp '
安卓系统：可见性="消失"
安卓：重力='中心'
android:textSize='30dp '
/
文本视图
android:id='@ id/tvHideC '
android:layout_width='70dp '
android:layout_height='70dp '
安卓系统：可见性="消失"
安卓：重力='中心'
android:textSize='30dp '
/
文本视图
android:id='@ id/tvHideD '
android:layout_width='70dp '
android:layout_height='70dp '
安卓系统：可见性="消失"
安卓：重力='中心'
android:textSize='30dp '
/
/线性布局
线性布局
android:id='@ id/IV_num '
安卓：方向='水平'
Android:layout _ width=' wrap _ content '
Android:layout _ height=' wrap _ content '
图像视图
android:layout_height='70dp '
android:layout_width='50dp '
android:id='@ id/ivNumA'/
图像视图
android:layout_height='70dp '
android:layout_width='50dp '
Android:id=' @ id/iv号'/
图像视图
android:layout_height='70dp '
android:layout_width='50dp '
android:id='@ id/ivNumC'/
图像视图
android:layout_height='70dp '
android:layout_width='50dp '
Android:id=' @ id/ivn number '/
/线性布局
线性布局
安卓：方向='水平'
Android:layout _ height=' wrap _ content '
Android:layout _ width=' match _ parent '
编辑文本-编辑文字
Android:layout _ height=' wrap _ content '
android:layout_width='120dp '
android:textSize='30dp '
android:id='@ id/etCheck '
android:maxLength='4 '
android:singleLine='true '
安卓系统：提示='验证码'/
文本视图
Android:layout _ height=' wrap _ content '
Android:layout _ width=' wrap _ content '
安卓系统：文本='结果'我不知道
android:id='@ id/tvCheck '
android:textSize='30dp '
安卓系统：能见度='离开'/
/线性布局
/线性布局
按钮(按钮)
android:id='@ id/bt_login '
安卓系统：文本='登录'我不知道
android:textSize='30dp '
Android:layout _ below=' @ id/lyyanzheng ma '
Android:layout _ width=' match _ parent '
Android:layout _ height=' wrap _ content '/
/相对布局-相对配置
然后是加载一些布局文件，和一些控件的初始化
//登录按钮
私有按钮btlogin
//账户
私有删除编辑文本用户编辑文本：
//密码
private deltableedittext PSD editxt；
//验证码的数字文本
私人文本视图tvHideA，tvHideB，tvHideC，tvhided
//验证码的图片文本
私人影像检视ivNumA、iv num、ivNumC、ivnumd
//验证码输入文本
私人编辑文本和检查：
//验证码的检测显示文本
私有文本视图tvcheck
//存储每个验证码的数字
num strtmp='；
//存储整个验证码的数字
私有字符串编号str='；
//存储验证码的数组
private int[]num array=new int[4]；
//存储颜色的数组
private int[]color array=new int[6]；
@覆盖
受保护的void oncreate(bundle savedinstancestates)}
超级oncreate(savedinstancestat):
设置内容视图(请参阅layout.activity_main):
设置视图()；
}
私有void设置视图()>
Bt log in=(button)findviewbyid(r . id。Bt _登录)；
Bt登录。setncicklistener(new onclicklisterimpl())；
useredittext=(deltableedittext)findviewbyid(r . id。TV _ user)；
PSD edit text=(deltableedittext)findviewbyid(r . id。TV _ PSD)；
tvhidea=(文本视图)findviewbyid(r . tvhidea id)；
tvhideb=(文本视图)findviewbyid(r . tvhideb id)；
tvhidec=(文本视图)findviewbyid(r . tvhidec id)；
tvhided=(文本视图)findviewbyid(r . id。tvhided)；
iv numa=(imageview)findviewbyid(r . id。ivnuma)；
ivnumber=(图像视图)findviewbyid(r . id。iv number)；
ivn UMC=(imageview)findviewbyid(r . id。ivn UMC)；
ivn UMD=(imageview)findviewbyid(r . id。ivn UMD)；
伊夫努马。setncicklistener(new onclicklisterimpl())；
iv number。setncicklistener(new onclicklisterimpl())；
ivnumc。setncicklistener(new onclicklisterimpl())；
ivnumd。setncicklistener(new onclicklisterimpl())；
tvcheck=(文本视图)findviewbyid(r . id。TV check)；
etcheck=(edit text)findviewbyid(r . id。et检查)；
setnum()；
自定义编辑文本-编辑文字的实现过程：
思路：美元设置两个eidttext(地名文本),在这个编辑文本-编辑文字中各设置图标。左边图标为账户和密码的图标提示，右边图标为一键删除。因为编辑文本-编辑文字中的图标没有onClick先生事件，为了实现点击一键删除效果所以要使用本顿切文特文特文特文特文特文特文特文特文特文特文特文特文特文特文特文特文特文特文特文特文特文特文回调方法，监听点击事件来判断实现一键删除。当账户和密码没有字符时，右边的一键删除图标设置隐藏，当有字符时，设置图标显示。当点击到右边图标范围时，删除所在行的字符。从而实现一键删除。此外，当账户和密码为空而要登录时。这两行抖动提示。
废话不多说，直接上代码注释很清楚。
包com。举例。管理员。文本部分：
导入Android . content . content:
导入安卓。图形。可画的。可绘制；
导入android.text。可编辑：
导入安卓。文字。文本观察者
导入android.util.AttributeSet:
导入android.view.MotionEvent:
导入安卓。查看。视角
导入安卓。查看。动画。动画：
导入安卓。查看。动画。cycline INTERPOL
导入安卓。查看。动画。翻译动画；
导入安卓。小部件。编辑文本；
/**
*由管理员于2015-10-10创建。
*/
公共类DeletableEditText扩展编辑文本{
private Drawable mRightDrawable
私有布尔isHasFocus
公共DeletableEditText(上下文上下文){
这(上下文，空);
}
公共DeletableEditText(上下文上下文，属性集属性){
这个（语境，属性，安卓106 . r . attr。edittextstyle)；
}
public DeletableEditText(Context Context，AttributeSet attrs，int defStyleAttr) {
super(context，attrs，defStyleAttr)；
设置视图()；
}
私有void setupViews() {
//取的视角的上下左右边距
drawable[]drawables=this。getcompoundrawables()；
//取得正确位置的可拉的
//即我们在布局文件中设置的android:drawableRight
mRightDrawable=drawables[2]；
//设置焦点变化的监听
这个。setonfocuschangelistener(new FocusChangeListenerImpl())；
//设置编辑文本文字变化的监听
这个。addtextchangedlistener(new textwatcheripl())；
//初始化时让右边干净的图标不可见
setClearDrawableVisible(false)；
}
@覆盖
公共布尔onTouchEvent(运动事件事件){
switch (event.getAction()) {
//当点击松开时判断点击的位置。这里只进行了X轴方向的判断。
案例运动事件。行动_行动：
//判断是否点击到了右边的图标区域
布尔是干净的=(事件。getx()(getWidth()-gettotalpadding right()))
(事件。getx()(getWidth()-get padding right())；
if (isClean) {
//清除字符
setText(" ")；
}
打破；
默认值：
打破；
}
返回super.onTouchEvent(事件);
}
私有类FocusChangeListenerImpl实现OnFocusChangeListener {
@覆盖
public void onFocusChange(视图v，布尔型hasFocus) {
isHasFocus=hasFocus
if (isHasFocus) {
布尔isVisible=getText().toString().length()=1；
setClearDrawableVisible(可见)；
}否则{
setClearDrawableVisible(false)；
}
}
}
//当输入结束后判断是否显示右边干净的的图标
私有类TextWatcherImpl实现TextWatcher {
@覆盖
公共void afterTextChanged(可编辑的s) {
//当有字符时为真实的
布尔isVisible=getText().toString().length()=1；
//显示右边的图标
setClearDrawableVisible(可见)；
}
@覆盖
textchanged(char sequence s，int start，int count，
int after) {
}
@覆盖
public void onTextChanged(char sequence s，int start，int before，
int count) {
}
}
//隐藏或显示右边干净的的图标
受保护的void setClearDrawableVisible(布尔isVisible) {
右可画
如果（可见){
rightDrawable=mRightDrawable
}否则{
rightDrawable=null
}
//使用代码设置该控件正确处的图标
setcompoundrawables(getcompoundrawables()[0]，
getcompoundrawables()[1]，rightDrawable，
getcompoundrawables()[3])；
}
//显示动画
public void setShakeAnimation() {
这个。开始动画(摇动动画(5))；
}
//循环时间动画重复的次数
公共动画shakeAnimation(int CycleTimes) {
//设置偏移动画其中新的TranslateAnimation(0，10，0，10)四个值表示为X坐标从0 - 10，Y坐标从0 - 10
animation translate animation=new translate animation(0，10，0，10)；
//设置动画次数
翻译动画。设置插值器(新的周期内插器(周期时间))；
//设置动画间隔
翻译动画。设置持续时间(1000)；
返回翻译形象化
}
}
其中需要注意的知识：
1.drawable[]drawables=this。getcompoundrawables()；得到此视角的可画的getCompoundDrawables()方法得到的有四个可拉的对象，分别对应此视角的左，上，右，下的边距
2 .布尔是干净的=(事件。getx()(getWidth()-get total padding right())(事件。getx()(getWidth()-get padding right())；判断点击的区域是否为右边图标范围。其中event.getX()为点击的位置的X坐标大小。详细如下图所示：
3 . animation translate animation=new translate animation(0，10，0，10)；设置偏移动画其中新的TranslateAnimation(0，10，0，10)四个值表示为X坐标从0 - 10，Y坐标从0 - 10
4 .这个。setonfocuschangelistener(new FocusChangeListenerImpl())；设置焦点变化的目的是为了更人性化。当焦点在此行并且有字符时才显示一键删除图标。不在此行时图标隐藏。
5 .这个。addtextchangedlistener(new textwatcheripl())；设置文本变化监听新的TextWatcher{}中有3个方法。分别是：
1).文本更改前的公共void(char sequence s，int start，int count，int after) {}
2).public void ontext已更改(char sequence s，int start，int before，int count) {}
3).public void afterTextChanged(可编辑的s) {}
我们只需要在文本更改后(){可编辑的s}{}中添加要实现的方法即可。当监听到文本变化时，设置右边图标显示。
TextWatcher {
@覆盖
公共void afterTextChanged(可编辑的s) {
//当有字符时为真实的
布尔isVisible=getText().toString().length()=1；
//显示右边的图标
setClearDrawableVisible(可见)；
}
验证码的实现过程：
思路：设置四个图像视图。首先随机生成四个10以内的数字存储在数组里。并且记录整个验证码。在利用位图。创建位图方法讲这四个数字转化为图片并且设置随机颜色。每个数字图片转化的时候在随机设置旋转角度使这四个数字图标倾斜一定的角度。验证码就生成了。
验证验证码的过程只是模拟下：将输入的验证码跟记录的验证码作比较。相同提示正确，不同提示错误。并且重置验证码。
点击验证码图片区域也会重置验证码。
代码的注释很详细。上代码~~~~:
包com。举例。管理员。文本测试；
导入安卓。图形。位图；
导入安卓。图形。画布；
导入安卓。图形。颜色；
导入安卓。图形。矩阵；
导入安卓。支持。V7。app。app compat活动；
导入安卓。OS。捆绑；
导入安卓。文字。文本实用程序；
导入安卓。查看。菜单；
导入安卓。查看。菜单项；
导入安卓。查看。查看；
导入安卓。小部件。按钮；
导入安卓。小部件。编辑文本；
导入安卓。小部件。imageview
导入安卓。小部件。textview
导入安卓。小部件。敬酒；
导入Java。util。随机；
公共类主要活动扩展AppCompatActivity {
//登录按钮
私有按钮btLogin
//账户
private DeletableEditText userEditText；
//密码
private DeletableEditText PSD edittext；
//验证码的数字文本
私有文本视图tvHideA，tvHideB，tvHideC，tvHideD
//验证码的图片文本
私有ImageView ivNumA、ivnum、ivNumC、ivNumD
//验证码输入文本
私有编辑文本蚀刻
//验证码的检测显示文本
私有TextView tvCheck
//存储每个验证码的数字
私有字符串numStrTmp=
//存储整个验证码的数字
私有字符串numStr=
//存储验证码的数组
private int[]numArray=new int[4]；
//存储颜色的数组
private int[]color array=new int[6]；
@覆盖
受保护的void onCreate(Bundle saved instancestate){
超级棒。oncreate(savedInstanceState)；
setContentView(r . layout。活动_主)；
设置视图()；
}
私有void setupViews() {
Bt log in=(Button)findViewById(r . id。Bt _登录)；
btlogin。setonclicklistener(new onclicklistener impl())；
userEditText=(DeletableEditText)findViewById(r . id。TV _ user)；
psdEditText=(DeletableEditText)findViewById(r . id。TV _ PSD)；
tvHideA=(TextView)findViewById(r . id。tvHideA)；
tvHideB=(TextView)findViewById(r . id。tvHideB)；
tvHideC=(TextView)findViewById(r . id。tvHideC)；
tvHideD=(TextView)findViewById(r . id。tvHideD)；
iv numa=(imageview)findviewbyid(r . id。ivnuma)；
ivnumber=(图像视图)findviewbyid(r . id。iv number)；
ivn UMC=(imageview)findviewbyid(r . id。ivn UMC)；
ivn UMD=(imageview)findviewbyid(r . id。ivn UMD)；
伊夫努马。setncicklistener(new onclicklisterimpl())；
iv number。setncicklistener(new onclicklisterimpl())；
ivnumc。setncicklistener(new onclicklisterimpl())；
ivnumd。setncicklistener(new onclicklisterimpl())；
tvcheck=(文本视图)findviewbyid(r . id。TV check)；
etcheck=(edit text)findviewbyid(r . id。et检查)；
setnum()；
}
私有void setnum()>
初始化编号()；
tvhidea。settext(' num array[0])；
tvhidea。settext color(ranm color())；
tvhideb。settext(' num array[1])；
tvhideb。settext color(ranm color())；
tvhidec。settext(" num array[2])；
tvhidec。settext color(ranm color())；
tvhided。settext(' num array[3])；
tvhided。settext color(ranm color())；
matrix matrix a=new matrix()；
//重设矩阵
matrix a . reset()；
matrix a . set rotate(randomle())；
bmNumA位图=位图。创建位图(getbitmapfromview(tvhidea，20，50)，0，20，50，matrixA，true)；
伊夫努马。setmagebitmap(bmnuma)；
matrix matrix b=new matrix()；
//重设矩阵
矩阵b . reset()；
matrix b . set rotate(random mangle())；
位图BM number=位图。创建位图(getbitmapfromview(tvhideb，20，50)，0，20，50，matrixB，true)；
ivnumber。setmagebitmap(BM number)；
matrix matrix c=new matrix()；
//重设矩阵
matrix c . reset()；
matrix c . set rotate(randomle())；
bmNumC位图=位图。创建位图(getbitmapfromview(tvhidec，20，50)，0，20，50，matrixC，true)；
ivnumc。setmagebitmap(bmnumc)；
矩阵matrix matrix d=new matrix()；
//重设矩阵
matrixD.reset():
matrix d . set rotate(random mangle())；
bmNumD位图=位图。创建位图(getbitmapfromview(tvhided，20，50)，0，20，50，matrixD，true)；
ivnumd。setmagebitmap(bmnumd)；
}
getBitmapFromView私有位图(视图v、int width、int height)>
int widSpec=视图100 . measure spec。makemameasurespec(宽度、视图)。精确测量规格：
int heispec=视图100 . measure spec。makemameasurespec(高度、视图)。精确测量规格：
//重新绘制图片大小
五。测量(widSpec、heisenpec)；
//
五。布局(0.0、宽度、高度);
位图=位图。创建位图(宽度，高度，位图).组态ARGB_8888:
//画出图片
画布canvas=新画布(位图);
五。绘制（画布);
返回位图；
}
//设置随机倾斜的角度
private int randolmangle()=>
return 20*(新随机()。nextint(5)新随机()。nextint(3))；
}
//随机生成颜色
private int ranmcolor()>
颜色数组[0]=0x ff 000000；//布莱克
颜色数组[1]=0 xfffff 00 ff；//洋红色
颜色数组[2]=0 xfffff 0000；//网络
颜色数组[3]=0 xff 00 ff 00；//绿色(绿色)
颜色数组[4]=0x ff 0000 ff；//蓝色
颜色数组[5]=0 xff 00 ffff；//青色
int randomcoloid=new random().nextint(5)；
返回颜色数组[随机颜色id]；
}
//初始化验证码
私有void初始化编号()
# str='；
num strtmp='；
for(int I=0)；我排列。长度；>
//随机生成10以内数字
int numIntTmp=new Random().nextint(10)；
//保存各个验证码
numstrtmp=string。(numinttmp)的值；
//保存整个验证码
numstr=numstr numstrtmp:
S7-1200可编程控制器：
}
}
私有类onclicklistenerimpl实现视图onclicklistener。
@覆盖
公众的参见onClick(视图v)}
//当点击的为登录按钮时
if(v==btLogin)>
//判断账户字符是否为空，
if(textutils。isempty(useredittext。gettext()).tostring()))>
//为空时抖动提示
useredittext。setshakian动画():
吐司。制作文本(主要活动。“这，”账户或密码不能为空-干杯-干杯S7-1200可编程控制器. show()；
}
//判断密码字符是否为空
if(textutils。isempty(psdedetext。gettext()).tostring()))>
//为空时抖动提示
psdedetext。setshakian animation()；
吐司。制作文本(主要活动。“这，”账户或密码不能为空-干杯-干杯S7-1200可编程控制器. show()；
}
//验证输入的验证码是否正确
if(etCheck.getText().toString()！=nulletCheck.getText().toString().修剪()。长度()0){
tvCheck.setVisibility(查看。可见);
if(numstr。等于(etcheck。gettext().toString())){
tvCheck.setTextColor(Color .绿色);
tvCheck.setText('验证码正确!');
}否则{
tvCheck.setTextColor(Color .红色);
tvCheck.setText('验证码错误!');
艾切克。settext(')；
setNum()；
}
}
//如果OnClick不是登录按钮时只剩下验证码图片有监听事件。等同于点击验证码图片。改变验证码。
}否则{
setNum()；
tvCheck.setVisibility(查看。不见了);
}
}
}
}
需要注意的知识：
1 .位图。创建位图(getBitmapFromView(tvHideA，20，50)，0，0，20，50，matrixA，true)；
Bitmap.createBitmap(位图源，int x，int y，int width，int height，Matrix m，布尔过滤器)
位图源：要从中截图的原始位图
int x:起始x坐标
int y:起始y坐标
（同Internationalorganizations）国际组织宽度：要截的图的宽度
（同Internationalorganizations）国际组织高度：要截的图的高度
布尔过滤器当进行的不只是平移变换时，过滤器参数为真实的可以进行滤波处理，有助于改善新图像质量；弗雷塞时，计算机不做过滤处理。
2.intwidSpec=View .measure spec . makemameasurespec(宽度，视图测量规格。完全正确)；
int heiSpec=View .measure spec . makemameasurespec(高度，视图测量规格。完全正确)；
设置视角的宽和高观点。测量规格完全正确指的是设置为实际视角的大小。即前面的宽度（高度)为多大就为多大。
3.Bitmap.createBitmap(宽度，高度，位图。配置ARGB _ 8888)；创造一个图标。
4.画布canvas=newCanvas(位图);
画(画布);画出图片
5.v.measure(widSpec，heis pec)；
//v.layout(0，0，width，height)；重新绘制图片的大小。
后面是运行时的图片：
当有输入时右边的一键删除图标显示、当失去焦点时一键删除图标隐藏、点击验证码更新验证码：
后面的就不详细图示了。
源码下载：http://夏在。jb51。net/2016 10/马援/Androidlogin(jb51.net).rar
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。