[강좌] 안드로이드 사용자정의 테마 만들기 2

[강좌] 안드로이드 사용자정의 테마 만들기 2

안녕하세요 한달넘게 강좌를 못쓰고 있었네요.ㅠㅠ
핑계지만 바쁜것도 있엇고 게으른것도 있었습니다. ^^
무언가를 꾸준히 한다는건 정말 어려운일 같네요 ^^

지난번 강좌에서는 간단히 Button 의 색상을 입혀보았습니다.
하지만 단순히 Button 의 배경만 입혔지요?
네~ 이젠 마우스 아니 손가락 터치의 반응을 하는 버튼을
테마를 통해 지정해 보도록 하겠습니다.^^

뭐 실제론 그리 대단한것도 아니고 별거없습니다.
처음이 어려운거지 한번 알면 정말 쉬운거랍니다. ^^

01.jpg

지난번에 입혔던 Button 입니다. 빨간색이 너무 눈에 튀는군요~
디자인 감각이 영 꽝인 개발자에게 RGB(Red, Green, Blue) 는 신의 선물입니다.

이제 Button 의 이벤트별 배경지정을 할 차례입니다.
그중 알아야할 첫번째는 selector 입니다.
이 것은 여러가지 이벤트별로 테마 또는 스킨을 지정할수가 
있도록 되어 있습니다.

우선 필자는 강좌 차원에서 selector 관련 xml 은 기본 drawabel 폴더를
생성후 이 폴더에 생성하겠습니다.
단말기 해상도별로 selector를 설정하려면 당연히 관련 해상도 폴더에 생성하시면 됩니다.
해상도 정보를 상세히 보려면 다음 링크를 참고 하세요
http://developer.android.com/guide/practices/screens_support.html

다음과 같이 필자는 drawable 폴더를 생성했습니다.
02.jpg

그리고 Android Xml 메뉴를 선택합니다.
03.jpg

04.jpg

흠…이런…아쉽게 위 화면에서는 selector 관련 xml 이 없군요
어쩔수 없이 강제로 생성하겠습니다.

05.jpg

06.jpg

파일명을 알아보기 쉽게 selector_button_blue_style.xml 라고 지정했습니다.
생성한 xml 파일을 열어 다음과 같이 입력합니다.



간단히 이 xml 에 대해 살펴보도록 하겠습니다.
selector 는 말그대로 selector 라는걸 지정한것입니다.
중요포인트는 item Child 입니다.

“android:state_pressed” 함은 말 그대로 누른 상태가 == true 즉 사실일 경우
“android:drawable” 를 즉 배경을 “#0000FF” 파란색으로 그리라는 의미가 되구요.
전체적으로 보면 객체(버튼)눌렸을때 파랑, 포커스가 왔을때 녹색, 선택되었을때 노랑이라는 뜻입니다.
그리고 제일 마지막은 아무것도 하지 않았을때 빨강을 그리라는 의미가 되겠지요~
장황하게 설명했지만 정말 간단하지 않나요?

07.jpg

흠 하지만 보시는거와 같이 오류가 납니다.

혹시 android:background=”#0000FF” 하면 되지 않느냐고 말씀 하실수도 있지만
이렇게 하면 컴파일시에는 오류가 나지 않지만 실제 컴파일후 어플을 구동하면
다음과 같은 심각한 에러와 함께 프로그램이 종료됩니다.

ERROR/AndroidRuntime(315): Caused by: org.xmlpull.v1.XmlPullParserException: Binary XML file line #3: tag requires a ‘drawable’ attribute or child tag defining a drawable

이말은 item 속성에 drawable 라는 태그가 정의 되지 않았다는 의미군요
Button 테마를 background로 지정하기 때문에 drawable 라는 그려야할 데이터가 필요한것으로 예상됩니다. ^^
그러므로 #FF0000 같은 색상값을 쓸수가 없는것 같습니다.

그래서 색을 지정하는 colors.xml 이라는 resource 가 더 필요합니다.
colors.xml 파일을 생성합니다.

09.jpg

10.jpg

그리고 다음과 같이 입력하고 저장합니다.
11.jpg



그리고 이젠 오류가 났던 selector_button_blue_style.xml 파일을 열어 다음과 같이 수정합니다.
12.jpg



흠…이젠 오류가 사라졌네요~

이제 우리가 만든 Button 에 이 selecrot 를 연결만 해주면 이제 끝납니다.
흠…연결방법은 총 3가지가 있습니다. 
직접 Button 에 지정하는 방법, 직접 Button 스타일로 지정하는 방법, 사용자 정의 테마로 지정하는 방법

지난강좌가 사용자 테마 강좌이기 때문에 필자는 테마로 지정 할 것 입니다.
이미 지난 강좌에서 Button 을 테마로 지정해 놓았기때문에 더욱 지정하는게 쉽습니다.

우선 theme.xml 은 이미 지난강좌에서 Button 테마로 지정했기때문에 손델것이 없습니다.
그럼 style.xml 파일을 열어 보겠습니다.
다음과 같이 수정합니다.

08.jpg


자 이제 다 완성이 되었습니다. 살포시 Ctrl + F11 키를 눌러봅니다.^^

13.jpg
14.jpg

제대로 동작되는거 같군요^^
흠 기본적인 Button 동작하는 테마를 완성은 했지만 어딘가 2% 부족한거 같네요

그래서 다음강좌에서는 Button 모양을 좀더 이쁜 모양을 바꿔보도록 하겠습니다.
차분이 읽어주셔서 감사합니다.

]]>

도큐멘트 에 올린 글

댓글 남기기