[Android]안드로이드 토글 버튼 만들기.

What  id Toggle Button?

토글 버튼이란 건 다양한 형태로 존재한다. 

이번 포스팅은 평소에 많이 접해 왔지만

우리가 몰랐던 토글 버튼에 대하여 다루고자 한다. 

 

구글 로그인 화면 

 

구글 로그인 화면중 비밀번호 입력 화면이다. 

비밀 번호 입력 텍스트 안에
눈 모양 이모티콘을 클릭하면 안의 비밀번호가 보이고 

빗금진 눈 모양 이모티콘을 클릭하면 비밀번호가 보이지 않는다. 

What is difference toggle button and button?

 

 

이 점이 일반 버튼과는 다른 토글 버튼 다른 부분이다. 

바로 상태를 갖는 다는 것이다. 

 

일반적인 버튼은 꾹 누르고 그 상태에서 끝이지만 

토글 버튼은 전구의 스위치처럼 On/Off 상태를 갖는다. 

 

이와 같은 기능을 안드로이드에서 imageButton과 같이 구현하려고 하면 

번거롭기 짝이 없을 것이다. 

 

백문이불여일타로 어떻게 이루어져 있는지 확인해 보자. 

 

---

XML에 해당 위젯을 추가하자. 

    <ToggleButton
            android:id="@+id/toggle"
            android:background="@drawable/rounded_rectangle_solid"
            android:textOn=""
            android:textOff=""
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

textOn="" / textOff ="" 를 하는 기본적인 이유는 자동으로 토글 버튼이 켜지고 꺼졌을 때 

지정되어 있는 text값을 빈 값으로 설정해 놓기 위해 저렇게 세팅해 놓는다. 

 

일반적인 누르고 다름의 의미는 background로 정할 수 있다. 

android > res > drawable에 우클릭을 하고 Drawable Resource File을 추가하고 

이름을 toggle_selector 같이 토글 버튼 만을 위한 xml이라고 명시해주고 아래와 같은 코드를 추가하자. 

 

---

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_checked="false"
              android:drawable="@drawable/ic_inivisble" />
        <item android:state_checked="true"
              android:drawable="@drawable/ic_visible" />
    </selector>
</selector>

기본적으로 false라고 setting 했을때 보이지 않는 아이콘 

true라고 설정 해 놓는다면 보여지는 아이콘으로 설정할 수 있다.