Equally distributed icons in an Android Progressbar

Issue

I'm trying something that would sound fairly easy to implement. However, it doesn't respond as expected. I'm using a Progressbar to draw a 5 state bar, where the user can click on any of the states to change the behavior of the application. My progressbar uses this drawable (just pay attention to the background element).

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:id="@android:id/background">
        <nine-patch
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:src="@drawable/statusbar_thin" />
    </item>
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <gradient
                    android:endColor="#ffeeeeee"
                    android:startColor="#ffeeeeee" />
            </shape>
        </clip>
    </item>
    <item android:id="@android:id/progress">
        <nine-patch
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:src="@drawable/statusbar_thin" />
    </item>

</layer-list>

This is the @drawable/statusbar_thin.

You may see they just don't look like vertically centered spots, but it doesn't matter. The problem is that, when the image is stretched (it's a 9 patch, as you may expect), the "superior black mark that expands the pixels below it" (I don't know how it's called. Anyone?) expands them randomly (By that I mean some parts expand twice more than others).

I'm not sure if there's a trick I didn't use, or it's just Android that uses indistinctly any block, instead of all of them evenly. Any ideas on that?

EDIT:

As @sandkasten suggested, I used the draw9patch application. However, as you see, it looks perfectly distributed, but on Nexus 7, it just doesn't work.

EDIT 2:

The status bar in black background. As you see, there's a big distance between the first and the second icon, while the selector is inbetween.

EDIT 3: Such an amazing world. I started playing with the top black marks, and, despite they weren't equally distributed at last, it worked.

Solution

If I understand you right, this should be the solution. Take a look at draw9patch.bat, which shows you a preview of your image and how android strech it. It's deliverd with the android sdk.

Answered By - sandkasten