본문 바로가기
안드로이드 자바

[Java][Android] TextInputLayout 을 사용한 비밀번호 가시성 토글 기능

by teamnova 2024. 11. 26.
728x90

안녕하세요

 

오늘은 Material Design 의 TextInputLayout을 이용해서 간편하게 비밀번호 가시성 토글기능을 구현해보도록 하겠습니다.

 

전체 코드입니다.

 

activity_main.xml

 

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:context=".MainActivity">

    <com.google.android.material.textfield.TextInputLayout
      android:id="@+id/textInputLayout"
      android:layout_width="0dp"
      android:layout_height="wrap_content"
      android:hint="비밀번호"
      app:endIconMode="password_toggle"
      app:layout_constraintTop_toTopOf="parent"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintHorizontal_bias="0.5"
      android:layout_marginStart="16dp"
      android:layout_marginEnd="16dp"
      android:layout_marginTop="24dp">

        <com.google.android.material.textfield.TextInputEditText
          android:id="@+id/textInputEditText"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:inputType="textPassword"
          />
    </com.google.android.material.textfield.TextInputLayout>
    

</androidx.constraintlayout.widget.ConstraintLayout>

 

TextInputLayout를 사용하여

app:endIconMode="password_toggle"

 

속성을 설정해주면, 비밀번호 가시성 토글 아이콘이 생성됩니다.

 

그 후, inputType을 textPassword로 설정해주면

비밀번호 가시성 토글 기능을 번거롭게 직접 구현할 필요 없이, 간편하게 구현할 수 있습니다.

 

시연 영상입니다.