仿支付宝密码输入界面+随机键盘

**
仿支付宝密码输入界面+随机键盘
**
最近搞了dome，随机数字键盘+仿支付宝交易密码支付UI编写，很好的封装，随处调用
先上图，看看dome效果，觉得可以，可以继续往下走，ok…

文章插图

文章插图
随机键盘的实现，主要输对的绘制，以及的应用，实例化= new (, R.xml.);
其中是存放数字的xml文件。随机参数数字键盘关键代码如下：

private void randomdigkey(){List keyList = keyDig.getKeys();// 查找出0-9的数字键List newkeyList = new ArrayList();for (int i = 0; i < keyList.size(); i++) {if (keyList.get(i).label != null&& isNumber(keyList.get(i).label.toString())) {newkeyList.add(keyList.get(i));}}// 数组长度int count = newkeyList.size();// 结果集List resultList = new ArrayList();// 用一个LinkedList作为中介LinkedList temp = new LinkedList();// 初始化tempfor (int i = 0; i < count; i++) {temp.add(new KeyModel(48 + i, i + ""));}// 取数Random rand = new Random();for (int i = 0; i < count; i++) {int num = rand.nextInt(count - i);resultList.add(new KeyModel(temp.get(num).getCode(),temp.get(num).getLable()));temp.remove(num);}for (int i = 0; i < newkeyList.size(); i++) {newkeyList.get(i).label = resultList.get(i).getLable();newkeyList.get(i).codes[0] = resultList.get(i).getCode();}keyboardView.setKeyboard(keyDig);}

交易密码框的实现的实现，构建一个虚拟的，通过对的可见性控制来虚拟的模拟交易密码的输入（回显效果），在把真正的输入内容存放在中，当输入长度到达6时，回调，自定义一个交易密码框代码如下：

public class SecurityPasswordEditText extends LinearLayout {privateEditText mEditText;private ImageView oneTextView;private ImageView twoTextView;private ImageView threeTextView;private ImageView fourTextView;private ImageView fiveTextView;private ImageView sixTextView;LayoutInflater inflater;private ImageView[] imageViews;private View contentView;StringBuilder builder;public SecurityPasswordEditText(Context context, AttributeSet attrs) {super(context, attrs);inflater = LayoutInflater.from(context);builder = new StringBuilder();initWidget();}private void initWidget() {contentView = inflater.inflate(R.layout.sdk2_simple_pwd_widget, null);mEditText = (EditText) contentView.findViewById(R.id.sdk2_pwd_edit_simple);oneTextView = (ImageView) contentView.findViewById(R.id.sdk2_pwd_one_img);twoTextView = (ImageView) contentView.findViewById(R.id.sdk2_pwd_two_img);fourTextView = (ImageView) contentView.findViewById(R.id.sdk2_pwd_four_img);fiveTextView = (ImageView) contentView.findViewById(R.id.sdk2_pwd_five_img);sixTextView = (ImageView) contentView.findViewById(R.id.sdk2_pwd_six_img);threeTextView = (ImageView) contentView.findViewById(R.id.sdk2_pwd_three_img);LinearLayout.LayoutParams lParams = new LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,LinearLayout.LayoutParams.WRAP_CONTENT);mEditText.addTextChangedListener(mTextWatcher);imageViews = new ImageView[] { oneTextView, twoTextView, threeTextView,fourTextView, fiveTextView, sixTextView };this.addView(contentView, lParams);}TextWatcher mTextWatcher = new TextWatcher() {@Overridepublic void onTextChanged(CharSequence s, int start, int before,int count) {}@Overridepublic void beforeTextChanged(CharSequence s, int start, int count,int after) {}@Overridepublic void afterTextChanged(Editable s) {if (s.toString().length() == 0) {return;}if (builder.length() < 6) {builder.append(s.toString());setTextValue();}s.delete(0, s.length());}};private void setTextValue() {String str = builder.toString();int len = str.length();if (len <= 6) {imageViews[len - 1].setVisibility(View.VISIBLE);}if (len >= 6) {Log.i("简密框","回调");Log.i("简密框","支付密码" + str);if (mListener != null) {mListener.onNumCompleted(str);}//LogUtils.i("jone", builder.toString());//FunctionUtils.hideSoftInputByView(getContext(), mEditText);}}public void delTextValue() {String str = builder.toString();int len = str.length();if (len == 0) {return;}if (len > 0 && len <= 6) {builder.delete(len - 1, len); //Log.e("===", builder.toString()+"len = "+len);}imageViews[len - 1].setVisibility(View.INVISIBLE);//Log.e("===", builder.toString()+"len = "+imageViews[len-1].getVisibility());}public interface SecurityEditCompleListener {public void onNumCompleted(String num);}public SecurityEditCompleListener mListener;public void setSecurityEditCompleListener(SecurityEditCompleListener mListener) {this.mListener = mListener;}public void clearSecurityEdit() {if (builder != null) {if (builder.length() == 6) {builder.delete(0, 6);}}for (ImageView tv : imageViews) {tv.setVisibility(View.INVISIBLE);}}public EditText getSecurityEdit() {return this.mEditText;}}

交易密码POP的封装及调用，清楚以上一种关键实现之后，下面我们将他封装起来，代码如下：
【仿支付宝密码输入界面+随机键盘】

/*** 封装pop类 ， 创建回调* @author AHF**/public class TradePwdPopUtils {privatePopupWindow popWindow = null;privateCallBackTradePwd callBackTradePwd;public TradePwdPopUtils() {super();}public CallBackTradePwd getCallBackTradePwd() {return callBackTradePwd;}public void setCallBackTradePwd(CallBackTradePwd callBackTradePwd) {this.callBackTradePwd = callBackTradePwd;}public interface CallBackTradePwd{public void callBaceTradePwd(String pwd);}protected void showPopWindow(Context context,Activity ac,LinearLayout lin) {popWindow = null;if (popWindow == null) {LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);View view = inflater.inflate(R.layout.trade_key_layout, null);SecurityPasswordEditText myEdit = (SecurityPasswordEditText) view.findViewById(R.id.my_edit);TextView tvClose = (TextView) view.findViewById(R.id.tv_close);myEdit.setSecurityEditCompleListener(new SecurityEditCompleListener() {@Overridepublic void onNumCompleted(String num) {popWindow.dismiss();if(callBackTradePwd!=null){callBackTradePwd.callBaceTradePwd(num);}}});tvClose.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {popWindow.dismiss();}});ac.getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN);Method setShowSoftInputOnFocus = null;try {setShowSoftInputOnFocus = myEdit.getClass().getMethod("setShowSoftInputOnFocus", boolean.class);setShowSoftInputOnFocus.setAccessible(true);setShowSoftInputOnFocus.invoke(myEdit, false);} catch (SecurityException e) {e.printStackTrace();} catch (NoSuchMethodException e) {e.printStackTrace();}catch(Exception e){e.printStackTrace();}new KeyboardUtil(view, context, myEdit).showKeyboard();popWindow = new PopupWindow(view, LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT);popWindow.setFocusable(true);popWindow.setOutsideTouchable(true);popWindow.setBackgroundDrawable(new BitmapDrawable());popWindow.showAtLocation(lin, Gravity.BOTTOM, 0, 0);}}}

ok ，在这已经完成了一大半了，最后一步，只需会调用封装好的方法即可显示密码输入效果了。

/*** 主活动* @author AHF**/public class MainActivity extends Activity implements CallBackTradePwd{Button btn;LinearLayout lin;private TradePwdPopUtils pop;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main_layout);btn = (Button) findViewById(R.id.btn);pop = new TradePwdPopUtils();lin = (LinearLayout) findViewById(R.id.lin);pop.setCallBackTradePwd(this);btn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {pop.showPopWindow(MainActivity.this, MainActivity.this, lin);}});}@Overridepublic void callBaceTradePwd(String pwd) {Toast.makeText(this, "回调密码"+pwd, Toast.LENGTH_LONG).show(); }}

ok，初略的分析了下，希望对你有所帮助?。。?
最后贴上源码下载地址：仿支付宝密码输入框+随机键盘源码下载