Search code examples
androidbuttonnine-patchandroid-drawable

Applying 9-patch png on android

I'm using 9-patch images to create selector for buttons that can be stretched in different screen size. So I basically pass the name of the files (without the .9.png) in the selector like this:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true" android:drawable="@drawable/img_common_white_button_bg_pressed" />
    <item android:drawable="@drawable/img_common_white_button_bg_default" />

</selector>

And I thought this should be okay. The graphical layout screen of the xml doesn't show any problem with the button, but when I run the app in my device, this is what I get:

enter image description here

So I'm not sure whether I applied the images the wrong way or is it the problem of the 9-patch files? I'll really appreciate it if someone could enlighten me with this. Thank you.

Solution

  • Please consider below mentioned things about 9-patch image:

    ->.9.png image has black border around the image that indicate it's patch.

    -> in drawable folder image having .9.png are identified as 9-patch image so it's must that 9 patch image have .9.png as extension

    In your case you removed .9 from image name so it will be normal drawable having black border around image.

    you have 2 option. remove patch from button recreate it for all android drawable size. OR remain 9 patch image with it's extention .9.png in drawable folder.