이미지 슬라이싱 적용하는 방법

이미지 슬라이싱이란?

Android의 9-Patch 이미지와 같다고 보면 된다. 9-Patch 이미지를 모른다면, 그냥 이미지를 확대 축소할 경우 전체적인 리사이징이 아니라 특정 부위만 길어지고 짧아지게 하여 보다 자연스럽게 나타나게하는 방법이다. 예제를 통해 쉽게 알아보자

이미지 슬라이싱 적용

아래와 같은 이미지가 있는 경우를 가정해보자.

이 이미지를 키우면 테두리의 모양들이 이미지 높이와 함께 늘어나면서 비율이 깨지고 이상해진다.

이제 이미지 슬라이싱을 적용해서 빨간색 네모 영역만 늘이고 줄이도록 할 것이다.

Asset으로 이동하여 해당 이미지를 선택후 우측 하단을 보면 Show Slicing 옵션을 확인할 수 있다.

Show Slicing을 누르면 Slicing 옵션을 확인할 수 있다.

Slices에서 Vertical, Horizontal, Vertical & Horizontal을 선택할 수 있다. 각각 어느 방향으로 슬라이스할지를 나타낸다. 그 다음 Top과 Bottom이 있는데, Slices를 Vertical로 했기 때문에 늘어나기 시작하는 부분과 끝나는 부분이 있어야하고, 그 시작점이 Top, 끝이 Bottom이 된다. 직접 숫자를 입력해도 되고, 이미지에 보이는 검은색 라인을 움직여 지정해도 된다.

적당히 조절이 끝났으면 결과를 확인해보자.

이렇게 하면 이미지의 비율을 깨지 않으면서 크기를 수정할 수 있다.