How to Edit .9 PNG Images for Android Custom ROMs

Well, you guys might have been wondering how to edit .9.png or how to make a stretchable png file which a phone’s firmware can understand. Basically .9.png is a stretchable image used for buttons, backgrounds, title bars, etc. and its bit weird to understand. So here I present a guide which would help you guys in editing those files easily.

Things required to Edit a.9.png Image

Let’s start from a list which will be needed for the task:

  1. An Image Editor ( I prefer Adobe CS5 ).
  2. You need AndroidSdk installed for getting the Draw9patch.bat
  3. And you need really a good patience so that your work goes in ease.

Getting Started

   Step 1 :

Open your .9.png in image editor, as you can see below I opened it in Adobe Photoshop Cs5.

edit .9png files

Now you might think, what are the black dots in the border! So, exactly I was coming to that point. Those black dots are for Deciding Height, Width and the touch area. Like if you guys see in the left side there is a dot. so that decides the Vertical content  and the Upper side Decides the Horizontal content to shown. Both the right side and lower side decides content to touch.

The very next thing is to edit the image, select the whole image which doesn’t include those black dots and lines.

Edit it as you want.

photoshop .9png tutorial

Save it as it is in the form of png (.9.png should be the extension).

So Step 1 is done now only 1 step remains. sometimes you won’t even have to do this but it’s better to do because, it can cause error.

Step 2:

  1. Open draw9patch.bat from your AndroidSdk/tools by double clicking on draw9patch.bat
  2. Wait for few seconds or minutes, a java window will pop out with an arrow Something like this.

draw 9 patch editor

  1. Now drag your file to this Java window.
  2. There should be the DOTS and LINES out there, if there aren’t then you can see the image and copy it same like that , but it depends on your PNG what PNG you opened for:
  •  For adding dots / lines you can simply click on the corners.
  • For Deleting you just have to press SHIFT and CLICK on the corners WHERE dots/lines are there.

So after you are done adjusting your .9.png only one thing is left now is to save the file. Congratulations you are done with your editing of .9.png.

So the main thing is to draw9patch.bat things. You can create any image once you get the correct resolution.

Some Question Might Come in your head

  • Where to find the .9.png?

Ans : You can find in all of your APK files which has graphics. The images used in these are of .9.png format.

  • Some Images I have in my Firmware isn’t having any kind of dots or lines?

Ans : Some of the new firmware like DDKQ8 or if you are porting from SGSII roms or any other armv7 type of phone then they have a smart .9.png so the dots and lines got vanished. They are recompiled due to which the dots disappeared. Editing these kind of .9.png files will be discussed later, may be in some other tutorial.

Click Here to Leave a Comment Below 2 comments
Jinav Satra - May 9, 2012

I already know this…

Shantanu - May 11, 2012

Nice tut..

@jinav : The tutorial is for all, and there are people who dont know it.. Obviously modders will know this, as it is very basic guide.


Leave a Reply: