What is the use of 9patch PNG?

Question

I read article (Android Developers) on 9patch PNG in Android. But I'm not getting what is the real use of it ? If i use Gradient Image then it is going to behave same as 9Patch PNG.

I had discussion with my graphics designer, he was telling me that it is same as Image Repeat used in CSS. Is it so ?

-Thanks

Answer 1

No it's not the same.

Think about a button you want to give a new look. With the 9patch way you simply design your button's design in a image editing program like e.g. Photoshop and save it to a png file. After this you open it with the Android SDK's 9patch png tool and define the areas which going to be stretchable and scalable. Doing this you can apply you new button design to a button of any size as the design can be scaled to any size without scaling the corners and borders as they were marked not-stretchable. If you'll would use are normal png the whole png will be scaled to the button's size what will probably look very ugly.

Of course you'll have to take care of designs with a gradient background as they might only be stretchable in on orientation (horizontal or vertical) depending on the type of gradient (e.g. linear).

Even if the CSS image repeat attribute is very similar to the 9patch png as the latter one is easier to use as you only define and apply it to a button. With CSS you'll have to think much more about how you make a button scalable. Think about a button with round corners, how would you do this with CSS? The CSS image repeat attribute alone would do the job, you would how some define that the corners stay always the same an should not be scaled or repeated.

Answer 2

I don't get the relationship with Gradient Image.

9-patch image is a convenient way to use the only image for cases when you really don't know what actual dimentions will be (instead of having different resource images per each imaginable case). The article has an example of using the same 9-patch image for differently sized buttons (due to different text size). So, it looks rather strightforward, isn't it? And yes, of cource, you can use Gradient Image for creating a 9-patch image.