[부스트코스] 안드로이드 프로그래밍 09 - 나인패치 이미지와 비트맵 버튼

나인패치 이미지

화면에 위젯을 추가하면 배경을 설정할 수 있죠?

그런데 그 배경은 원래 배경의 크기와는 상관없이 철저하게 위젯의 크기에 맞춰지기 때문에

위젯이 커지면 배경 이미지가 늘어나면서 왜곡이 생기게 됩니다.

그런 왜곡을 막기 위해서, 늘어날 수 있는 부분과 그렇지 않은 부분을 설정해놓은 이미지가 바로 나인패치 이미지입니다.

 

나인패치 이미지를 열어보면 아래와 같이 검은 줄이 그어진 부분이 있습니다. 이 부분들이 늘어날 수 있는 부분이고, 이 줄이 없는 부분이 늘어날 수 없는 부분입니다. 이 검은 줄(정보 픽셀)이 포함되어야 하기 때문에 나인패치 이미지는 다른 이미지보다 픽셀이 하나 더 많습니다.

그러면 화면에 추가하여 비교해보겠습니다.

나인패치 이미지는 확장자 앞에 .9가 붙는데요, 나인패치 이미지를 구분하기 위한 부분으로 코드 상에서 이 이미지를 호출할 때는 .9를 빼고 호출합니다.

위처럼 기본 이미지는 끝 부분까지 늘어나는데, 나인패치 이미지는 길이가 길어져도 끝부분이 늘어나지 않아 훨씬 더 깔끔해 보입니다.

 

비트맵 버튼

비트맵 버튼은 버튼을 새로 만드는 것인데요, 기존에 배운 버튼에 쓸 모양을 드로어블로 새로 만드는 것을 넘어

안드로이드 스튜디오에 없는 새로운 버튼을 직접 정의하는 것입니다.

이는 상속을 통해서 가능합니다. 저희가 만든 버튼이 안드로이드 스튜디오의 버튼을 상속하여 기존 버튼의 기능을 그대로 가져오되, 필요한 기능은 추가하여 새로운 버튼을 만드는 것이지요.

 

그럼 만들어봐야겠죠? 눌렀을 때 색이 변하는 비트맵 버튼을 만들어 보겠습니다.

프로젝트 창에서 java - com.example.Button에서 새 java 클래스를 추가합니다.

Superclass는 AppCompatButton으로 설정합니다. Button대신 AppCompatButton으로 설정하는 이유는 호환성이 더 좋기 때문이죠.

 

java 파일의 내용은 위와 같이 구성할 수 있습니다.

보시다시피 안드로이드의 필수 생성자는 두 가지인데요,

첫번째는 소스 파일에서 new Button을 선언하여 추가하는 생성자

두번째는 xml레이아웃에서 태그를 추가해서 만들때 사용되는 생성자입니다.

 

초기화하는 메소드에는 초기 색상 설정, 텍스트 크기 설정 등이 포함됩니다.

단, 텍스트 크기는 픽셀 단위로만 설정할 수 있습니다.

만약 dp단위로 크기를 설정하고 싶다면

별도로 dimens.xml파일을 만들어서 text_size를 설정해주어야 합니다. 

눌렀을 때 다른 색으로 변하는 기능은 이벤트로 구현합니다

OnTouchEvent를 재정의하여 조건문을 달아주고,

해당 조건에 대해서 배경을 지정하는 메소드를 넣어 주면 됩니다.

setBackgroundResource(R.drawable.title_bitmap_button_clicked);

글자 색도 바꾸고 싶다면 마찬가지로 글자 색을 바꾸는 메소드를 같이 넣어 주면 됩니다.

 

조건문의 바깥에는 invalidate();를 호출하여 줍니다. 이는 버튼을 다시 그리는 메소드입니다.

 

이렇게 해서 눌렀을 때 배경 색이 변하는 버튼이 완성되었습니다.

 

1. 나인패치 이미지를 그래픽 프로그램을 이용해 직접 만들어볼 수도 있을까요?
   
   - 필요한 정보만 정확히 구성해준다면 가능할거라고 생각합니다.
   
   
2. 버튼의 배경 이미지가 바뀌는 기능을 좀 더 간단한 방법으로 만들 수는 없을까요?
   
   - 드로어블을 활용한 것이 좀더 간단하기는 하지만 이 방법을 사용하면 버튼 자체에 기능이 들어가서, 같은 기능을 갖는 버튼을 또 만드는 것이 좀더 용이하겠네요.
   
   
3. 만약 setBackground 함수만 호출하고 invalidate메소드를 호출하지 않으면 어떤 일이 생길까요?
   
   - invalidate메소드는 버튼을 다시 그리는 메소드입니다. setBackground는 배경을 바꿔 주기만 할 뿐 다시 그려주지는 않기 때문에 setBackground만 호출하고 invalidate메소드를 호출하지 않으면 바뀐 배경이 화면에 적용되지 않습니다.