English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
効果図を確認してください
実現方法：
変換されたコントロールはTextViewやEditTextではなくImageviewです。まずRelativeLayoutを書き、以下の要素を含めます。6個ImageViewとEditText（EditTextはImageViewを覆う必要があります）を配置し、EditTextの背景を透明に設定します。
<?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="wrap_content"> <LinearLayout android:layout_width="match_parent" android:layout_height="50dp" android:orientation="horizontal" android:background="@android:color/white"> <ImageView android:id="@"+id/item_password_iv1" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@mipmap/nopassword"/> <ImageView android:id="@"+id/item_password_iv2" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@mipmap/nopassword"/> <ImageView android:id="@"+id/item_password_iv3" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@mipmap/nopassword"/> <ImageView android:id="@"+id/item_password_iv4" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@mipmap/nopassword"/> <ImageView android:id="@"+id/item_password_iv5" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@mipmap/nopassword"/> <ImageView android:id="@"+id/item_password_iv6" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@mipmap/nopassword"/> </LinearLayout> <EditText android:id="@"+id/item_edittext" android:layout_width="match_parent" android:layout_height="50dp" android:background="@android:color/transparent"/> </RelativeLayout>
自定义一个控件ItemPasswordLayout，用来给布局做一些处理，重点是将EditText的光标去掉，并监听输入文字的事件在文字变化后将文字放在一个StringBuffer中，并将edittext设置为"";再监听按下键盘删除键的事件，当按下删除键后会将StringBuffer中删除相应位置的字符。
/**
* パスワード入力ボックスのコントロールレイアウト
* Created by Went_Gone on 2016/9/14.
*/
public class ItemPasswordLayout extends RelativeLayout{
private EditText editText;
private ImageView[] imageViews;//パスワードボックスを格納する配列を使用
private StringBuffer stringBuffer = new StringBuffer();//パスワード文字を保存
private int count = 6;
private String strPassword;//パスワード文字列
public ItemPasswordLayout(Context context) {
this(context,null);
}
public ItemPasswordLayout(Context context, AttributeSet attrs) {
this(context, attrs,0);
}
public ItemPasswordLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
imageViews = new ImageView[6];
View view = View.inflate(context, R.layout.item_password,this);
editText = (EditText) findViewById(R.id.item_edittext);
imageViews[0] = (ImageView) findViewById(R.id.item_password_iv1);
imageViews[1] = (ImageView) findViewById(R.id.item_password_iv2);
imageViews[2] = (ImageView) findViewById(R.id.item_password_iv3);
imageViews[3] = (ImageView) findViewById(R.id.item_password_iv4);
imageViews[4] = (ImageView) findViewById(R.id.item_password_iv5);
imageViews[5] = (ImageView) findViewById(R.id.item_password_iv6);
editText.setCursorVisible(false);//光标を隠す
setListener();
}
private void setListener() {
editText.addTextChangedListener(new TextWatcher() {}}
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2}) {
}
@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2}) {
}
@Override
public void afterTextChanged(Editable editable) {
//ポイント：文字が""でない場合にのみ操作を行います
if (!editable.toString().equals("")) {
if (stringBuffer.length()>5){
//パスワードの長さが5桁数が0の場合、edittextを空にします
editText.setText("");
return;
}else {
//文字をStringBufferに追加
stringBuffer.append(editable);
editText.setText("");//追加した後、EditTextを空にし、文字が入力されていないエラーが発生します
Log.e("TAG", "afterTextChanged: stringBuffer is "+stringBuffer);
count = stringBuffer.length();//stringbufferの長さを記録
strPassword = stringBuffer.toString();
if (stringBuffer.length()==6){
//文字の長さが6 則呼び出し完了した入力のリスナー
if (inputCompleteListener!=null){
inputCompleteListener.inputComplete();
}
}
}
for (int i =0;i<stringBuffer.length();i++){
imageViews[i].setImageResource(R.mipmap.ispassword);
}
}
}
});
editText.setOnKeyListener(new OnKeyListener() {
@Override
public boolean onKey(View v, int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_DEL
&& event.getAction() == KeyEvent.ACTION_DOWN) {
// Log.e("TAG", "afterTextChanged: stringBuffer is "+stringBuffer);
if (onKeyDelete()) return true;
return true;
}
return false;
}
});
}
public boolean onKeyDelete() {}}
if (count==0){
count = 6;
return true;
}
if (stringBuffer.length()>0){
//指定された位置の文字を削除します。
stringBuffer.delete((count-1),count);
count--;
Log.e("TAG", "afterTextChanged: stringBuffer is "+stringBuffer);
strPassword = stringBuffer.toString();
imageViews[stringBuffer.length()].setImageResource(R.mipmap.nopassword);
}
return false;
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
return super.onKeyDown(keyCode, event);
}
private InputCompleteListener inputCompleteListener;
public void setInputCompleteListener(InputCompleteListener inputCompleteListener) {
this.inputCompleteListener = inputCompleteListener;
}
public interface InputCompleteListener{
void inputComplete();
}
public EditText getEditText() {
return editText;
}
/**
* パスワードを取得します。
* @return
*/
public String getStrPassword() {
return strPassword;
}
public void setContent(String content){
editText.setText(content);
}
}
次に、Activityで呼び出すだけで大丈夫です。
xmlに宣言されています。
<com.example.went_gone.demo.view.ItemPasswordLayout> android:id="@"+id/act_zhifubao_IPLayout android:layout_width="match_parent" android:layout_height="wrap_content"> </com.example.went_gone.demo.view.ItemPasswordLayout>
Activity内で呼び出し
itemPasswordLayout = (ItemPasswordLayout) findViewById(R.id.act_zhifubao_IPLayout);
itemPasswordLayout.setInputCompleteListener(new ItemPasswordLayout.InputCompleteListener() {
@Override
public void inputComplete() {
Toast.makeText(ZhifubaoActivity.this, "パスワードは："+itemPasswordLayout.getStrPassword(), Toast.LENGTH_SHORT).show();
}
});
まとめ
それでは、本文の内容はここで終わりです。これで十分ですよね。簡単ですよね。この記事が皆さんの学習や仕事に少しでも役立つことを願っています。何か疑問があれば、コメントを残してください。
声明：本文の内容はインターネットから収集され、著作権者に帰属します。インターネットユーザーが自発的に貢献し、自己でアップロードしました。本サイトは所有権を持ちません。また、人工編集は行われていません。著作権侵害の疑いがある場合は、メールを送信してください：notice#oldtoolbag.com（メールの際は、#を@に変更してください）で報告し、関連する証拠を提供してください。一旦確認がついたら、本サイトは即座に侵害疑いのコンテンツを削除します。