(Button) Selector사용 방법

버튼은 TextView를 상속받은 class로 TextView와 동일한 속성을 가지면 TextView의 background에 selector라고 하는 상태에 따라 다른 이미지를 보여주는 리소스를 설정하여 버튼처럼 보이도록 만듭니다.

selector을 만들기 위해서는 눌렸을 때와 눌리지 않았을 때의 이미지가 필요하고 이미지를 추가하기 위해서는 drawable 디렉토리를 생성해야합니다.

Android를 Project로 변경하고 app -> src -> main -> res 에서 new -> Android resource directory를 선택합니다.

New Resource Directory에서 Resource type을 drawable로 하고 Available qualifiers에서 Density를 선택한 다음 X-High Density를 선택합니다.

리소스를 추가하기 위해서는 이미지를 복사하여 붙여넣기를 반복하면 됩니다. 

주의

• 이미지를 drawable폴더에 넣을 때 단말의 dpi에 따라 다른 폴더에 넣어야 합니다.

• 리소스로 추가되는 이미지의 이름은 소문자, _ , 숫자로만 되어 있고, 숫자로 시작하면 안 됩니다.

Selector를 생성하기 위해서는 res/drawable에서 New -> Drawable resource file을 선택합니다.

File name으로 button_selector라고 적고 Root Element는 selector를 선택합니다.

이때, 파일이름은 반드시 소문자, _ , 숫자로만 구성되고 숫자로 시작하면 안 됩니다.

자 그럼 이제  drawable 에 button_selector.xml 파일이 생겼을 것입니다.

selector는 내부에 item을 가지며 item은 drawable과 state를 가지고 있습니다. 해당 state일 때 어떤 drawable을 보여줄지 설정하면 됩니다.

selector는 위에서 아래로 상태에 대한 매칭을 실시하기 때문에 위에 더 상세 조건이 적히고 아래로 갈 수록 좀더 큰 조건이 적히는 형식으로 작성되어야 한다.

button_selector.xml 파일에 아래의 내용을 추가하였습니다. 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/btn_default_pressed" android:state_pressed="true" />
    <item android:drawable="@drawable/btn_default_normal_holo_light" />
</selector>

main.xml에는 아래와같이 선언했습니다.

<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/button_selector"
        android:text="Selector1" />

샘플예제를 올렸으니 참고하시면 정말 많은 도움이 될것입니다!!!

안드로이드에서는 색깔을 가지고 이미지처럼 만들어서 사용할 수 있도록 기능을 제공합니다.

/res/values에 drawables.xml을 만들고, 여기에 Drawable을 추가한 다음 Name과 Value를 적어주면 해당 색을 가지는 이미지가 만들어 집니다.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <drawable name = "pressed_drawable">#0000FF</drawable>
    <drawable name = "normal_drawable">#00FF00</drawable>
</resources>

drawable폴더에 button_selector2.xml을 만들었고 아래와 같은 내용으로 선언합니다.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/pressed_drawable" android:state_pressed="true"/>
    <item android:drawable="@drawable/normal_drawable" />
</selector>

main.xml의 두번째 버튼을 아래와 같이 선언합니다.

<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/button_selector2"
        android:text="Selector2" />

pressed 상태 종류 

android:state_enable : 사용 가능 상태

android:state_selected : 선택 상태 

android:state_pressed : 클릭 상태 (눌려있는 경우) 

android:state_focused : 포커스 상태 

android:state_checked : 체크된 상태

StudySelectorTest.zip