안드로이드/Android XML Selector 사용 하기

안드로이드/Android XML Selector 사용 하기

안드로이드 버튼을 만들때 background 이미지를 사용하여 버튼을 만듭니다. 그런데 버튼이 클릭 시와 클릭이 아닐시 이미지를 다르게 가져가고 싶다면 어떻게 해야 할까요?  onTouchEvent로 터치했을때와 터치를 벋어날 경우를 따로 구현 해주어야만 할까요? 아닙니다. ㅎㅎ 그럴 경우 selector라는 속성을 이용하면 되는데요. selector는 이미지의 상태의 따라 값을 설정해주고 컨트롤 해주는 기능을 가지고 있습니다.

그러므로 selector를 이용한 작업을 할 경우 코드가 훨씬가 더 간결해지고 불필요한 코드를 줄일 수 있습니다. 자 그럼 지금부터 selector를 사용 하는 방법을 알아 보겠습니다.

해당Project -> res폴더 -> drawable폴더에 사용하고자 하는 selector를 만들어 줍니다.  ex) selector_btn_click.xml

보통의 selector를 이용할 경우 눌렀을 경우와, 누르지 않을 경우가 기본적으로 많이 사용 될텐데요,  그럴 경우는 아래와 같은 방법으로 selector를 구성해 줍니다.
<item android:state_pressed="true" <-- 클릭이 되었을 경우 해당 이미지를 넣어 줍니다.
<item android:state_pressed="false" <-- 클릭이 되지 않은 경우 해당 이미지를 넣어 줍니다.
< 아래의 selector 이미지는 예제 이미지 입니다. 수정 하셔야 합니다. >  
 

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

 

selector는 클릭(Pressed) 상태뿐 아니라 다른 상태들도 지원하기 때문에 상황에 맞는 상태를 선택하여 사용하시면 됩니다.
android:state_enabled = 현재 사용 가능 상태일 경우 (유무)
android:state_selected = 현재 선택된 경우 (유무)
android:state_pressed = 현재 클릭이 된 경우 (유무)
android:state_focused = 현재 포커스를 가진 경우 (유무)
android:state_selected = 현재 선택된 경우 (유무)
android:state_checked = 현재 체크된 경우 (유무)
< 아래의 selector 이미지는 예제 이미지 입니다. 수정 하셔야 합니다. >   

<?xml version="1.0" encoding="utf-8"?>   <selector  xmlns:android="http://schemas.android.com/apk/res/android">                  <item                         android:state_enabled="false"                        android:drawable="@drawable/btn_01_touch" />                   item                         android:state_selected="true"                                       android:drawable="@drawable/btn_01_touch" />                 <item                                            android:state_pressed="true"                                          android:drawable="@drawable/btn_01_touch" />                 <item                                        android:state_focused="true"                                          android:drawable="@drawable/btn_01_touch" />                 <item                                          android:state_selected="false"                                        android:drawable="@drawable/btn_01_nor" />                 <item                                           android:state_checked="true"                                          android:drawable="@drawable/btn_01_touch" />    </selector>

     

모든 selector설정이 끝난후 Button의 background에 selector를 적용 한 모습 입니다. 이제 selector를 적용했으니 Button의 상태에 따라 selector에 설정한 이미지들이 화면에 표시 됩니다.

<Button                        android:id="@+id/btn_name"                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:background="@drawable/selector_btn_click"                        />

 


주의사항!! : Selector가 enabled, selected 등 여러개가 설정이 되있을 경우 맨 마지막 속성에 따라 이미지가 변경 됩니다.

ex)

enabled = "true"

selected = "true"

라고 설정이 되있을 때 둘다 해당되는 속성이면 마지막 속성의 selector 이미지를 나타 냅니다.