Edit Dan Buat Image .9.Png

Jika anda pernah modifikasi interface dari sebuah aplikasi atau theme, maka file image dengan ekstensi .9.png tidak aneh lagi bagi anda. Pada artikel tips droid sebelumnya kita telah banyak membahas perihal pengenalan image .9.png, pada artikel ini tips droid hendak membuatkan kembali kepada anda perihal cara edit dan menciptakan file .9.png. Mari kita membuatkan bersama.

Sebelum kita mulai melanjutkan tutorial edit atau menciptakan file image .9.png, sebaiknya kita persiapkan terlebih dahulu beberapa peralatan yang anda perlukan.

Peralatan yang anda perlukan:
1.Aplikasi olah gambar sebagai misalnya paint, adobe photoshop, gimp atau lainnya. Jika anda masih belum memiliki aplikasi tersebut pada artikel ini saya sertakan link untuk download
Adobe photoshop cs 6 (thx to bagas)
Password:www.bagas31.com

Gimp

Paint

2.Draw 9-patch, aplikasi ini akan anda temukan pada SDK Starter Package anda (android sdk/tools). Draw 9-patch memudahkan anda untuk menciptakan .9.png dengan menggunakan WYSIWYG editor.
Draw 9-patch

3.xUltimate Draw9Patch Compiler, aplikasi ini akan memudahkan anda untuk melaksanakan compile terhadap file image .9.png yang telah anda edit.
xUltimate d9pc

Catatan: Pastikan anda telah install java untuk memakai draw 9-patch

Langkah yang ditempuh
Pada artikel ini akan saya bagi menjadi dua bab yaitu edit .9.png dan menciptakan file .9.png

Edit .9.png

1.Buka gambar 9-Patch PNG (*.9.png) dengan software olah gambar yang anda miliki, sebagai misalnya photoshop, convert profilenya menjadi Working CMYK (Image>Mode>Pilih CMYK).

2.Edit gambar 9-Patch PNG (*.9.png) sesuai harapan anda di photoshop.


3.Merge visible semua layer menjadi satu layer saja.

4.Crop seukuran canvas, semoga tidak ada yang tersisa di luar canvas, alasannya ialah ini sanggup mengganggu hasil editan.

5.Convert profilenya menjadi Working RGB (Image>Mode>Pilih RGB)


6.Save dengan nama asli, atau nama berbeda namun file tersebut diberi nama sesuai ekstensi yaitu .9.png sebagai contoh: rakun.9.png



7.Buka lagi file tersebut dengan photoshop, resize canvas size menjadi :
- Width = width asal / awal + 2 pixel misal width asal / awalnya 50, menjadi 52
- Height = Height asal / awal + 2 pixel misal height asal / awalnya 50, menjadi 52
- Image Position = pilih center
Anggap saja tiap pixel embel-embel tersebut sebagai 9-Patch Frame dan bukan bab dari gambar. Dan 9-Patch Frame tadi harus transparent.

