Question

I have a GridView in my Android application that has a number of ImageViews in it. The space on my screen is limited and I want the images to take up as much of the available space as they can. Unfortunately, the GridView always leaves 5 pixels of empty screen space around the outside edge of the ImageViews (the space between ImageViews is set with horizontal/vertical spacing and behaves correctly). The empty space acts kind of like a margin around the ImageViews, but I can’t get rid of it. Does anyone know what’s causing this “border” and how I can get rid of it (or at least make it smaller)? Thanks.

Update: I’m creating the ImageViews by inflating an .xml file in the getView() method of my Adapter class. Here’s the xml I’m inflating:

<ImageView
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:background="#FF00FF" />

I defined the GridView in my layout xml file like this:

<GridView
   android:id="@+id/mygrid"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:layout_above="@+id/abutton"
   android:layout_marginBottom="8dp"
   android:numColumns="5" android:background="#FF0000"/>

Here’s a screen shot of the problem. The red area in my GridView. The purple areas are my ImageViews. The image being displayed is a simple blue rectangle with a transparent center. The image is 45×45 pixels (but is only 30×30 pixels in my app – I’ll worry about that later). The red border around the purple is what I am trying to eliminate.

Answer 1

Thanks for the advice everyone, but it turns out the answer was somewhere that we didn’t expect. The extra pixels were caused by the selector that was assigned to my GridView. I guess the default selector is a 9-patch image that has a 5 pixel border around it. When I created and assigned a 9-patch that had smaller borders (or no borders at all – just a normal .png file) the extra space in my GridView went away.