Padding issue on Nexus 7 tablet

Question

I'm noticing some issues with padding on the Nexus 7 tablet running Android 4.1. Specifically, I have a background drawable with padding that creates a outer stroke:

  <?xml version="1.0" encoding="utf-8"?>
  <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >

  <stroke
    android:width="1dp"
    android:color="#59000000" />

  <padding
    android:bottom="1dp"
    android:left="1dp"
    android:right="1dp"
    android:top="1dp" />

  </shape>

This is supplemented with a 1dp white inner stroke. So it should be a square 2 dp border around the entire image:

I have tested it on the actual nexus device and on several other devices and the 7 inch jelly bean emulator:

First, here is the working version from the 4.1 7 inch emulator:

The border around the outside is even and goes around the entire image. This is how it works on all the other devices i have as well.

Nexus 7:

The gray is the background color, but you can see the right and bottom padding is not being respected. The border is being obscured by the the image now.

If it matters, these are children of a GridView. Wonder if anyone has seen these issues or has ideas on how to resolve them.

Answer 1

This appears to be a bug when generating the stroke in the XML drawable. After multiple attempts, I've narrowed it down to that; it seems to be making the stroke size incorrectly on the lower and right sides of the shape, even if specified in pixels. If I simply change the stroke width to 2dip instead of 1dip (all other things staying as they are), this is the result:

This is the border.xml I used for the background of the after image:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">

    <stroke
            android:width="2dp"
            android:color="#59000000"/>

    <padding
            android:bottom="1dp"
            android:left="1dp"
            android:right="1dp"
            android:top="1dp"/>

</shape>

Which, again, is just yours with the stroke width enlarged. The good thing is, this won't change the expected result at all since the padding remains the same. In fact, you can change the stroke tag to solid and still have the same result (however, if your images contain transparency you'd see the solid background in the transparent areas).

Give this a try; let me know how it works for you!