English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Primeiro vamos ver o efeito da imagem
Pensamento em implementação:
O controle que se torna pontos não é TextView e EditText, mas ImageView. Primeiro escreva um RelativeLayout que contém6Um ImageView e um EditText (o EditText deve cobrir o ImageView) configuram o fundo do EditText como transparente.
<?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>
Customizar um controle ItemPasswordLayout, usado para fazer alguns tratamentos no layout, o ponto principal é remover o cursor do EditText e monitorar o evento de entrada de texto. Quando o texto muda, coloca o texto em um StringBuffer e configura o edittext como ""; novamente, monitora o evento de pressionar a tecla de exclusão do teclado, e quando a tecla de exclusão é pressionada, remove o caractere correspondente do StringBuffer.
/** * Layout do controle da caixa de entrada de senha de senha * Criado por Went_Gone em 2016/9/14. */ public class ItemPasswordLayout extends RelativeLayout{ private EditText editText; private ImageView[] imageViews;//Usar um array para armazenar a caixa de entrada de senha private StringBuffer stringBuffer = new StringBuffer();//Armazenar caracteres de senha private int count = 6; private String strPassword;//Cadeia de caracteres de senha 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);//O cursor deve ser escondido 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) { //key point if the character is not "" then perform the operation if (!editable.toString().equals("")) { if (stringBuffer.length()>5}{ //if the password length is greater than5when the length is editText.setText(""); return; } else { //add text to StringBuffer stringBuffer.append(editable); editText.setText("");//after adding, set EditText to empty causing no text input error Log.e("TAG", "afterTextChanged: stringBuffer is "+stringBuffer); count = stringBuffer.length();//record the length of stringbuffer strPassword = stringBuffer.toString(); if (stringBuffer.length()==6}{ //text length is6 then call the listener for completing input 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){ //Remover o caractere na posição correspondente 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; } /** * Obter a senha * @return */ public String getStrPassword() { return strPassword; } public void setContent(String content){ editText.setText(content); } }
Em seguida, basta chamar no Activity.
em xml declarar
<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>
Chamada no Activity
itemPasswordLayout = (ItemPasswordLayout) findViewById(R.id.act_zhifubao_IPLayout); itemPasswordLayout.setInputCompleteListener(new ItemPasswordLayout.InputCompleteListener() { @Override public void inputComplete() { Toast.makeText(ZhifubaoActivity.this, "A senha é:",+itemPasswordLayout.getStrPassword(), Toast.LENGTH_SHORT).show(); } });
Resumo
Bom, o conteúdo deste artigo terminou aqui, assim é suficiente, não é simples? Espero que este artigo possa ajudar vocês a aprenderem ou a trabalharem, se tiverem dúvidas, podem deixar mensagens para trocar
Declaração: O conteúdo deste artigo é extraído da Internet, pertence ao autor original, o conteúdo é contribuído e carregado voluntariamente pelos usuários da Internet, este site não possui direitos de propriedade, não foi editado manualmente e não assume responsabilidades legais relevantes. Se você encontrar conteúdo suspeito de violação de direitos autorais, por favor, envie um e-mail para: notice#w3Aviso: O conteúdo deste artigo é extraído da Internet, pertence ao autor original, o conteúdo é contribuído e carregado voluntariamente pelos usuários da Internet, este site não possui direitos de propriedade, não foi editado manualmente e não assume responsabilidades legais relevantes. Se você encontrar conteúdo suspeito de violação de direitos autorais, por favor, envie um e-mail para: notice#w