이미지 특정 부분만 늘리기 (Image Slicing, Image Stretch)

 

이런 이미지의 흰색 배경의 말풍선을 사용하려고 합니다.

 

말풍선

 

만약 여기서 이미지의 width만 늘어나게 될 경우 cornerRadius의 값이 유지되지 못하고 깨지게 됩니다.

 

이를 Image Slicing의 Stretch 기능으로 문제를 해결 할 수 있습니다.

안드로이드에서는 9-Patch라고 하더라구요

 

 

우선 Asset에서 특정 부분만 늘리고자 하는 이미지를 선택해준 뒤,

 

Asset의 이미지 선택 후

 

Show Overview 대신에 Editor의 Show Slicing를 체크합니다.

 

Show Slicing

 

그러면 이렇게 가로 세로 영역을 잡을 수 있는데,

 

가로만 늘이고 싶다면 가로만, 가로세로 둘다 잡아서 늘이고 싶다면 둘다 선택해주시면 됩니다.

늘어나게 하고 싶은 영역을 위 이미지 처럼 선택합니다.

 

 

마지막으로 이미지 contentMode에서 늘어나게될 영역이 비율을 유지하며 늘어나는게 아니므로

scaleAspect 대신 scaleToFill 로 주게 되면 ( image.contentMode = .scaleToFill )

 

 

원하는

이미지의 가로 세로가 늘어날 경우 해당 영역부분만 늘어나게 할 수 있습니다.

 

 

감사합니다~