Android仿支付寶、京東的密碼鍵盤和輸入框
首先看下效果圖

一:布局代碼
鍵盤由0~9的數(shù)字,刪除鍵和完成鍵組成,也可以根據(jù)需求通過GridView適配器的getItemViewType方法來定義。點擊鍵的時候背景有變色的效果。
密碼輸入框由六個EditText組成,每個輸入框最對能輸入一個數(shù)字,監(jiān)聽最后一個輸入框來完成密碼輸入結(jié)束的監(jiān)聽。
二:鍵盤
鍵盤中的主要邏輯處理,鍵盤樣式,item的點擊事件
@Override
public int getViewTypeCount() {
return 2;
}
@Override
public int getItemViewType(int position) {
return (getItemId(position) == KEY_NINE) ? 2 : 1;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder = null;
if (convertView == null) {
if (getItemViewType(position) == 1) {
//數(shù)字鍵
convertView = LayoutInflater.from(context).inflate(R.layout.item_grid_keyboard, parent, false);
viewHolder = new ViewHolder(convertView);
} else {
//刪除鍵
convertView = LayoutInflater.from(context).inflate(R.layout.item_grid_keyboard_delete, parent, false);
}
}
if (getItemViewType(position) == 1) {
viewHolder = (ViewHolder) convertView.getTag();
viewHolder.tvKey.setText(key[position]);
}
return convertView;
}
三:密碼輸入框
密碼輸入框要處理的邏輯有刪除、輸入、輸入完成回調(diào)等
/**
* 輸入密碼,根據(jù)StringBuilder中數(shù)據(jù)的多少進行邏輯判斷
* @param value
*/
public void add(String value) {
if (mPassword != null && mPassword.length() < 6) {
mPassword.append(value);//此處先添加到StringBuilder中,再在輸入框中顯示
if (mPassword.length() == 1) {
tvFirst.setText(value);
} else if (mPassword.length() == 2) {
tvSecond.setText(value);
}else if (mPassword.length() == 3) {
tvThird.setText(value);
}else if (mPassword.length() == 4) {
tvForth.setText(value);
}else if (mPassword.length() == 5) {
tvFifth.setText(value);
}else if (mPassword.length() == 6) {
tvSixth.setText(value);
}
}
}
/**
* 刪除密碼,根據(jù)StringBuilder中數(shù)據(jù)的多少進行邏輯判斷
*/
public void remove() {
if (mPassword != null && mPassword.length() > 0) {
if (mPassword.length() == 1) {
tvFirst.setText("");
} else if (mPassword.length() == 2) {
tvSecond.setText("");
}else if (mPassword.length() == 3) {
tvThird.setText("");
}else if (mPassword.length() == 4) {
tvForth.setText("");
}else if (mPassword.length() == 5) {
tvFifth.setText("");
}else if (mPassword.length() == 6) {
tvSixth.setText("");
}
mPassword.deleteCharAt(mPassword.length() - 1);
}
}
獲取完整密碼
/**
* 返回完整密碼
* @return
*/
public String getText() {
return (mPassword == null) ? null : mPassword.toString();
}
四:實際應(yīng)用
布局,也可以把鍵盤拆分開來,當(dāng)輸入的時候從窗口下方滑入
<?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.github.phoenix.widget.PayEditText
android:id="@+id/PayEditText_pay"
android:layout_width="match_parent"
android:layout_marginTop="20dp"
android:paddingLeft="12dp"
android:layout_alignParentTop="true"
android:paddingRight="12dp"
android:layout_height="48dp"/>
<com.github.phoenix.widget.Keyboard
android:id="@+id/KeyboardView_pay"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="300dp"/>
</RelativeLayout>
代碼中
//鍵
private static final String[] KEY = new String[] {
"1", "2", "3",
"4", "5", "6",
"7", "8", "9",
"<<", "0", "完成"
};
//設(shè)置鍵盤
keyboard.setKeyboardKeys(KEY);
//鍵盤鍵的點擊事件
keyboard.setOnClickKeyboardListener(new Keyboard.OnClickKeyboardListener() {
@Override
public void onKeyClick(int position, String value) {
if (position < 11 && position != 9) {
payEditText.add(value);
} else if (position == 9) {
payEditText.remove();
}else if (position == 11) {
//當(dāng)點擊鍵盤上的完成按鈕時,也可以通過payEditText.getText()獲取密碼,此時不應(yīng)該注冊O(shè)nInputFinishedListener接口
Toast.makeText(getApplication(), "您的密碼是:" + payEditText.getText(), Toast.LENGTH_SHORT).show();
finish();
}
}
});
//當(dāng)密碼輸入完成時的回調(diào)
payEditText.setOnInputFinishedListener(new PayEditText.OnInputFinishedListener() {
@Override
public void onInputFinished(String password) {
Toast.makeText(getApplication(), "您的密碼是:" + password, Toast.LENGTH_SHORT).show();
}
});
總結(jié)
好了,以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對各位Android開發(fā)者們能有所幫助,如果有疑問大家可以留言交流。
相關(guān)文章
Android自定義控件(實現(xiàn)狀態(tài)提示圖表)
本篇文章主要介紹了android實現(xiàn)狀態(tài)提示圖表的功能,實現(xiàn)了動態(tài)圖表的顯示,有需要的朋友可以了解一下。2016-11-11
Android?Jetpack?Compose開發(fā)實用小技巧
這篇文章主要為大家介紹了Android?Jetpack?Compose開發(fā)中的一些實用小技巧示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-11-11
實例解析Android ImageView的scaleType屬性
通過本文給大家介紹ImageView這個控件的一些使用方法,以及其最重要的一個屬性: scaleType,對imageview的scaletype相關(guān)知識感興趣的朋友一起學(xué)習(xí)吧2016-01-01
Android利用Document實現(xiàn)xml讀取和寫入操作
這篇文章主要為大家詳細(xì)介紹了Android利用Document實現(xiàn)xml讀取和寫入操作,具有一定的參考價值,感興趣的小伙伴們可以參考一下2018-12-12

