Cara edit atau bikin 9 Patch.png (*.9.png)windows

Alat2 :
1. Adobe Photoshop atau yg mirip2 lah,
recommended CS2 ke atas
2. xUltimate Draw9Patch Compiler v1.0
- for x86 > http://www.xeudoxus.com/
android/xUltimate-d9pc-x86.zip
- for x64 > http://www.xeudoxus.com/
android/xUltimate-d9pc-x64.zip
3. Android SDK buat ngelakuin langkah 3b
(optional)
Langkah2 :
1. Klo edit ikutin yg a, klo bikin baru ikutin yg
b
a1. Buka gambar 9-Patch PNG (*.9.png) pke
sotosop, convert profilenya ke Working
CMYK
a2. Edit gambar 9-Patch PNG (*.9.png)
sesuka hati di photoshop
a3. Merge smw layer jd 1 layer aja
a4. Crop seukuran canvas, biar g ada yg
nyisa di luar canvas, karna ini mengganggu
a5. Convert profilenya jd Working RGB
a6. Save dg nama asli, atau nama beda tp
blkgnya .9.png
b1. Bikin gambar PNG biasa pke sotosop dg
background transparent, profile Working
CMYK
b2. Gambar sesuai kebutuhan/keinginan/
keperluan :p
b3. Merge smw layer jd 1 layer aja
b4. Crop seukuran canvas, biar g ada yg
nyisa di luar canvas, karna ini mengganggu
b5. Convert profilenya jd Working RGB
b6. Save dg nama *.9.png
2. Buka lg pke sotosop, resize canvas size
jd :
- Width = width asal/awal + 2misal width
asal/awalnya 50, ya jd 52
- Height = Height asal/awal + 2
- Image Position = center/tengah
Anggep aja tiap pixel tambahan td sebagai
9-Patch Frame dan bukan bagian dari
gambar. Dan 9-Patch Frame td harus bener2
transparent tanpa isi apa2.
3a. Di 9-Patch Frame td (singkat aja 9PF)
kasih titik2/garis2 hitam (#00000) tanpa
antialias, transparensi, effect, dsb dg
keterangan sprt d bwh ini :
- Pojokan harus transparent, g boleh dikasi
apapun
- Bagian sebelah kiri mengatur smw pixel di
sblh kanan garis2/titik2nya kecuali 9PF
sebagai pixel2 yg akan distretch secara
vertikal (melar ke atas bawah), pixel2 yg
tidak di sblh kanan titik2/garis2nya tidak
akan distretch. Garis atau titiknya boleh lebih
dari 1 g bersambungan (ada bolongnya sblm
titik/garis selanjutnya)
- Bagian atas mengatur smw pixel dibawah
garis2/titik2nya kecuali 9PF sebagai pixel2 yg
akan distretch secara horizontal (melar ke
kanan kiri), pixel2 yg tidak dibawah titik2/
garis2nya tidak akan distretch. Garis atau
titiknya boleh lebih dari 1 g bersambungan
(boleh ada bolongnya sblm titik/garis
selanjutnya)
- Bagian sebelah kanan mengatur smw pixel
di sebelah kiri garis/titiknya kecuali 9PF
sebagai parent yg BISA difill oleh object atau
tulisan atau keduanya. Garis atau titiknya
TIDAK boleh lebih dari 1 bersambungan (g
boleh ada bolongnya antara titik 1 dg titik
lain)
- Bagian bawah mengatur smw pixel di atas
garis/titiknya kecuali 9PF sebagai parent yg
BISA difill oleh object atau tulisan atau
keduanya. Garis atau titiknya TIDAK boleh
lebih dari 1 bersambungan (g boleh ada
bolongnya antara titik 1 dg titik lain)
- Perpotongan dari pixel2 yg di sebelah
kanan 9PF kiri dg yg dibawah 9PF atas akan
distretch horizontal dan vertikal (ke atas
bawah kiri kanan)
- Perpotongan dari pixel2 yg di sebelah kiri
9PF kanan dg yg di atas 9PF bawah AKAN
difill oleh object atau tulisan nantinya.
- Sisa pixel 9PF yg transparan jgn diisi apa2,
biarkan transparan, jgn smpe kena warna
meski cm 1% opacitynya
3b. Klo mau gampangnya lakukan aja di
Draw9Patch di */android-sdk/tools/,
soalnya ada preview ntar jadinya kyk apa.
Step ini gampang tp optional karna harus
punya Android SDK yg donlodnya gede :p
4. Save lg gambarnya, dan jadilah
decompiled/uncompiled 9-Patch PNG
Copy pngnya ke folder */example/drawable-
mdpi/ d folder xUltimate Draw9Patch
Compiler, pastiin blkgnya .9.png, klo ngga g
bakal dicompile sama xUltimate d9pc nya
5. Jalanin xUltimate-d9pc.exe d folder
xUltimate Draw9Patch Compiler
6. Klo masi ada error brarti masi ada yg slh
dri yg agan lakuin, coba teliti lagi ^^v
7. Klo g ada error (ditandai dg xUltimate-
d9pc.exe yg close/exit dg sndirinya) brarti
udah sukses bikin 9-Patch PNG :D
8. Hasilnya bisa diliat di */done/example1/
drawable-mdpi/ d dlm folder xUltimate
Draw9Patch Compiler :D
Garis2/titik2 item td pasti udah ilang klo
bener hasilnya.
Maaf klo ada kesalahan :D
Tolong bantu sempurnakan doc ini klo ada
yg slh/kurang, atau ada cara/penjelasan yg
lebih mudah :D


Recommended Posts :

Judul: Cara edit atau bikin 9 Patch.png (*.9.png)windows
Rating: 100% based on 100 ratings. 5 user reviews.
Ditulis Oleh The Stevie

Terimakasih atas kunjungan Sobat beserta kesediaan Anda membaca artikel ini. Kritik dan Saran sobat dapat sampaikan melalui Kotak komentar dibawah ini.

0 comments:

Post a Comment - Back to Content

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))