본문 바로가기

Mobiles

나인패치(9 patch) 이미지 쉽게 만들기.!




나인패치(9 patch) 이미지 쉽게 만들기.!


포토샵 버전 : Adobe Photoshop CS5


나인패치(9 patch) 이미지 쉽게 만들기.!


미루고 미루다가 오랜만에 정보가 될만한 포스팅을 하는 거 같습니다.^^ 스마트폰에 정신이 팔려가지고 솔직히 블로그가 작년처럼 손에 잡히지 않는군요... 그래도 이렇게 좋은 정보(?)를 들고 왔으니 많은 도움이 됐으면 좋겠습니다.^^


나인패치 포스팅은 전에도 했었지만 그땐 기초적인 방법으로 나인패치 이미지를 제작하는 방법을 소개하였고 이번 나인패치 포스팅은 한 단계 더 쉽게 나인패치 이미지 제작 방법을 리뷰하려고 글을 쓰게 됐습니다.~


일단 나인패치에 대한 기본상식이 없으신 분들은 아래 링크로 가서 기본적은 나인패치에 대해 알아보시고 다음으로 넘어가시면 좋을 거 같아요.^^ (나인패치 프로그램 다운로드도 이 링크에서 받을 수 있습니다.) http://ssacur.tistory.com/667


기초적으로 나인패치 이미지를 만들기 위해서는 원본 이미지크기에 맞는 이미지를 새로 제작하고 나인패치 블랙 라인 작업을 하고 다시 컴파일하는 과정을 거쳐 최종적으로 써먹을 수 있는 나인패치 이미지를 제작하는 거였는데 이번에는 블랙 라인을 직접 표시하는 과정을 간단하게 한 방 작업으로 좀 더 쉬운 나인패치 이미지 제작을 하는 방법입니다.


먼저 나인패치를 제작할 원본 이미지를 찾아서 포토샵으로 열어줍니다.



나인패치(9 patch) 이미지 쉽게 만들기.!


오른쪽 레이어창에서 보이듯이 레이어형태로 표시돼야 합니다.



나인패치(9 patch) 이미지 쉽게 만들기.!


이 상태에서 바로 블랙 라인을 제외한 내부영역을 선택하고 Ctrl + C, Ctrl + V로 내부영역을 복사한 레이어를 만들어 줍니다.



나인패치(9 patch) 이미지 쉽게 만들기.!


그리고 오른쪽 레이어0을 선택하고 똑같이 내부영역을 선택하고 오른쪽 클릭으로 반전 선택을 실행합니다.



나인패치(9 patch) 이미지 쉽게 만들기.!


여기서 똑같이 외부 블랙 라인 영역이 선택된 상태에서 Ctrl + C, Ctrl + V로 외부 블랙 라인 영역을 복사해서 새로운 레이어를 만들어 줍니다.



나인패치(9 patch) 이미지 쉽게 만들기.!


이제 내부영역과 외부영역이 따로 구분됐으니 레이어0은 필요가 없어졌네요. 그리고 내부영역 이미지를 편집하고 "다른 이름으로 저장"해 줍니다.


여기서 내부영역 이미지에 라인을 추가하는 작업이 있다면 외부 블랙 라인 영역에서도 라인에 맞는 부분을 삭제해 줘야 합니다. 그래야 나인패치가 적용될 때 그 라인은 늘어지는 현상을 막을 수 있으니까요.^^



나인패치(9 patch) 이미지 쉽게 만들기.!


외부 블랙 라인 영역 1픽셀을 선택해서 Delete 하면 됩니다. 간단하죠.^^



나인패치(9 patch) 이미지 쉽게 만들기.!


이미지가 모두 편집됐다면 "다른 이름으로 저장"으로 psd와 png 확장자로 저장해 줍니다.




나인패치(9 patch) 이미지 쉽게 만들기.!


저장된 png 파일을 Draw9Patch_Files\res\drawable-hdpi 폴더에 복사해 두고 xUltimate-d9pc_x86.exe 또는 xUltimate-d9pc_x64.exe를 실행해서 컴파일합니다.



나인패치(9 patch) 이미지 쉽게 만들기.!


자.~ 성공이네요.^^


굳이 Draw9Patch.bat 파일을 실행해서 블랙 라인을 일일이 그려줄 필요없이 원본 나인패치 이미지로 내부영역 이미지만 편집해서 바로 컴파일  하는 쉬운 방법이었습니다.^^


나인패치(9 patch) 이미지 쉽게 만들기.!