9 patch image is scaled at the wrong positions

Question

I am using a nine patch image as a drawable for a selector's item element. The nine patch image is here:

The image that finally gets rendered is this (emulator & device screenshot, both device have resolutions > mdpi):

As you can see, it has been scaled outside the stretchable area (as defined in the 9 patch file), the darker green bar is much thicker as it should be. Why is that and can it be avoided? The draw9patch tool scales this image correctly. Does it have to do with Android trying to preserve physical dimensions on high resolution devices?

Impetus

Let us see the code where you draw the image. – Lueck

Answer 1

Do you only provide a mdpi version of the image?

Android scales all images that aren't available in the correct pixel density. This happens before the image is scaled via 9patch.

This would mean that your image gets scaled up to fit hdpi and then scaled to fit the content.

To fix this, you have to provide hdpi and xhdpi versions of your image. 9patch isn't supposed to target different pixel densities and rather different content/screen sizes.

Countershading

There is only one version (put in the drawable folder). So it seems the process you outlined explains the issue I am facing. Too bad, I though I could avoid creating images for all those different physical resolutions as well... – Impetus

Answer 2

I checked out your 9 patch:

Why did you color your not used bounds white? It should be transparent. Because of this it is not recognized as a 9Patch:

Linkman

White borders are my personal best practice as it avoids that nearly transparent pixels live on the outer borders. So far, I never had problems with this. And I double checked this: The red stripes (whatever they mean) also occur with completely transparent borders. – Impetus