Android仿支付宝支付密码输入框

本文实例为大家分享了Android实现一个仿支付宝支付密码的输入框,主要实现如下:

PasswordView.java

package com.jackie.alipay.password; import android.annotation.TargetApi; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.os.Build; import android.util.AttributeSet; import android.widget.EditText; import android.widget.Toast; /** * Created by Administrator on 2016/10/31. */ public class PasswordView extends EditText { private Paint mBorderPaint; //外框画笔 private Paint mLinePaint; //线的画笔 private Paint mPasswordPaint; //密码画笔 private int mPasswordTextLength; //输入密码的长度 private int mWidth; private int mHeight; private static final int PASSWORD_LENGTH = 6;//密码的长度 private static final int PASSWORD_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); initView(); } private void initView() { setFocusable(true); mBorderPaint = new Paint(); mBorderPaint.setStrokeWidth(8); mBorderPaint.setColor(Color.WHITE); mBorderPaint.setStyle(Paint.Style.FILL); mLinePaint = new Paint(); mLinePaint.setColor(Color.parseColor("#838B8B")); mLinePaint.setStrokeWidth(4); mPasswordPaint = new Paint(); mPasswordPaint.setColor(Color.BLACK); mPasswordPaint.setStrokeWidth(12); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); mWidth = getMeasuredWidth(); mHeight = getMeasuredHeight(); drawRoundRect(canvas); drawLine(canvas); drawPassword(canvas); } /** * 绘制圆角矩形背景 * @param canvas */ @TargetApi(Build.VERSION_CODES.LOLLIPOP) private void drawRoundRect(Canvas canvas) { canvas.drawRoundRect(0, 0, mWidth, mHeight, 12, 12, mBorderPaint); } /** * 绘制分割线 * @param canvas */ private void drawLine(Canvas canvas) { for (int i = 1; i < PASSWORD_LENGTH; i++) { float x = mWidth * i / PASSWORD_LENGTH; canvas.drawLine(x, 12, x, mHeight - 12, mLinePaint); } } /** * 绘制密码 * @param canvas */ private void drawPassword(Canvas canvas) { float cx, cy = mHeight / 2; float half = mWidth / PASSWORD_LENGTH / 2; for (int i = 0; i < mPasswordTextLength; i++) { cx = mWidth * i / PASSWORD_LENGTH + half; canvas.drawCircle(cx, cy, PASSWORD_RADIUS, mPasswordPaint); } } @Override protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) { super.onTextChanged(text, start, lengthBefore, lengthAfter); mPasswordTextLength = text.toString().length(); if (mPasswordTextLength == PASSWORD_LENGTH) { Toast.makeText(getContext(), "您设置的密码为: " + text, Toast.LENGTH_SHORT).show();; } invalidate(); } public void reset(){ setText(""); invalidate(); } }

效果图如下:

更多内容请参考专题:Android密码使用教程

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

时间: 2024-10-27 02:48:50

Android仿支付宝支付密码输入框的相关文章

Android仿支付宝支付从底部弹窗效果_Android

我们再用支付宝支付的时候,会从底部弹上来一个对话框,让我们选择支付方式等等,今天我们就来慢慢实现这个功能 效果图 实现 主界面很简单,就是一个按钮,点击后跳到支付详情的Fragment中 package com.example.hfs.alipayuidemo; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.wi

Android仿支付宝支付从底部弹窗效果

我们再用支付宝支付的时候,会从底部弹上来一个对话框,让我们选择支付方式等等,今天我们就来慢慢实现这个功能 效果图 实现 主界面很简单,就是一个按钮,点击后跳到支付详情的Fragment中 package com.example.hfs.alipayuidemo; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.wi

Android 仿支付宝密码输入框效果_Android

模仿支付宝输入效果,实现很简单,就是画个矩形框和圆形,其他的通过组合view来实现所有功能,虽然简单但是封装起来,方便以后使用,也分享一下,希望对别人也有点帮助.   1.如何使用,可以设置自己的进入退出动画,不设置则没有动画效果,自己觉得封装之后还是非常用好的. private MyInputPwdUtil myInputPwdUtil; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(

Android仿支付宝微信支付密码界面弹窗封装dialog

一,功能效果 二,实现过程 1,先写xml文件:dialog_keyboard.xml 注意事项 (1),密码部分用的是一个线性布局中6个TextView,并设置android:inputType="numberPassword",外框是用的一个有stroke属性的shape, (2),1-9数字是用的recycleview ,每个item的底部和右边有1dp的黑线,填充后形成分割线. (3),recycleview 要设置属性  android:overScrollMode=&quo

Android中PathMeasure仿支付宝支付动画

前言 在 Android 自定义 View 中,Path 可能用的比较多,PathMeasure 可能用的比较少,就我而言,以前也没有使用过 PathMeasure 这个 api,看到别人用 PathMeasure 和 ValueAnimator 结合在一起完成了很好的动画效果,于是我也学习下 PathMeasure ,此处记录下. PathMeasure 构造器: forceClosed 含义: // 创建一个 Path 对象 path = new Path(); path.moveTo(20

android仿支付宝付款成功及&amp;quot;天女散花&amp;quot;效果实现——看PathMeasure大展身手

话说,在前面两篇文章中,我们学习了BitmapShader.Path的基本使用,那么这一篇文章,咱们接着来学习一下PathMeasure的用法.什么,你没听说过PathMeasure?那你就要OUT咯~ 项目效果图 废话不多说,在开始讲解之前,先看下最终实现的效果. 效果一: 仿支付宝支付成功效果 效果二: 这两个项目都是使用Path和PathMeature配合完成的,由其他项目改造而来 项目一是七叔写的,我对代码进行了大量改造. 项目二是不小心搜到的,然后进行了改造,原文请戳这里 本文代码请到

Android仿支付宝中余额宝的数字动画效果_Android

实现效果图: 下面是具体代码,可直接复制: package com.lcw.rabbit.widget; import android.animation.ObjectAnimator; import android.content.Context; import android.text.TextUtils; import android.util.AttributeSet; import android.view.animation.AccelerateDecelerateInterpola

饼状图-android 仿支付宝对账单饼形图

问题描述 android 仿支付宝对账单饼形图 以上为效果图,要支持可手动旋转和点击自动旋转,现在我只实现了拖动旋转,但不知道点击效果如何加上去,望大神指导..... 解决方案 可以参考下: http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1107/1930.html http://www.mobile-open.com/2014/2901.html 解决方案二: 有没有用到开源类库,若用到的话建议查查文档 解决方案三: 需要

基于JS实现类似支付宝支付密码输入框_javascript技巧

本文实现的是一个类似支付宝支付密码的界面,只可以输入数字,且只可以输入6位 首先给大家展示下效果图,如果感觉不错,请参考实现代码. 1.样式表 .wrap{ margin: 10px auto; width: 329px; height: 640px; padding-top: 200px; } .inputBoxContainer{ width: 240px; height: 50px; margin: 0 auto; position: relative; } .inputBoxContai