简单自定义Popwindow，仿支付宝微信密码输入弹出框

因APP增加了钱包功能，所以APP支付是迫在眉睫的事，市场上大多数的支付界面都是大同小异，因此写了下自定义PopupWindow，简单模仿下支付宝，本人也不常用PopupWindow，写的不好，希望大家海涵。

废话不多说，先上效果图

布局直接上代码吧，也不麻烦

<?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"android:orientation="vertical"><LinearLayout
        android:layout_width="match_parent"android:layout_height="305dp"android:layout_alignParentBottom="true"android:background="@color/white"android:orientation="vertical"><RelativeLayout
            android:layout_width="match_parent"android:layout_height="35dp"><ImageView
                android:layout_width="wrap_content"android:layout_height="wrap_content"/><TextView
                android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:text="请输入支付密码"android:textSize="@dimen/sp_16"/></RelativeLayout><LinearLayout
            android:layout_width="match_parent"android:layout_height="45dp"android:clickable="false"android:focusable="false"android:gravity="center"android:orientation="horizontal"android:paddingLeft="15dp"android:paddingRight="15dp"><EditText
                android:id="@+id/ed1"android:layout_width="0dp"android:layout_height="45dp"android:layout_weight="1"android:background="@drawable/pay_bg_left"android:clickable="false"android:cursorVisible="false"android:focusable="false"android:gravity="center"android:inputType="textPassword"/><EditText
                android:id="@+id/ed2"android:layout_width="0dp"android:layout_height="45dp"android:layout_weight="1"android:clickable="false"android:cursorVisible="false"android:focusable="false"android:gravity="center"android:background="@drawable/pay_bg_center_left"android:inputType="textPassword"/><EditText
                android:id="@+id/ed3"android:layout_width="0dp"android:layout_height="45dp"android:layout_weight="1"android:clickable="false"android:cursorVisible="false"android:focusable="false"android:gravity="center"android:background="@drawable/pay_bg_center"android:inputType="textPassword"/><EditText
                android:id="@+id/ed4"android:layout_width="0dp"android:layout_height="45dp"android:layout_weight="1"android:background="@drawable/pay_bg_center_left"android:clickable="false"android:cursorVisible="false"android:focusable="false"android:gravity="center"android:inputType="textPassword"/><EditText
                android:id="@+id/ed5"android:layout_width="0dp"android:layout_height="45dp"android:layout_weight="1"android:background="@drawable/pay_bg_center_right"android:clickable="false"android:cursorVisible="false"android:focusable="false"android:gravity="center"android:inputType="textPassword"/><EditText
                android:id="@+id/ed6"android:layout_width="0dp"android:layout_height="45dp"android:layout_weight="1"android:background="@drawable/pay_bg_right"android:clickable="false"android:cursorVisible="false"android:focusable="false"android:gravity="center"android:inputType="textPassword"/></LinearLayout><RelativeLayout
            android:layout_width="match_parent"android:layout_height="35dp"android:paddingRight="15dp"><TextView
                android:id="@+id/fotPassword"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_alignParentRight="true"android:gravity="right|center_vertical"android:text="忘记密码？"android:textColor="@color/title_txt"/></RelativeLayout><View
            android:layout_width="match_parent"android:layout_height="1dp"android:background="@color/gray_btn_bg_color"android:layout_marginTop="5dp"/><LinearLayout
            android:layout_width="match_parent"android:layout_height="45dp"android:orientation="horizontal"><TextView
                android:id="@+id/txt1"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="1"android:textColor="@color/black"android:textSize="20sp"/><View
                android:layout_width="1dp"android:layout_height="match_parent"android:background="@color/gray_btn_bg_color"/><TextView
                android:id="@+id/txt2"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="2"android:textColor="@color/black"android:textSize="20sp"/><View
                android:layout_width="1dp"android:layout_height="match_parent"android:background="@color/gray_btn_bg_color"/><TextView
                android:id="@+id/txt3"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="3"android:textColor="@color/black"android:textSize="20sp"/></LinearLayout><View
            android:layout_width="match_parent"android:layout_height="1dp"android:background="@color/gray_btn_bg_color"/><LinearLayout
            android:layout_width="match_parent"android:layout_height="45dp"android:orientation="horizontal"><TextView
                android:id="@+id/txt4"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="4"android:textColor="@color/black"android:textSize="20sp"/><View
                android:layout_width="1dp"android:layout_height="match_parent"android:background="@color/gray_btn_bg_color"/><TextView
                android:id="@+id/txt5"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="5"android:textColor="@color/black"android:textSize="20sp"/><View
                android:layout_width="1dp"android:layout_height="match_parent"android:background="@color/gray_btn_bg_color"/><TextView
                android:id="@+id/txt6"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="6"android:textColor="@color/black"android:textSize="20sp"/></LinearLayout><View
            android:layout_width="match_parent"android:layout_height="1dp"android:background="@color/gray_btn_bg_color"/><LinearLayout
            android:layout_width="match_parent"android:layout_height="45dp"android:orientation="horizontal"><TextView
                android:id="@+id/txt7"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="7"android:textColor="@color/black"android:textSize="20sp"/><View
                android:layout_width="1dp"android:layout_height="match_parent"android:background="@color/gray_btn_bg_color"/><TextView
                android:id="@+id/txt8"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="8"android:textColor="@color/black"android:textSize="20sp"/><View
                android:layout_width="1dp"android:layout_height="match_parent"android:background="@color/gray_btn_bg_color"/><TextView
                android:id="@+id/txt9"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="9"android:textColor="@color/black"android:textSize="20sp"/></LinearLayout><View
            android:layout_width="match_parent"android:layout_height="1dp"android:background="@color/gray_btn_bg_color"/><LinearLayout
            android:layout_width="match_parent"android:layout_height="45dp"android:orientation="horizontal"><TextView
                android:id="@+id/txtFinish"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:textColor="@color/white"android:textSize="20sp"/><View
                android:layout_width="1dp"android:layout_height="match_parent"android:background="@color/gray_btn_bg_color"/><TextView
                android:id="@+id/txt0"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:text="0"android:textColor="@color/black"android:textSize="20sp"/><View
                android:layout_width="1dp"android:layout_height="match_parent"android:background="@color/gray_btn_bg_color"/><TextView
                android:id="@+id/txtBack"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:textColor="@color/black"/></LinearLayout></LinearLayout></RelativeLayout>

