How to remove paddings in a 9-patch background for textview

Question

I have a textview which has to use a 9-patch drawable as the background. But the 9-patch drawable has left and right paddings which make the background image not stretch properly to cover the whole text. I tried resetting the paddings for the textview itself but it doesn't fix the problem.

Would anyone have any idea how to make it work?

Thanks.

Grownup

Answer 1

The black lines on the left and top defines the stretchable are, and those on the right and bottom marks the "content" area in a 9-patch image.

So, if you don't want padding means you want a full-length content area. You should mark full-width content area by drawing a full-length line at the bottom and right of the 9patch image.

In this image, the black lines on the right and bottom represent the content area. You can see the preview on the right side, and notice the content area in light blue color. You can fill the content area by extending the bottom and right lines.

Waterloo

Thanks! But is there a way to get rid of the padding without changing the image itself? – Grownup

AFAIK, we are unable to change the padding in 9patch programatically! We have to work on the image to remove it! – Waterloo

Actually what I need is to make sure the text is entirely covered by the background. Thanks! – Grownup

For View, you can re-set padding of that View. For ListView.setSelector, you can reflect the variable. For 9patch png, you can edit the png file. @GreenHo – Violinist

I had no idea that left-top and right-bottom serve a different purpose. I was looking for how to actually mark the content in it and this helped me a lot! – Dollie

Answer 2

Editing 9-patch file is not a good idea, because this method may deform the background image. I used a trick to handle this:

<RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content">
            <View
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_alignBottom="@+id/textView"
                android:layout_alignTop="@+id/textView"
                android:background="@drawable/your_9_patch_image"/>
            <TextView
                android:id="@+id/textView"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="a custom text!"/>
</RelativeLayout>

I have set the 9-patch background drawable for a View behind my TextView in a RelativeLayout. So the there is no unwanted padding :)

Commiserate

Answer 3

Theoretically you cant really change the padding of 9 patch image programatically.

So you have two options:

1) Have several 9 patch images in your drawable folder for each resolution: drawable-hdpi, drawable-xhdpi etc

2) Embed a inner layout:

  <RelativeLayout
      android:background="@drawable/nine_patch_image_without_padding"
      android:layout_width="match_parent"
      android:layout_height="wrap_content">
      <LinearLayout
        android:layout_margin="10dp" // Your padding goes here
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
          android:text="How you doing"
          android:layout_width="match_parent"
          android:layout_height="wrap_content" />
      </LinearLayout>
    </RelativeLayout>

It worked for me. I use the second options as it is simpler and quicker to use :)

Kanazawa