简单自定义Popwindow,仿支付宝微信密码输入弹出框
来源:互联网 发布:蓝牙单片机串口通信 编辑:程序博客网 时间:2024/05/16 08:20
因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)); }
重写点击事件
@Override public 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() { @Override public void beforeTextChanged(CharSequence s, int start, int count, int after) { } @Override public void onTextChanged(CharSequence s, int start, int before, int count) { } @Override public 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; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mtest = (TextView) findViewById(R.id.test); mtest.setOnClickListener(new View.OnClickListener() { @Override public 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() { @Override public void onDismiss() { darkenBackground(1f); } }); //添加密码输入完成的响应 mPopupWindow.setOnFinishInput(new TestPopWindow.OnPasswordInputFinish() { @Override public 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); }}
代码下载
阅读全文
0 0
- 简单自定义Popwindow,仿支付宝微信密码输入弹出框
- 自定义view仿支付宝密码输入框
- kotlin实现的简单个人账户管理APP(三) 自定义View仿支付宝的密码输入框/密码相关逻辑
- 仿支付宝支付密码输入框
- 自定义popWindow(高仿qq加号弹出框)
- 自定义输入支付密码框
- Andriod 仿支付宝密码输入框
- android 仿支付宝密码输入框
- 【笔记】仿支付宝密码输入框
- 仿支付宝密码输入框
- 仿淘宝支付密码输入框
- 自定义View之仿支付宝输入六位密码
- 简单仿支付宝/微信密码输入效果
- 仿支付宝支付密码输入框功能
- Android仿支付宝支付密码输入框
- Android仿支付宝支付密码输入框
- Android 仿支付宝支付密码输入框
- Android仿支付宝淘宝 - 自定义密码输入框和键盘
- Oracle数据库dmp文件Dos命令下导入导出
- Spring Cloud构建微服务架构—服务消费(Feign)
- 无线网络覆盖
- 云星数据---Apache Flink实战系列(精品版)】:Flink流处理API详解与编程实战011-DataStream与MySql自定义sink和source(Java版)003
- Java JDBC批处理插入数据操作
- 简单自定义Popwindow,仿支付宝微信密码输入弹出框
- 从一个表的数据拷贝到另一个表,Copy all columns from one table to another table:
- 《大话设计模式》java实现之桥接模式
- 总结领悟-----静态变量
- 使用微软的语音识别引擎Microsoft Speech API进行语音控制
- 2017中国国际纺织面料及辅料(春夏)博览会会刊(参展商名录)
- 网页上怎么输出右上角的度数和¥符号
- 模板
- 双11后遗症 家电品牌新售后如何转危为机