Advanced 9Patch drawing in android

Drawing 9patch can turn into a nightmare easily. I would like to present the other side. The most common problem, to create draws wich are look well in portrait mode and landscape mode too.

Here are some 9patch technics:

(Note: This article don’t tell the basics of 9patching. If you are new in this technics, examine this page first: http://developer.android.com/guide/developing/tools/draw9patch.html)

(From this link, you can download the files: download the 9patch files)

Example One: Simple button
This is a just simple button, with a glowing effect. The 9patching wich I use here, keeps the button’s edges, so it keeps the rounded rectangle’s radius too. With 9patch, the content area of the button can be set easily.

Exapmle Two: Spinner button
This is a chooser button, with the same glowing effect. With this 9patching, the dropdown arrow keeps it’s size at horizontal stretching. The glowing effect stays in the middle of the button.

Example Three: Article header image
In this case, I use an extra transparent line before and below the image. The 9patch stretches this lines out. The picture always align to the right top corner of the layout. This can be a spectacular articleheader background.

Example Four: Header background
Like at web pages, larger background images can created easily from a tiny picture. This 9patch stretches the middle of the image, so it’s look like continuous. The lenght of the layout doesn’t matter. For example, this is useful when creating menu bars.

Example Five: Header background 2
In this example, I use the last column of the image, for horizontal stretch. This must be a single-color column. The image starts at the left side of the layout, in any cases, and fill the end with the single-color.

Example Six: Search EditText
You can create your own, horizontal stretch - independent EditText with 9patching. Take care of setting the content area of the image, see it below.

From this link, you can download the files: download the 9patch files