1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 自定义View之自定义支付宝密码输入控件

自定义View之自定义支付宝密码输入控件

时间:2019-02-20 18:59:07

相关推荐

自定义View之自定义支付宝密码输入控件

效果如图上边(录像文件被压缩有些失真)

1、可以设置密码位数

2、每个格子能输入一位的数字

3、背景框、分割线、圆点颜色可以设置

4、位数输入满后可直接进行提示或后续操作

首先设置下需要的属性attrs文件

<?xml version="1.0" encoding="utf-8"?><resources><declare-styleable name="passwordEditText"><attr name="colorPoint" format="color" /><attr name="colorLine" format="color" /><attr name="colorBound" format="color" /><attr name="passwordLength" format="integer" /><attr name="pointRadius" format="integer" /></declare-styleable></resources>

属性依次是设置点颜色、分隔线颜色、边框线颜色、可输入的密码长度、圆点的半径。

然后自定义一个继承EditText的控件

package ;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.util.AttributeSet;import android.util.Log;import android.widget.EditText;/*** @author Created by cc on 17/5/25.* @fileName PasswordEditText* @githublink /cc0819* @csdnlink /qq_25404567*/public class PasswordEditText extends EditText {private int clLine;private int clPoint;private int clBound;private int passwordLength;private int pointRadius;private Paint paintLine;private Paint paintPoint;private Paint paintBound;private int mWidth;private int mHeight;private int psdTextLength;public OnTextEndListener onTextEndListener;public void SetOnTextEndListener(OnTextEndListener onTextEndListener){this.onTextEndListener = onTextEndListener;}public PasswordEditText(Context context, AttributeSet attrs) {super(context, attrs);initType(context,attrs);}public PasswordEditText(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initType(context,attrs);}private void initType(Context context,AttributeSet attrs){TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.passwordEditText);clLine = typedArray.getColor(R.styleable.passwordEditText_colorLine, Color.RED);clPoint = typedArray.getColor(R.styleable.passwordEditText_colorPoint, Color.BLUE);clBound = typedArray.getColor(R.styleable.passwordEditText_colorBound, Color.RED);passwordLength = typedArray.getInteger(R.styleable.passwordEditText_passwordLength, 4);pointRadius = typedArray.getInteger(R.styleable.passwordEditText_pointRadius, 10);init();//回收防内存泄漏typedArray.recycle();}private void init() {setFocusable(true);setFocusableInTouchMode(true);setCursorVisible(false);paintBound = new Paint();paintBound.setStrokeWidth(4);paintBound.setAntiAlias(true);paintBound.setColor(clBound);paintBound.setStyle(Paint.Style.STROKE);paintLine = new Paint();paintLine.setStrokeWidth(1);paintLine.setAntiAlias(true);paintLine.setColor(clLine);paintPoint = new Paint();paintPoint.setStrokeWidth(12);paintPoint.setAntiAlias(true);paintPoint.setColor(clPoint);}@Overrideprotected void onDraw(Canvas canvas) {mWidth = getMeasuredWidth();mHeight = getMeasuredHeight();// drawRoundLine(canvas);drawDivisionLine(canvas);drawPassword(canvas);}//绘制边框private void drawRoundLine(Canvas canvas) {canvas.drawRoundRect(0,0,mWidth,mHeight,8,8,paintBound);}//绘制分割线private void drawDivisionLine(Canvas canvas) {for (int i = 1; i < passwordLength; i++) {float mX = mWidth * i / passwordLength;canvas.drawLine(mX, 8, mX, mHeight-8, paintLine);}}//绘制密码点private void drawPassword(Canvas canvas) {float cx, cy = mHeight / 2;float half = mWidth / passwordLength;for (int i = 0; i < psdTextLength; i++) {cx = half / 2 + half * i;canvas.drawCircle(cx, cy, pointRadius, paintPoint);}}@Overrideprotected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {super.onTextChanged(text, start, lengthBefore, lengthAfter);psdTextLength = text.toString().length();if (psdTextLength == passwordLength && passwordLength != 0){Log.e("info","---输入完成了---");onTextEndListener.onTextEndListener(text.toString());}invalidate();}public int getClLine() {return clLine;}public void setClLine(int clLine) {this.clLine = clLine;}public int getClPoint() {return clPoint;}public void setClPoint(int clPoint) {this.clPoint = clPoint;}public int getPasswordLength() {return passwordLength;}public void setPasswordLength(int passwordLength) {this.passwordLength = passwordLength;}public int getPointRadius() {return pointRadius;}public void setPointRadius(int pointRadius) {this.pointRadius = pointRadius;}//重置public void reset(){setText("");invalidate();}//输入完成回调public interface OnTextEndListener{void onTextEndListener(String string);}}

也借鉴了网上其他人写的方法,其实主要就是画背景框、分割线和圆点。

如上代码其实并未用到画背景框的方法,是因为画出来我总是感觉不大好看,总是有一个小角儿。

后来所幸就不用这个画了,直接用drawable画了一个圆角的背景放入控件中

如代码

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="/apk/res/android"><solid android:color="#FFFFFF" /><strokeandroid:width="1.0px"android:color="#ee3939" /><corners android:radius="8dp" /></shape>

为了方便颜色也直接写里面了

设置定义好的控件

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="/apk/res/android"xmlns:tools="/tools"xmlns:psw="/apk/res-auto"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><.PasswordEditTextandroid:id="@+id/psdEditText"android:layout_width="match_parent"android:layout_height="60dp"android:layout_marginTop="10dp"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:background="@drawable/bg_alipay"android:maxLength="6"psw:passwordLength = "6"/></RelativeLayout>

这里要注意设置的

passwordLength设置的长度要和maxLength设置的长度要一样

拿设置6位密码来举例:

如果输入已经到6位还是继续输入的话,虽然试图中没有变化,但是你打印长度可以看出来还是继续增长的,

其次在自定义控件中我想设置maxLength根据用户设置的passwordLength来的,奈何实在没有找到。

如果哪位大佬设置成功还请告诉小弟。

最后是主页面中代码

package ;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.widget.Toast;import butterknife.BindView;import butterknife.ButterKnife;public class MainActivity extends AppCompatActivity {@BindView(R.id.psdEditText)PasswordEditText psdEditText;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);ButterKnife.bind(this);psdEditText.SetOnTextEndListener(new PasswordEditText.OnTextEndListener() {@Overridepublic void onTextEndListener(String string) {Toast.makeText(MainActivity.this, "输入完毕输出是" + string, Toast.LENGTH_SHORT).show();}});}}

github下载地址:/cc0819/CopyAliPayPassword

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。