8.Pada 9-Patch Frame (9PF) tersebut buatlah garis hitam (#00000) tanpa antialias, transparensi, effect, atau apapun dengan keterangan menyerupai di bawah ini :
-Pojok harus transparent, dilarang ditambahkan apapun.

-Bagian sebelah kiri mengatur semua pixel di sebelah kanan garis kecuali 9PF sebagai pixel yang akan anda stretch secara vertikal (renggang ke atas bawah), pixel2 yang tidak di sebelah kanan garis tidak akan stretch. Garis atau titiknya boleh lebih dari 1 dan tidak bersambungan (terdapat jeda sebelum titik / garis selanjutnya)


-Bagian atas mengatur semua pixel di bawah garis kecuali 9PF sebagai pixel yang akan stretch secara horizontal (renggang ke kanan kiri), pixel yang tidak dibawah garis tidak akan stretch. Garis atau titiknya boleh lebih dari 1 dan tidak bersambungan (ada jeda sebelum titik / garis selanjutnya)


-Bagian sebelah kanan mengatur semua pixel di sebelah kiri garisnya kecuali 9PF sebagai parent yang sanggup fill oleh object atau goresan pena atau keduanya. Garis atau titiknya tidak boleh lebih dari 1 bersambungan (tidak boleh ada jeda antara titik 1 dengan titik lain)


-Bagian bawah mengatur semua pixel di atas garisnya kecuali 9PF sebagai parent yang sanggup fill oleh object atau goresan pena atau keduanya. Garis atau titiknya tidak boleh lebih dari 1 bersambungan (tidak boleh ada jeda antara titik 1 dengan titik lain)


-Perpotongan dari pixel yang di sebelah kanan 9PF kiri dengan yang dibawah 9PF atas akan stretch horizontal dan vertikal (ke atas bawah kiri kanan)


-Perpotongan dari pixel yang di sebelah kiri 9PF kanan dengan yang di atas 9PF bawah akan fill oleh object atau goresan pena nantinya.


-Sisa pixel 9PF yang transparan jangan diisi apapun, biarkan transparan, jangan hingga terkena warna meski cuma opacity 1%.


Jika anda ingin cara yang lebih gampang lakukan saja dengan Draw9Patch di */android-sdk/tools/, dikarenakan ada preview sehingga akan nampak hasil yang anda edit menjadi menyerupai apa. Step ini relatif gampang jikalau anda telah punya Android SDK.

9.Save lagi gambarnya, dan jadilah decompiled/uncompiled 9-Patch PNG. Copy png tersebut ke folder */example/drawable-mdpi/ pada folder xUltimate Draw9Patch Compiler, pastikan ekstensi berjulukan .9.png, jikalau tidak bakal di compile oleh xUltimate d9pc tersebut.
10.Jalankan xUltimate-d9pc.exe pada folder xUltimate Draw9Patch Compiler.
11.Jika terdapat error berarti masih ada yang salah dari yang anda lakukan dalam pengeditan, coba teliti lagi.

12.Jika tidak terdapat error (xUltimate-d9pc.exe close/exit secara otomatis) berarti anda sukses menciptakan file 9-Patch PNG.

13.Hasilnya sanggup anda lihat pada foleder */done/example1/drawable-mdpi/ di dalam folder xUltimate Draw9Patch Compiler. Garis / titik hitam yang anda buat tadi niscaya sudah hilang jikalau benar.


Buat .9.png

Untuk menciptakan file image .9.png langkah yang anda tempuh hampir sama dengan melaksanakan pengeditan.
1.Buatlah gambar PNG biasa dengan aplikasi olah gambar sebagai misalnya photoshop dengan background transparent, profile Working CMYK

2.Gambar sesuai kebutuhan / harapan anda.


3.Merge visible semua layer jadi 1 layer saja.


4.Crop seukuran canvas, semoga tidak ada yang tersisa di luar canvas, alasannya ialah ini mengganggu dan menjadikan error saat anda convert menjadi .9.png


5.Convert profilenya dengan Working RGB.


6.Save dengan nama *.9.png


7.Lakukan menyerupai langkah no 7-13 pada tutorial edit .9.png di atas.



Beberapa yang perlu anda perhatikan dalam edit dan buat .9.png
Dalam melaksanakan pengeditan atau menciptakan .9.png yang perlu anda perhatikan ialah saat anda simpulan mengedit gambar, anda sanggup membukanya di alat draw9patch untuk memverifikasi bahwa gambar tersebut sanggup membentang dengan benar.

Berikut ialah bab paling penting dari edit 9.png. Anda perlu mendefinisikan 2 bagian:

* Bagian regangan (sisi kiri dan sisi atas)
* Bagian konten (sisi kanan dan sisi bawah)
Ketika anda simpulan peregangan gambar anda, anda sanggup membukanya di alat compiler 9.png untuk mengkompilasi dengan benar. Anda melihat perbatasan 1pixel diciptakan untuk 9.png stretcheable
Untuk mempermudah dalam edit maupun membuat, ada baiknya jikalau anda zoom sehingga ukuran setiap pixel sanggup lebih terlihat dengan jelas. Lakukan pengeditan secara cermat.

Jika anda menemukan kesulitan dalam melaksanakan pengeditan atau pembuatan .9.png anda sanggup membuka beberapa artikel rujukan yang sanggup anda cari pada mesin pencari google baik berupa artikel maupun video streaming pada youtube, penjelasan perihal .9.png, menulis komentar pada blog tips droid atau artikel ini dan ini.

0 Response to "Edit Dan Buat Image .9.Png"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel