Android nine patch - allow only a specific area of a background drawable to stretch

Issue

How does one go about creating a View that has boundaries with triangular perforations ?

I've been using background drawables to achieve this so far. That works when the dimensions of the View are fixed. Now I have a situation where the height of the View is not constant, so I need to have the height variable on the fly. I can't use a background drawable with a fixed height anymore.

Here is the original background drawable:

And this is what the final View needs to look like:

Another way of looking at the same problem is, can we allow the center of the image to stretch without distorting the boundaries ? If we could do this, we could use the existing drawable as a background.

How can this be achieved ? Has anyone else faced this problem before ? Does the framework have an existing way of dealing with this class of problems ?

Solution

Instead of using a normal image, you can generate a nine-patch png.

Use Simple Nine-patch Generator for this.

The trick is the black line on the left side. That tells Android that the png is vertically expandable along this area.

Please see this example:

Save it as a nine-patch, in the format imagename.9.png

Answered By - Knossos