I've a 9-patch image which contains 2 horizontal stretchable areas and 2 vertical stretchable areas like this. It looks good in draw9patch
and the emulator.
Unfortunately it becomes strange in real devices, I tested it with Asus Nexus 7 (Android 4.4.3) tab and Sony Xperia Tipo ST21i (Android 4.0.4) phone. This is a view set that drawable as the background.
Why does this happen and how to fix this?
I suspect this was because of scaling of the base image to adapt screen density. The image in the question is for hdpi. Widen the stretching area from 1 px to 2 px solved this problem, but it is strange that the circle is not center aligned in Asus Nexus, it is slightly to the right than it should. However it looks fine in Sony Xperia (centered).
So, I still wait for another better answer.