custom button 을 익히는 과정에서 기록해놓은 글입니다.
TextView 를 상속해서 구현된 Button 위젯은 보통 일반적으로 텍스트를 넣습니다.
그러나 이미지를 넣어서 구현하면 좀더 나은 UI를 만들수가 있습니다.
1. 먼저 res/drawable 폴더를 만듭니다.
그리고 다음의 android_button.xml 을 추가합니다.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="@drawable/android_pressed"
android:state_pressed="true" />
<item android:drawable="@drawable/android_focused"
android:state_focused="true" />
<item android:drawable="@drawable/android_normal" />
</selector>
위 selector 를 보면 state_pressed 상태이면 android_pressed 이미지가 보이고 state_focused 인 상태이면 android_focused 이미지가 보이며 나머지 경우에 android_normal 이미지가 보이게끔 되어있습니다.
2. 아래 이미지를 res/drawable-mdpi 에 넣습니다.
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:background="@drawable/android_button"
android:onClick="onButtonClicked"/>
background 에 1번에서만든 resource파일인 android_button.xml 으로 설정하였습니다.
그리고 onButtonClicked 리스터를 등록하였습니다.
4. 이미지버튼을 추가할 Activity 에 onButtonClicked를 등록합니다.
public void onButtonClicked(View v) {
// Do something when the button is clicked
Toast.makeText(TestProjectActivity.this, "Button clicked", Toast.LENGTH_SHORT).show();
}
5. 소스를 실행시키면 다음과 같이 click 했을때와 normal 일 때의 버튼을 볼수가 있습니다.