我这里用的是十二个Textview做的按钮操作，大家可以尝试用GridView去操作，原理相同，下面再看看JAVA代码

我们先新建类继承PopupWindow，并添加构造器

public class TestPopWindow  extends PopupWindow{private Context mContext;public TestPopWindow(Context context){this.mContext=context;}
}

初始化控件

  public void init(Context context) {LayoutInflater inflater = LayoutInflater.from(context);mPopWindow = inflater.inflate(R.layout.popwindow_password, null);ed1 = mPopWindow.findViewById(R.id.ed1);ed2 = mPopWindow.findViewById(R.id.ed2);ed3 = mPopWindow.findViewById(R.id.ed3);ed4 = mPopWindow.findViewById(R.id.ed4);ed5 = mPopWindow.findViewById(R.id.ed5);ed6 = mPopWindow.findViewById(R.id.ed6);password = new EditText[6];password[0] = ed1;password[1] = ed2;password[2] = ed3;password[3] = ed4;password[4] = ed5;password[5] = ed6;txt0 = mPopWindow.findViewById(R.id.txt0);txt1 = mPopWindow.findViewById(R.id.txt1);txt2 = mPopWindow.findViewById(R.id.txt2);txt3 = mPopWindow.findViewById(R.id.txt3);txt4 = mPopWindow.findViewById(R.id.txt4);txt5 = mPopWindow.findViewById(R.id.txt5);txt6 = mPopWindow.findViewById(R.id.txt6);txt7 = mPopWindow.findViewById(R.id.txt7);txt8 = mPopWindow.findViewById(R.id.txt8);txt9 = mPopWindow.findViewById(R.id.txt9);txtBack = mPopWindow.findViewById(R.id.txtBack);txtBack.setText("<<-");txtFinish = mPopWindow.findViewById(R.id.txtFinish);fotPassword = mPopWindow.findViewById(R.id.fotPassword);txt0.setOnClickListener(this);txt1.setOnClickListener(this);txt2.setOnClickListener(this);txt3.setOnClickListener(this);txt4.setOnClickListener(this);txt5.setOnClickListener(this);txt6.setOnClickListener(this);txt7.setOnClickListener(this);txt8.setOnClickListener(this);txt9.setOnClickListener(this);txtBack.setOnClickListener(this);txtFinish.setOnClickListener(this);fotPassword.setOnClickListener(this);}

