Removing the extra padding in a GridView in android

Question

I want to remove the extra padding that appears in a grid view. I have images of the size 128*128 which will be occupying cells in the grid. But somehow there is an extra sp

Answer 1

I used a variation of Shawn's solution.. it looks nice on the Emulator.

1) Decide on the # of columns, I chose 4

2) Set the Column Width

float xdpi = this.getResources().getDisplayMetrics().xdpi;
int mKeyHeight = (int) ( xdpi/4 );

GridView gridView = (GridView) findViewById(R.id.gridview); 
gridView.setColumnWidth( mKeyHeight );// same Height & Width

3) Setup the image in your adapter's getView method

imageView = new ImageView( mContext );
// (xdpi-4) is for internal padding
imageView.setLayoutParams(new GridView.LayoutParams( (int) (xdpi-4)/2, (int) (xdpi-4)/2));
imageView.setScaleType( ImageView.ScaleType.CENTER_CROP );
imageView.setPadding(1, 1, 1, 1);

4) Layout

<?xml version="1.0" encoding="utf-8"?>
    <GridView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/gridview"
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"
    android:numColumns="4"
    android:verticalSpacing="0dp"
    android:horizontalSpacing="0dp"
    android:gravity="center"
    android:listSelector="@null"
/>
<!-- 
    android:columnWidth="90dp"  Specified in code 
    android:stretchMode="columnWidth" no noticable change
-->

That's it.

Answer 2

Yep, I've had the same problem. You want to set the listSelector to @null:

<!-- Setting the listSelector to null removes the 5px border -->
<GridView
    android:id="@+id/view"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:listSelector="@null" />

Also, try the following:

myGridView.setStretchMode(GridView.STRETCH_COLUMN_WIDTH);

I see you can do this in the XML, but I didn't when I had this same problem; not sure why.

I also hard-coded the key height:

float density = getContext().getResources().getDisplayMetrics().density;
mKeyHeight = (int) (56 * density);
....
@Override
public View getView(int position, View convertView, ViewGroup parent) {
    ImageButton b = (ImageButton) convertView;
    if (b == null) {
        b = new ImageButton(getContext());
        b.setMinimumHeight(mKeyHeight);
        b.setBackgroundResource(R.drawable.btn_keyboard_key);
        b.setOnClickListener(this);
    }
}

Sorry about not giving a precise answer, so let me know if you still need help after that.

Answer 3

Even I had the same problem. Try this:

image.setLayoutParams(new GridView.LayoutParams(imageWidth , imageHeight)); imageView.setScaleType(ImageView.ScaleType.FIT_XY);.

Add padding accordingly for the images.It worked for me.

Answer 4

I had a similar problem, though in my case there was a quite large padding area at the bottom of my GridView (it was filled with the background color).
I haven't seen the solution to my issue here, so I'll post it here in case it's helpful.

Besides setting:

android:listSelector="@null"

in my GridView, I also had to set:

android:fadingEdgeLength="0px"

Or, in Java:

GridView.setFadingEdgeLength(0);

Answer 5

The correct answer is to set android:listSelector to @android:color/transparent, as user mvds said here.