9patch images stretching incorrectly

Question

( The black lines are not visible so I just made a replica of it in photoshop and enhanced the black lines for you people to understand. )

( The black lines are photoshopped. JUST so they look a bit visible here. )

Suppose, this is the 9patch image, i have broadened the 9patch black line in photoshop so its clearly visible.

This is how it is going to stretch. The logo remain in its original dimensions, only the blue space will stretch. In the 9patch software, the X and Y coordinate results were perfect and they stretch the way they should.

However, when I insert this in my xml code, I get this result.

WHY is the logo part stretching ? WHATEVER the dimensions of the layout may be, the logo should be in its right size , while the space around it SHOULD adjust , but its not happening so.

Edit:: The images in the jar preview fine, but when I actually use that resource in some layout, I get the incorrectly rendered result.

The xml code for the button :

<Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/button_normal" />

Answer 1

You do it wrong, To make a 9patch using photoshop :
1- add a new transparent 1-pixel in each image side (left, right, top and bottom)
2- draw the scaling and content in that transparent pixel (black color #000000), not over the image content it self.
3- save it as your_image_name.9.png

Answer 2

This is my version: logo.9.png

As you can see, it works just perfectly

Make sure you put it in the /res/drawable folder and it ends in .9.png