English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Analyse superficielle de la mise en œuvre du champ d'entrée du mot de passe de paiement Android

Regardons d'abord l'effet visuel

Approche d'implémentation :

Le contrôle qui devient des points n'est pas TextView et EditText, mais Imageview. Écrivez d'abord un RelativeLayout contenant6Un ImageView et un EditText (EditText doit couvrir l'ImageView) mettez le fond de l'EditText en transparence.

<?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>

Définir un contrôle ItemPasswordLayout, utilisé pour effectuer certaines opérations sur le layout, notamment supprimer le curseur d'EditText, et écouter les événements de saisie de texte. Lorsque le texte change, mettez le texte dans un StringBuffer, et réglez l'éditeur de texte sur ""; écoutez également l'événement de suppression de la touche de suppression du clavier, lorsque vous appuyez sur la touche de suppression, supprimez le caractère correspondant du StringBuffer.

/**
 * disposition des contrôles de la boîte de saisie de mot de passe
 * Créé par Went_Gone le 2016/9/14.
 */
public class ItemPasswordLayout extends RelativeLayout{
 private EditText editText;
 private ImageView[] imageViews;//utiliser un tableau pour stocker les champs de mot de passe
 private StringBuffer stringBuffer = new StringBuffer();//enregistrer les caractères du mot de passe
 private int count = 6;
 private String strPassword;//chaîne de mot de passe
 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);//cacher le curseur
  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){
   //supprimer le caractère à la position correspondante
   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;
 }
 /**
  * obtenir le mot de passe
  * @return
  */
 public String getStrPassword() {
  return strPassword;
 }
 public void setContent(String content){
  editText.setText(content);
 }
}

Ensuite, il suffit d'appeler l'Activity.

déclarer dans 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>

Appel dans Activity

 itemPasswordLayout = (ItemPasswordLayout) findViewById(R.id.act_zhifubao_IPLayout);
  itemPasswordLayout.setInputCompleteListener(new ItemPasswordLayout.InputCompleteListener() {
   @Override
   public void inputComplete() {
    Toast.makeText(ZhifubaoActivity.this, "Le mot de passe est :"+itemPasswordLayout.getStrPassword(), Toast.LENGTH_SHORT).show();
   }
  });

Résumé

Bien, le contenu de cet article est terminé ici, c'est tout, n'est-ce pas simple ? J'espère que cet article peut apporter un certain aide à votre apprentissage ou à votre travail, si vous avez des doutes, vous pouvez laisser des commentaires pour échanger.

Déclaration : Le contenu de cet article est issu d'Internet, les droits d'auteur appartiennent aux propriétaires respectifs, le contenu est contribué et téléversé par les utilisateurs d'Internet, ce site ne détient pas de droits de propriété, n'a pas été traité par l'éditeur humain et n'assume aucune responsabilité juridique. Si vous trouvez du contenu suspect de violation de droits d'auteur, vous pouvez envoyer un e-mail à : notice#w3Déclaration : Le contenu de cet article est issu d'Internet, les droits d'auteur appartiennent aux propriétaires respectifs, le contenu est contribué et téléversé par les utilisateurs d'Internet, ce site ne détient pas de droits de propriété, n'a pas été traité par l'éditeur humain et n'assume aucune responsabilité juridique. Si vous trouvez du contenu suspect de violation de droits d'auteur, vous pouvez envoyer un e-mail à : notice#w

Vous pourriez aussi aimer