«   2020/08   »
            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31          
Archives
Today
41
Total
634,623
관리 메뉴

Elex

Better 9-patch Tool : 앱개발자를 위한 전문가용 나인 패치 제작 도구 본문

프로그래밍/Android

Better 9-patch Tool : 앱개발자를 위한 전문가용 나인 패치 제작 도구

프리랜서 프로그래머, Elex 2011. 11. 30. 10:26

Better 9 Patch Tool

Hi, It's moved to a new site. You can download the newest package file from this website.

이 소프트웨어에 관한 새로운 소식은 이 곳에서 확인하실 수 있습니다.

(http://www.roundrect.kr/desktop/better-9-patch/)


이 소프트웨어는 안드로이드 앱 개발 과정에서 필요한 나인 패치 이미지 제작 도구입니다. 이 프로그램의 개발 의도는 ADT에 포함된 Draw 9-patch 프로그램을 사용하는 것보다 효율적으로 나인패치를 제작하기 위함입니다.

작업 경로를 기억 못하는 파일 피커가 너무 싫었어요. 픽셀 하나하나 마우스로 찍는게 너무 짜증났어요.

나이 패치를 적용할 이미지가 단 한장이라면 ADT에 포함된 툴을 사용하는 것과 크게 차이가 없을 겁니다. 하지만 각각의 화면 밀도마다 적용하려면 정말 이런 단순 노동은 ... 게다가 상태 변화에 따른 이미지까지 처리하려면 정말 귀찮은 반복작업이 되어 버리고 맙니다. 이 도구를 사용해서 나인 패치를 제작한다면 단 한번만 설정하면 됩니다. 상하좌우의 값들은 비율 값으로 지정하고 있으므로 처음 설정한 값을 다음 이미지에 그대로 지정할 수 있습니다.

9-patch builder runs in linuxv0.9999 Metal L&F in Ubuntu



이제 리눅스에서도 드래그앤드롭이 작동합니다.

(그리고 아마도 OSX에서도 작동될 듯 합니다. 사실 맥이 없어서 잘.. 어느분께서 테스트해 주셔도 좋겠고 고귀하신 분께서 맥북 하나 내려주셔도 좋을텐데..)

아래의 동영상은 안드로이드의 스피너에 적용할 배경이미지를 처리하는 과정입니다. hdpi, mdpi, ldpi 그리고 각각 포커스 받았을 때의 상태 이미지까지 6장의 원본 이미지를 나인 패치 시키는 내용입니다.


아래의 스크린 샷은 JRE 7의 Nimbus 룩앤필이 적용된 화면입니다.


1. 원본 PNG 파일을 드래그&드롭 해서 로딩 합니다.

2. 화면 왼쪽의 슬라이더를 이용해서 왼쪽과 윗쪽에 확장 영역을, 오른쪽과 아랫쪽에 컨텐츠 영역을 설정합니다. 확장 영역은 붉은 색으로 컨텐츠 영역은 푸른 색으로 표시 됩니다. 각각의 슬라이더는 0~1000 사이의 비율값으로 지정합니다.

여기서 ADT의 Draw 9-patch와의 차이점 하나! 눈이 충혈 되도록 픽셀 클릭 & 쉬프트+클릭을 하고 있을 필요가 없습니다.

3. 화면 윗쪽의 저장 버튼을 누르면 원본 파일과 동일한 경로에 9.png 형식의 이름으로 저장됩니다. 

여기서 ADT의 Draw 9-patch와의 차이점 둘! 파일 선택 상자가 뜨지 않으므로 덜 귀찮습니다. 그러나, 기존 파일이 덮어쓰기될 수 있으므로 주의를 요합니다.

4. 화면 아랫쪽의 미리보기 기능은 아직 구현되지 않았습니다. 아무런 작동도 하지 않습니다. 구상은 했지만, 만들다보니 별로 필요 없겠다 싶기도하고...

5. 여기서 마지막 중요 포인트! 

특히 Dpi별로 동일한 여러 이미지를 처리할 때 반복 작업을 최대한 줄일 수 있으므로 효율적입니다. 새로운 원본 이미지를 로딩 하더라도 이전에 설정된 값을 유지하고 있으므로 두 번째 파일 이후부터는 이미지 로딩 후 단지 저장 버튼을 누르기만 하면 됩니다. 위의 동영상을 확인해 보시기를.


실행을 위해서는 최신 버전의 자바 런타임이 시스템에 설치되어 있어야 하며, 자바 패키지의 실행 방법을 모르시는 때에는 구글에서 검색하시기 바랍니다. 실행 중 오류가 발생하는 때에는 알려주시면 업데이트시 수정해서 반영하겠습니다.


Download :

다운로드 링크 제거. (더이상 오래된 버전은 사용하지 마시오.)

Usage :

0. Launch. (Check Java Runtime is installed, then double-click or type "java -jar 9builder_0_9999.jar".)

1. Drag & Drop source 'png' file from your file manager(eg. Explorer) to working area. source image will be scaled to fit the area.

2. Set desired values with sliders at left panel. 

3. When done, click the 'Save' button at upper toolbar. Or simply Alt+S. 

4. On clicked, 9-patched file, automatically named '.9.png' will be saved in the same directory with a source file. 

5. You can process multiple file with same values with no pain. Set once, then drag and save for each file. 

6. If you think this software is useful, then please click the 'Donate' button and save the developer. ^^

7. Now, no more pixel clicking, no more bloody eyes, Thank you.


0.9999에서는

  • 리눅스에서도 드래그앤 드랍이 작동합니다.
  • 이미지의 투명도를 표시하기 위해 배경으로 체크 무늬를 사용합니다.
  • 룩앤필을 지정할 수 있습니다.

만일, 메탈 룩앤필을 적용하려면 자바 명령행의 맨 뒤에 Metal을 입력하면 됩니다.
java -jar 9builder_0_9999.jar Metal 이런 식으로..
Nimbus 라거나 GTK+ 이라거나.. 물론 런타임에서 지원되는 룩앤필 이름이어야 합니다.

0.99999에서는

  • 더블버퍼링 문제를 수정하였으므로 화면 변경시 깜빡거리지 않습니다.
  • 원본 파일 경로 뒤에 원본 파일의 픽셀 크기(너비x높이)를 표시합니다.

0.999999에서는 

  • 업데이트를 확인하고 알려줍니다.
  • 리사이징이 좀더 원활하게 작동합니다.
  • 패치 알고리즘을 살짝 수정했습니다.


Tip :

Values are relative to source image width/height. (1/1000)
Stretchable areas are colored in red. Left, Top.
Content areas are colored in blue. Right, Bottom.
If you want to dot a single pixel, set two sliders same value.
Value of upper slider should always be less than the lower one? NO.



the 9-patch builder 0.999999Screenshot of ver 0.999999



2 Comments
댓글쓰기 폼