android仿支付寶密碼輸入框效果

2019-10-22 18:21:31

字體：大中小

來源：轉載

供稿：網友

本文實例為大家分享了android仿支付寶密碼輸入框展示的具體代碼，供大家參考，具體內容如下

這個沒什么好分析的,就是一些基本的繪制什么線,矩形什么的,看代碼更具體

布局文件：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <com.example.custompasswordview.PasswordView  android:id="@+id/passwordview"  android:layout_width="match_parent"  android:layout_height="105px"  android:layout_marginTop="100px"  android:layout_marginLeft="20px"  android:layout_marginRight="20px"  android:inputType="number"  android:cursorVisible="false"  android:focusable="true"  android:focusableInTouchMode="true"  android:enabled="true"  android:clickable="true"   /> <Button  android:id="@+id/btn_pass_reset"  android:layout_width="250px"  android:layout_height="90px"  android:text="重置"  android:layout_below="@id/passwordview"  android:layout_marginTop="20px"  android:layout_marginLeft="40px"  android:gravity="center"  /></RelativeLayout>

MainActivity.java

package com.example.custompasswordview;import android.app.Activity;import android.os.Bundle;import android.view.View;import android.widget.Button;public class MainActivity extends Activity { private Button btn_pass_reset; private PasswordView passwordview; @Override protected void onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentView(R.layout.activity_main);  btn_pass_reset = (Button) findViewById(R.id.btn_pass_reset);  passwordview = (PasswordView) findViewById(R.id.passwordview);  btn_pass_reset.setOnClickListener(new View.OnClickListener() {   @Override   public void onClick(View v) {    passwordview.setEmpeyText();   }  }); }}

自定義EditText輸入框

package com.example.custompasswordview;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.util.AttributeSet;import android.util.Log;import android.widget.EditText;import android.widget.Toast;/** * Created by Adminis on 2016/8/7. */public class PasswordView extends EditText { private static final String TAG ="PasswordView" ; private Paint bordPaint;//外框畫筆 private Paint linePaint;//線 的畫筆 private Paint passTextPaint;//密碼畫筆 private int width; private int height; private int passwordLength = 6;//代碼的長度 private int textLength; private int radius = 15; public PasswordView(Context context) {  this(context,null); } public PasswordView(Context context, AttributeSet attrs) {  this(context, attrs,0); } public PasswordView(Context context, AttributeSet attrs, int defStyleAttr) {  super(context, attrs, defStyleAttr);  initPaint(); } /**  * 初始化畫筆  */ private void initPaint() {  setFocusable(true);  bordPaint = new Paint();  bordPaint.setStrokeWidth(8);  bordPaint.setColor(Color.WHITE);  bordPaint.setStyle(Paint.Style.FILL);  linePaint = new Paint();  linePaint.setColor(Color.parseColor("#838B8B"));  linePaint.setStrokeWidth(4);  passTextPaint = new Paint();  passTextPaint.setColor(Color.parseColor("#000000"));  passTextPaint.setStrokeWidth(12); } @Override protected void onDraw(Canvas canvas) {  super.onDraw(canvas);  height = getMeasuredHeight();  width = getMeasuredWidth();  drawRoundRect(canvas);  drawLine(canvas);  drawTextPass(canvas); } /**  * 繪制密碼  * @param canvas  */ private void drawTextPass(Canvas canvas) {  float cx, cy = height/ 2;  float half = width / passwordLength / 2;  for(int i = 0; i < textLength; i++) {   cx = width * i / passwordLength + half;   canvas.drawCircle(cx, cy, radius, passTextPaint);  } } /**  * 繪制線  * @param canvas  */ private void drawLine(Canvas canvas) {  for (int i = 1; i < passwordLength; i++) {   float x = width * i / passwordLength;   canvas.drawLine(x, 12, x, height-12, linePaint);  } } /**  * 繪制背景  * @param canvas  */ private void drawRoundRect(Canvas canvas) {   canvas.drawRoundRect(0,0,width,height,12,12,bordPaint); } @Override protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {  super.onTextChanged(text, start, lengthBefore, lengthAfter);  this.textLength = text.toString().length();  if(textLength==6){   Toast.makeText(getContext(),"您設置的密碼為"+text,Toast.LENGTH_SHORT).show();  }  invalidate(); } public void setEmpeyText(){  setText("");  invalidate(); }}

效果：

android,支付寶,密碼