[TUTORIAL] Noob Friendly Guide : Resizing .9.png images [OPTIMA-TEAM]

[F4uzan]

Hi all !

Today, I'll show you how to resize Android .9.png (NinePatch PNG) file.

Little Information :
-------------------------
NinePatch PNG (.9.png) is a complex PNG which have resolution scaling ability. NinePatch PNG basically a PNG, but with a black 1 pixel borders around it, these borders are used to resize the PNG, so removing these borders will remove the resolution scaling and making them normal PNG.

So, don't resize the border, don't remove the border, or you'll lose the NinePatch PNG and turning it to normal PNG.

Requirements :
-----------------------
1.) Java JRE [Windows, Mac] / OpenJDK [Supported Linux distros]
2.) A .9.png file or a full framework containing .9.png file

Let's Start !
Steps :
-----------------------

Windows User :

1.) Installing Java JRE
1.) Download Java JRE (if you don't have one) > Here
2.) Install the .exe
3.) Restart your browser

2.) Download 9-patch-resizer
1.) Click Here

3.) Running 9-patch-resizer
1.) Open CMD window, this can be done by pressing [Windows Key + R], then type cmd.exe
2.) Navigate to 9-patch-resizer folder, navigating can be done by typing :

cd %directory%

Example

cd C:\Program Files

3.) On 9-patch-resizer folder, type :

java -jar Resizer_1.3.1.jar

4.) Resizing the .9.png
1.) Find a .9.png file, if you already have, skip this step
2.) Select your input density, this input density is the density of .9.png, press the button below the 'Input Density' text.
3.) Select your output density, output density is the screen size / density of your phone. Check your density and make the other density unchecked.
4.) Drag then drop the .9.png in 9-patch-resizer window (at the huge, arrow icon)
5.) Your resized image is located at drawable-yourdensity (example : drawable-hdpi)

-----------------
Linux User :

1.) Installing OpenJDK
1.) Find openjdk package in your package manager, or search on Google.

2.) Download 9-patch-resizer
1.) Click Here

3.) Installing 9-patch-resizer
1.) Download the 9patch-resizer_depencies_all.zip from attachment
2.) Run your file manager as root
3.) Navigate to downloaded 9patch-resizer_depencies_all.zip, open it
4.) Extract the zip file in /usr/local/bin
5.) Put the Resizer_1.3.1.jar in the same folder (/usr/local/bin)

4.) Running 9-patch-resizer
1.) Simply type "resizer" (without quotes) on terminal emulator

5.) Resizing the .9.png
1.) Find a .9.png file, if you already have, skip this step
2.) Select your input density, this input density is the density of .9.png, press the button below the 'Input Density' text.
3.) Select your output density, output density is the screen size / density of your phone. Check your density and make the other density unchecked.
4.) Drag then drop the .9.png in 9-patch-resizer window (at the huge, arrow icon)
5.) Your resized image is located at drawable-yourdensity (example : drawable-hdpi)

--------------------
Mac User > Soon, no tutorial available now ^_^
--------------------

[EXTRA-TUTORIAL] Knowing your density :
-----------------------------------
1.) Download the com.MTMDevelopers.ScreenSpecs apk from attachment (app courtesy of MTM Developers, LLC)
2.) Open it on your phone
3.) You'll see three text, Screen Resolution, Scale and Pixel / Inch.
4.) Focus on the Pixel / Inch text, find out your density by comparing with this :

120 / larger = LDPI
160 / larger = MDPI
240 / larger = HDPI
320 / larger = XHDPI
480 = XXHDPI

Enjoy ! Happy Resizing !

 

[F4uzan]

Placeholder

 

[F4uzan]

Another placeholder