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?

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.

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: