Androidの支払いパスワード入力ボックスは、簡単な分析を実現します。

まず効果図を見ます。


実現の考え方:
点となるコントロールはTextViewおよびEditTextではなく、Imageviewである。まず、RelativeLayoutの中に6つのImageViewと1つのEditTextが含まれていると書いてください。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>

ユーザー定義のコントロールImageViewは、レイアウトにいくつかの処理を行うために使用され、ポイントはEditTextのカーソルを削除し、入力文字のイベントを傍受し、文字の変化後に文字を一つのItemPasswordLayoutに置いて、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  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);
 }
}

次はedittextで呼び出すだけでいいです。
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();
   }
  });

締め括りをつける
はい、本文の内容はこれで終わります。これでいいです。簡単ではないですか？この文章が皆さんの学習や仕事に役立つことを願っています。もし疑問があれば、メッセージを残して交流してください。