iOS 프로그래머라면 잘 알고 있듯, 버튼이나 배경의 이미지를 사용할때는 작은 이미지를 가로/세로 방향으로 늘려서 사용한다. 다음과 같은 방식으로 stretchableImageWithLeftCapWidth:topCapHeight: 를 사용해서 가로/세로 한 곳을 쪼개고, 늘린다.

[rightButton setBackgroundImage:[[UIImage imageNamed:@"blue_btn_bg.png"] stretchableImageWithLeftCapWidth:5 topCapHeight:0] forState:UIControlStateNormal];


그런데, iOS 5 에서는 이 메소드는 Deprecated 되었다. 오랜 기간 동안 많이 사용한 메소드가 Deprecated 되니, 조금 놀랍다. 대신 새로 추가된 메소드는 resizableImageWithCapInsets: 이다.
메소드 이름만 봐도 어떻게 하겠다는 것인지 짐작이 간다. 이미지에서 고정할 영역과 늘어날 영역을 Inset 영역 설정으로 정하면 되는 것이다. 위의 코드를 새로운 방식으로 변경하면, 다음과 같다.
(여기서, blue_btn_bg.png 이미지의 가로 폭은 9 픽셀이라고 가정하자.)

[rightButton setBackgroundImage:[[UIImage imageNamed:@"blue_btn_bg.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 5, 0, 4)] forState:UIControlStateNormal];


여기서, UIEdgeInsetsMake 로 왼쪽 inset 값은 5 로 정해서, 이전 코드와 같다. 오른쪽 inset 값을 4로 한 이유는, 여기서 예제로 사용한 원본 이미지의 가로 폭이 9픽셀이기 때문이다. 즉, 이전 코드와 동일하게 하려면 inset 값의 왼쪽+오른쪽 픽셀 값이 원본 이미지의 전체 폭이 되도록 하면 된다.

만일, UIEdgeInset 의 양쪽 값 합계가 원본 이미지의 폭(혹은 높이) 보다 적다면, 나머지 가운데 영역은 어떻게 될 것인가?

얼핏 생각하기엔, Android 의 9-patch 이미지 영역 사용법과 완전히 동일하게 된 것이 아닐까 하는 생각도 드는데, 사실을 그렇지가 않다. Inset 영역에서 제외돈 가운데 이미지 영역은, 이미지를 늘리면 늘어난 영역에 반복된 타일 형태로 나타난다.

결론적으로, 안드로이드 9-patch 와는 좀 다른 방식이라는 점을 명심해야 하며, 가운데 영역이 타일 형태로 반복되어 그려진다는 점을 잘 이용할 수도 있을 것이다. 당연히 Insets 의 가운데 영역이 없다면, 기존의 방식과 동일하게 사용할 수 있다.

당연한 말이지만, Deployment Target 을 4.x 까지 지원하려면 기존에 사용하던 메소드를 그대로 사용해야 하고, iOS5 전용 앱을 만든다면 resizableImageWithCapInsets: 를 사용하는 것이 좋을 것이다.


이 게시물을..