Recentemente escrevi um artigo abordando sobre as novidades da biblioteca Support Design 28, porém hoje gostaria de apresentar um recurso muito interessante que está disponível desde a versão 24. 

Para esta implementação, utilizaremos as regras de campo de texto apresentadas na documentação oficial do Material Design, utilizando componentes básicos, com tema padrão que virá ao criarmos um novo projeto.

Antes de mas nada, eu recomendo que você se certifique que estamos utilizando API 24 ou superior na dependência Support Design.

dependencies {
    ...
    compile 'com.android.support:design:24.2.0'
}

Nós iremos utilizar o componente TextInputEditText para inserir a senha, junto a eles iremos utilizar a propriedade inputType=”textPassword”

<android.support.design.widget.TextInputEditText
            android:id="@+id/campo_senha"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Senha"
            android:inputType="textPassword" />

Abaixo, algumas propriedades que serão responsáveis por deixar a visibilidade ativa.

  • passwordToggleEnabled – esta propriedade tem valores booleanos que  permitem ligar/desligar a visibilidade da senha.
  • passwordToggleDrawable – permite que você defina um ícone para o botão de visibilidade da senha.
  • passwordToogleTint – responsável por definir uma cor ao ícone do botão toggle.

Seguindo as boas práticas, eu recomendo que você insira o InputEditText dentro de um InputTextLayout, então o código completo ficará assim:

 <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">


        <android.support.design.widget.TextInputEditText
            android:id="@+id/campo_usuario"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Usuário" />

    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:passwordToggleDrawable="@drawable/ic_remove_red_eye_black_24dp"
        app:passwordToggleEnabled="true"
        app:passwordToggleTint="@color/colorAccent">

        <android.support.design.widget.TextInputEditText
            android:id="@+id/campo_senha"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Senha"
            android:inputType="textPassword" />

    </android.support.design.widget.TextInputLayout>

Espero que tenham gostado do recurso apresentado, utilizando em uma tela de cadastro ou login, seu aplicativo acabará apresentando mais acessibilidade ao usuário.