我想添加一个像保险库应用程序中的数字键盘一样的数字键盘。
我不知道该怎么称呼它，也不知道该如何在谷歌上找到它？
安卓自定义数字键盘
22
- Zaw Myo Htet
1
访问以下链接以获取一个编程示例：https://github.com/rciovati/Android-KeyboardView-Example - Jitesh Upadhyay
3个回答
68
- 使用TableLayout创建数字键盘布局。
- 在每个自定义键视图上绑定View.OnClickListener以响应用户输入。
- 在响应中，将文本附加或删除到由EditText实现的密码字段中。您可以使用append（）或setText（）来控制密码字段中填充什么内容。
我编写了一个自定义视图以便在任何地方重复使用，以下是代码:
KeyboardView.java
public class KeyboardView extends FrameLayout implements View.OnClickListener {
private EditText mPasswordField;
public KeyboardView(Context context) {
super(context);
init();
}
public KeyboardView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public KeyboardView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
private void init() {
inflate(getContext(), R.layout.keyboard, this);
initViews();
}
private void initViews() {
mPasswordField = $(R.id.password_field);
$(R.id.t9_key_0).setOnClickListener(this);
$(R.id.t9_key_1).setOnClickListener(this);
$(R.id.t9_key_2).setOnClickListener(this);
$(R.id.t9_key_3).setOnClickListener(this);
$(R.id.t9_key_4).setOnClickListener(this);
$(R.id.t9_key_5).setOnClickListener(this);
$(R.id.t9_key_6).setOnClickListener(this);
$(R.id.t9_key_7).setOnClickListener(this);
$(R.id.t9_key_8).setOnClickListener(this);
$(R.id.t9_key_9).setOnClickListener(this);
$(R.id.t9_key_clear).setOnClickListener(this);
$(R.id.t9_key_backspace).setOnClickListener(this);
}
@Override
public void onClick(View v) {
// handle number button click
if (v.getTag() != null && "number_button".equals(v.getTag())) {
mPasswordField.append(((TextView) v).getText());
return;
}
switch (v.getId()) {
case R.id.t9_key_clear: { // handle clear button
mPasswordField.setText(null);
}
break;
case R.id.t9_key_backspace: { // handle backspace button
// delete one character
Editable editable = mPasswordField.getText();
int charCount = editable.length();
if (charCount > 0) {
editable.delete(charCount - 1, charCount);
}
}
break;
}
}
public String getInputText() {
return mPasswordField.getText().toString();
}
protected <T extends View> T $(@IdRes int id) {
return (T) super.findViewById(id);
}
}
布局 keyboard.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="8dp">
<EditText
android:id="@+id/password_field"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#eeeeee"
android:enabled="false"
android:minHeight="48dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceMedium"/>
<TableLayout
android:id="@+id/keyboard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:divider="@drawable/keyboard_divider"
android:orientation="vertical"
android:showDividers="beginning|middle|end">
<TableRow style="@style/keyboard_row">
<TextView
android:id="@+id/t9_key_1"
style="@style/keyboard_number_button"
android:text="@string/number_one"/>
<TextView
android:id="@+id/t9_key_2"
style="@style/keyboard_number_button"
android:text="@string/number_two"/>
<TextView
android:id="@+id/t9_key_3"
style="@style/keyboard_number_button"
android:text="@string/number_three"/>
</TableRow>
<TableRow style="@style/keyboard_row">
<TextView
android:id="@+id/t9_key_4"
style="@style/keyboard_number_button"
android:text="@string/number_four"/>
<TextView
android:id="@+id/t9_key_5"
style="@style/keyboard_number_button"
android:text="@string/number_five"/>
<TextView
android:id="@+id/t9_key_6"
style="@style/keyboard_number_button"
android:text="@string/number_six"/>
</TableRow>
<TableRow style="@style/keyboard_row">
<TextView
android:id="@+id/t9_key_7"
style="@style/keyboard_number_button"
android:text="@string/number_seven"/>
<TextView
android:id="@+id/t9_key_8"
style="@style/keyboard_number_button"
android:text="@string/number_eight"/>
<TextView
android:id="@+id/t9_key_9"
style="@style/keyboard_number_button"
android:text="@string/number_nine"/>
</TableRow>
<TableRow style="@style/keyboard_row">
<TextView
android:id="@+id/t9_key_clear"
style="@style/keyboard_button"
android:text="@string/btn_clear"
android:textAppearance="?android:attr/textAppearanceMedium"/>
<TextView
android:id="@+id/t9_key_0"
style="@style/keyboard_number_button"
android:text="@string/number_zero"/>
<TextView
android:id="@+id/t9_key_backspace"
style="@style/keyboard_button"
android:text="@string/btn_backspace"
android:textAppearance="?android:attr/textAppearanceMedium"/>
</TableRow>
</TableLayout>
</LinearLayout>
style.xml
<style name="keyboard_row">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:divider">@drawable/keyboard_divider</item>
<item name="android:gravity">center</item>
<item name="android:showDividers">beginning|middle|end</item>
</style>
<style name="keyboard_button">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">match_parent</item>
<item name="android:layout_weight">1</item>
<item name="android:paddingTop">12dp</item>
<item name="android:paddingBottom">12dp</item>
<item name="android:clickable">true</item>
<item name="android:gravity">center</item>
<item name="android:scaleType">centerInside</item>
<item name="android:background">@drawable/keyboard_button_bg</item>
<item name="android:textAppearance">?android:attr/textAppearanceLarge</item>
</style>
<style name="keyboard_number_button" parent="keyboard_button">
<item name="android:tag">number_button</item>
</style>
可绘制的 keyboard_button_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" android:exitFadeDuration="@android:integer/config_shortAnimTime">
<item android:state_pressed="true">
<shape>
<solid android:color="#dddddd"/>
</shape>
</item>
<item android:state_pressed="false">
<shape>
<solid android:color="@android:color/transparent"/>
</shape>
</item>
</selector>
可绘制的 keyboard_divider.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#dddddd"/>
<size
android:width="1px"
android:height="1px"/>
</shape>
strings.xml
<string name="number_zero">0</string>
<string name="number_one">1</string>
<string name="number_two">2</string>
<string name="number_three">3</string>
<string name="number_four">4</string>
<string name="number_five">5</string>
<string name="number_six">6</string>
<string name="number_seven">7</string>
<string name="number_eight">8</string>
<string name="number_nine">9</string>
<string name="btn_clear">Clear</string>
<string name="btn_backspace">Back</string>
在您的布局中使用自定义的 KeyboardView ：
<com.xxx.yyy.KeyboardView
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
新答案：
键盘布局代码如下：
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/anti_theft_t9_grid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/white_grey"
android:divider="@android:color/darker_gray"
android:orientation="vertical"
android:showDividers="middle|beginning|end" >
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="@android:color/darker_gray"
android:gravity="center"
android:showDividers="middle" >
<TextView
android:id="@+id/anti_theft_t9_key_1"
style="@style/anti_theft_t9_key"
android:text="@string/number_one"
android:textIsSelectable="false" />
<TextView
android:id="@+id/anti_theft_t9_key_2"
style="@style/anti_theft_t9_key"
android:text="@string/number_two"
android:textIsSelectable="false" />
<TextView
android:id="@+id/anti_theft_t9_key_3"
style="@style/anti_theft_t9_key"
android:text="@string/number_three"
android:textIsSelectable="false" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="@android:color/darker_gray"
android:gravity="center"
android:showDividers="middle" >
<TextView
android:id="@+id/anti_theft_t9_key_4"
style="@style/anti_theft_t9_key"
android:text="@string/number_four"
android:textIsSelectable="false" />
<TextView
android:id="@+id/anti_theft_t9_key_5"
style="@style/anti_theft_t9_key"
android:text="@string/number_five"
android:textIsSelectable="false" />
<TextView
android:id="@+id/anti_theft_t9_key_6"
style="@style/anti_theft_t9_key"
android:text="@string/number_six"
android:textIsSelectable="false" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="@android:color/darker_gray"
android:gravity="center"
android:showDividers="middle" >
<TextView
android:id="@+id/anti_theft_t9_key_7"
style="@style/anti_theft_t9_key"
android:text="@string/number_seven"
android:textIsSelectable="false" />
<TextView
android:id="@+id/anti_theft_t9_key_8"
style="@style/anti_theft_t9_key"
android:text="@string/number_eight"
android:textIsSelectable="false" />
<TextView
android:id="@+id/anti_theft_t9_key_9"
style="@style/anti_theft_t9_key"
android:text="@string/number_nine"
android:textIsSelectable="false" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="@android:color/darker_gray"
android:gravity="center"
android:showDividers="middle" >
<TextView
android:id="@+id/anti_theft_t9_key_clear"
style="@style/anti_theft_t9_key"
android:text="@string/anti_theft_keyboard_clear"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textIsSelectable="false" />
<TextView
android:id="@+id/anti_theft_t9_key_0"
style="@style/anti_theft_t9_key"
android:text="@string/number_zero"
android:textIsSelectable="false" />
<ImageView
android:id="@+id/anti_theft_t9_key_backspace"
style="@style/anti_theft_t9_key"
android:contentDescription="@string/app_name_for_anti_theft"
android:src="@drawable/anti_theft_keyboard_backspace"
android:textIsSelectable="false" />
</TableRow>
</TableLayout>
每种键盘风格：
<style name="anti_theft_t9_key">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_weight">1</item>
<item name="android:paddingTop">@dimen/anti_theft_t9_key_paddingTop</item>
<item name="android:paddingBottom">@dimen/anti_theft_t9_key_paddingBottom</item>
<item name="android:clickable">true</item>
<item name="android:gravity">center</item>
<item name="android:scaleType">centerInside</item>
<item name="android:background">@drawable/anti_theft_btn_blue_bg</item>
<item name="android:textAppearance">?android:attr/textAppearanceLarge</item>
</style>
每个按键的响应：
private EditText mEtPassword ;
private void setViews(){
// find view references...
// set OnClickListener to each key view...
}
private void onT9KeyClicked(int key) {
switch (key) {
case R.id.anti_theft_t9_key_0:
mEtPassword.append("0");
break;
case R.id.anti_theft_t9_key_1:
mEtPassword.append("1");
break;
case R.id.anti_theft_t9_key_2:
mEtPassword.append("2");
break;
case R.id.anti_theft_t9_key_3:
mEtPassword.append("3");
break;
case R.id.anti_theft_t9_key_4:
mEtPassword.append("4");
break;
case R.id.anti_theft_t9_key_5:
mEtPassword.append("5");
break;
case R.id.anti_theft_t9_key_6:
mEtPassword.append("6");
break;
case R.id.anti_theft_t9_key_7:
mEtPassword.append("7");
break;
case R.id.anti_theft_t9_key_8:
mEtPassword.append("8");
break;
case R.id.anti_theft_t9_key_9:
mEtPassword.append("9");
break;
case R.id.anti_theft_t9_key_backspace: {
// delete one character
String passwordStr = mEtPassword.getText().toString();
if (passwordStr.length() > 0) {
String newPasswordStr = new StringBuilder(passwordStr)
.deleteCharAt(passwordStr.length() - 1).toString();
mEtPassword.setText(newPasswordStr);
}
}
break;
case R.id.anti_theft_t9_key_clear:
// clear password field
mEtPassword.setText(null);
break;
}
}
- Riki
14
1你实现了我没有在这里发布的strings、drawables、dimens和colors吗？或者你能展示一些代码片段吗？我不知道你遇到了什么问题。 - Riki
3我想提出一个简单的建议。将onClick(View v)设置给所有按键。然后检查这个按键是否是TextView（if v instanceof TextView），如果是，则只需使用mTextView.append(((TextView) v).getText())来追加文本即可。
这样你就不需要多次编写相同的代码行了。 - dephinera
1@NiiLaryea 创建一个新的自定义视图，通过XML将布局填充到构造函数中的新视图中，然后查找并设置每个视图，添加一些公共方法以向外部调用公开一些有用的数据。最后可以在任何地方重复使用此视图。 - Riki
2@NiiLaryea 我为您编写了一个自定义视图，请查看更新的答案。 - Riki
1@ArewegoodQ 我已经定义了一个名为
getInputText() 的方法，它返回密码字段的文本。或者你可以定义自己的方法，返回 password_field TextView 实例。 - Riki显示剩余9条评论
-2
你可以将EditText的inputType设置为number。
<EditText
android:id="@+id/password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="number" >
<requestFocus />
</EditText>
如果您想设置密码字段，可以使用numberPassword
- Keya
3
是的，但我想自定义键盘的外观。 - Zaw Myo Htet
1为此，您需要按照AvatarQing的建议编写自己的键盘布局。根据您的喜好编写颜色和背景的可绘制对象。填充布局并将其设置为KeyboardView。请参考此问题。希望这可以帮助您。如果您需要详细信息，请告诉我。 - Keya
不按照问题所要求的显示，会打开默认的数字键盘。 - Ananta Prasad
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接