안드로이드 위젯 배경 이미지, 나인패치

   

   

   

* 크기가 가변적인 객체의 배경 그리기

   

배경을 그리기 위한 방법은 여러가지가 존재한다.

일반적으로 xml에서 android:background = "@drawable/image"

를 사용하는데, 이미지의 크기와 오브젝트(위젯)의 크기가 같은 경우는 상관없지만

다르면 스케일에 의한 이미지 손상이 발생한다.

   

   

               

   

 가로로 확대한 모습인데, 원하는 모양이 아니다...

   

그렇다고 사이즈가 큰 이미지를 만들기도 리소스 낭비이고...

단말 같이 메모리 등의 제약이 많던 시절엔 이를 3개의 리소스로 분리해 표현하곤 했다.

   

              

이렇게 변경되지 않을 좌우측 이미지와 사이즈만큼 반복해 그릴 라인 이미지로 리소스를 구성해서

배경을 그려줄 수 있다.

   

이또한 가로, 세로 한 방향으로만 적용되므로, 상하좌우로 스케일되는 객체의 경우 각 리소스를

더욱 세분화 해야 한다.

   

그럼 안드로이드에서도 이 짓(!)을 해야 할까?

   

안드로이드는 나인패치라 불리우는 기능을 지원하고 있다. 이미지에 확대, 축소 시의 가이드 라인을

표시하고, 안드로이드에서 해당 가이드에 맞춰 이미지를 자동 스케일링 하는 기능이다.

   

사용법은 아주 간단하다.

   

   

Source file format: PNG -- one resource per file

Resource source file location: res/drawable/somename.9.png (must end in .9.png)

Compiled resource datatype: Resource pointer to a NinePatchDrawable

Resource reference name:

Java R.drawable.somefile

XML @[package:]drawable.somefile  

즉 png 포맷만 가능하고, .9.png로 파일명이 끝나야 한다. 레퍼런스 참조는 기존 이미지와 동일하다.

   

그럼 가이드라인은 어떻게 표시해야 하는가?

   

   

이 이미지를 살펴보면 이미지의 각 옆에 선이 그어져 있는 것을 알수 있다. 요넘이 image_name.9.png

와 같은 나인패치 이미지이다.

   

각 라인의 의미는 아래와 같다.

- LEFT : 상하 스케일시 변화가 일어나는 부분을 나타냄

- TOP : 좌우 스케일시 변화가 일어나는 부분을 나타냄

   

- RIGHT/BOTTOM : 옵션항목으로 PADDING을 나타낸다.

내부에 들어갈 내용이 해당 영역에 맞춰 표시된다.

   

이처럼 나인패치를 이용하면 우선 리소스의 크기를 줄일 수 있고, 복잡한 사이즈 계산 작업이

불필요하게 된다.

   

음냐.. 이걸 처음 알았을땐 나름 신선했는데... 긁적..