然后设置PopupWindow,如窗口大小，动画效果等等

   public void setmPopWindow() {// 把View添加到PopWindow中this.setContentView(mPopWindow);//设置SelectPicPopupWindow弹出窗体的宽this.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);//设置SelectPicPopupWindow弹出窗体的高this.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);//  设置SelectPicPopupWindow弹出窗体可点击this.setFocusable(true);//  设置SelectPicPopupWindow弹出窗体动画效果this.setAnimationStyle(R.style.mypopwindow_anim_style);//   设置背景透明this.setBackgroundDrawable(new ColorDrawable(0x00000000));}

重写点击事件

 @Overridepublic void onClick(View view) {switch (view.getId()) {case R.id.fotPassword:Toast.makeText(mContext, "忘记密码", Toast.LENGTH_SHORT).show();break;case R.id.txt1:getJudge(1);break;case R.id.txt2:getJudge(2);break;case R.id.txt3:getJudge(3);break;case R.id.txt4:getJudge(4);break;case R.id.txt5:getJudge(5);break;case R.id.txt6:getJudge(6);break;case R.id.txt7:getJudge(7);break;case R.id.txt8:getJudge(8);break;case R.id.txt9:getJudge(9);break;case R.id.txtBack://增加判断，看是否清除完毕，防止数组越界if (currentIndex - 1 >= -1) {password[currentIndex--].setText("");}break;case R.id.txt0:getJudge(1);break;case R.id.txtFinish:Toast.makeText(mContext, getStrPassword(), Toast.LENGTH_SHORT).show();break;default:break;}}/**** 增加判断，看是否输入够6位，防止数组越界* @param num*/private void getJudge(int num) {if (currentIndex >= -1 && currentIndex < 5) {password[++currentIndex].setText(num + "");}}

最后设置监听，当密码达到第六位时调用接口达成支付

    /*** 设置监听方法，在第6位输入完成后触发*/public void setOnFinishInput(final OnPasswordInputFinish passwordInputFinish) {password[5].addTextChangedListener(new TextWatcher() {@Overridepublic void beforeTextChanged(CharSequence s, int start, int count, int after) {}@Overridepublic void onTextChanged(CharSequence s, int start, int before, int count) {}@Overridepublic void afterTextChanged(Editable s) {if (s.toString().length() == 1) {//每次触发都要先将strPassword置空，再重新获取，避免由于输入删除再输入造成混乱strPassword = "";for (int i = 0; i < 6; i++) {strPassword += password[i].getText().toString().trim();}}passwordInputFinish.inputFinish();}});}

最后调用


public class MainActivity extends AppCompatActivity {private TextView mtest;private TestPopWindow mPopupWindow;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mtest = (TextView) findViewById(R.id.test);mtest.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {mPopupWindow = new TestPopWindow(MainActivity.this);mPopupWindow.showAtLocation(MainActivity.this.findViewById(R.id.testsss), Gravity.BOTTOM | Gravity.CENTER_HORIZONTAL, 0, 0);darkenBackground(0.8f);mPopupWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {@Overridepublic void onDismiss() {darkenBackground(1f);}});//添加密码输入完成的响应mPopupWindow.setOnFinishInput(new TestPopWindow.OnPasswordInputFinish() {@Overridepublic void inputFinish() {//输入完成后我们简单显示一下输入的密码//也就是说——>实现你的交易逻辑什么的在这里写Toast.makeText(MainActivity.this, mPopupWindow.getStrPassword(), Toast.LENGTH_SHORT).show();}});}});}/*** 改变背景颜色,灰色*/private void darkenBackground(Float bgcolor) {WindowManager.LayoutParams lp = getWindow().getAttributes();lp.alpha = bgcolor;getWindow().addFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);getWindow().setAttributes(lp);}
}

代码下载

简单自定义Popwindow，仿支付宝微信密码输入弹出框相关推荐

Android仿IOS封装通用的弹出框Dialog和底部弹出列表选择框仿美团顶部条件筛选框附自定义ViewGroup
弹出框背景提示与询问弹出框实现使用列表选择框实现使用顶部条件筛选框实现自定义ViewGroup 使用总结背景鉴于Android提供的默认弹出框很一般,IOS的弹出框样式还不错 ...
仿抖音评论底部弹出框（列表框+发表框）
BottomSheetDialogFragment高仿抖音评论底部弹出框先看效果图: 这个弹窗的效果是使用BottomSheetDialogFragment做的,第一个弹出的对话框为CommentL ...
【Chapter1】微信自带弹出框
文章目录一.简介二.弹出框 1.提示框 1.1 显示提示框 1.2 加载提示框 2.是否选择框 3.多项选择框三.嵌套四.遇到的问题最近用了一周写了一个仿知乎的小程序,将会陆续整理,包括前端 ...
Vue项目流程7，交易页面，提交订单，支付页面，利用element UI 以及 QRCode 完成微信支付，弹出框按钮的相关工作，个人中心以及子路由我的订单
目录交易页面提交订单支付页面微信支付个人中心我的订单交易页面 1.静态组件及路由跳转 2.获取交易页数据 (1)接口 //获取用户地址信息地址:/api/user/userAddres ...
android实现qq修改密码底部弹出框_易查分强大的“可修改列”功能：轻松实现填表、留言和信息核对...
考试成绩公布了,想征求家长和学生的意见吗?给查询加个留言吧:需要家长填写一些表格,还在用QQ和微信群一个人一个人的留言粘贴吗?公布一些资料,想让家长自己核对一下有没有错误,家长还要告诉老师修改?用易查 ...
仿支付宝微信提现输入判断
下面是支付宝,微信充值要求的可以输入什么值不可以输入什么值要求,保留俩位有效数字,其他等等 mMoney.addTextChangedListener(new TextWatcher() { @Ove ...
微信小程序弹出框竖向滚动_微信小程序解决自定义弹出层滑动时下层页面滚动问题...
WXML 将整个底层页面使用 scroll-view 包裹起来,设置 scroll-y 当显示弹出层的时候为 true, 闭关弹出层的时候为 false WXSS Page 设置为绝对定位,宽高各百分 ...
Android仿淘宝口令复制弹出框功能
1.我要做什么应用场景: 我的朋友使用微信给我发一个淘宝链接的口令,我复制口令,进入我的淘宝,弹框,显示口令的详情,点击详情,进入商品页面. 存在的问题: 但这存在一个问题,我的淘宝并不总是关闭状态 ...
ecshop仿淘宝加入购物车弹出框【支持任何页面】淡出淡隐固定屏幕-兼容ie
效果演示如图: 如果没有会员还购物买过的商品,则下面那部份不会显示! 有渐隐渐出效果,也是非jquery的,固定屏幕滚动,测试过是支持ie6-ie9的,无闪动,喜欢这个HACK代码的朋友也可以参考下, ...

简单自定义Popwindow，仿支付宝微信密码输入弹出框

简单自定义Popwindow，仿支付宝微信密码输入弹出框相关推荐

最新文章

热门文章