11

I am using GridLayout(support) for displaying ImageViews in my application. There are 3 columns and 5 rows. The problem is that the cells in the GridLayout automatically get some space between them. I am not setting any padding or margin for the cells. Please refer to the image below. All cells are added dynamically and here is how I add these cells.

Getting Screen Width and Height:

Point size = new Point();
getWindowManager().getDefaultDisplay().getSize(size);
screenWidth = size.x;
screenHeight = size.y;
rowHeight = (int) (screenHeight * 0.2);

Adding View to GridLayout:

    GridLayout.LayoutParams params = new GridLayout.LayoutParams(
            getSpec(rowColumn[0]), getSpec(rowColumn[1]));

    params.height = rowHeight;

    if (rowColumn[1].equalsIgnoreCase("col_full")) {
        params.width = (int) (screenWidth);
    } else if (rowColumn[1].equalsIgnoreCase("col_two_part")) {
        params.width = (int) (screenWidth * 0.6);
    } else {
        params.width = (int) (screenWidth * 0.3);
    }

    ImageButton image = (ImageButton) imageHashMap
            .get(reOrderedButtonsListCopy.get(i));
    image.setLayoutParams(params);

    gridLayout.addView(image, params);

XML Layout:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res/com.xx.xxx"
    android:id="@+id/scrollView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <android.support.v7.widget.GridLayout
            xmlns:app="http://schemas.android.com/apk/res/com.xx.xxx"
            android:id="@+id/gridlayout_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="2dp"
            app:columnCount="3"
            app:rowCount="5" >
        </android.support.v7.widget.GridLayout>

    </LinearLayout>

</ScrollView>

Current result:

enter image description here

The red lines show the spaces in between the cells. Also, there is some space on the left side of GridLayout. I have only given 2dp as layout_margin. Any reasons why this padding occurs?

[EDIT]

Making the following changes removed the spacings.

gridLayout = (GridLayout) findViewById(R.id.gridlayout_main);
gridLayout.setUseDefaultMargins(false);
gridLayout.setAlignmentMode(GridLayout.ALIGN_BOUNDS);
gridLayout.setRowOrderPreserved(false);

Refer to the image below.

enter image description here

Aziz Shaikh
  • 16,245
  • 11
  • 62
  • 79
Vamsi Challa
  • 11,038
  • 31
  • 99
  • 149
  • Why can't u use a fixed xml to show a single cell in your gridView? – saa Jan 30 '14 at 11:52
  • The position of the buttons change depending on the user activity and hence i cannot have a fixed xml. – Vamsi Challa Jan 30 '14 at 11:54
  • Ok.. Now increase these two values app:columnCount="3" app:rowCount="5". You can observe change in your grid layout – saa Jan 30 '14 at 11:56
  • My requirement is that I have a 3 column 5 row ed, GridLayout. Can you explain me, how changing these values will remove the spaces between the columns and rows? – Vamsi Challa Jan 30 '14 at 11:58

2 Answers2

13

Found the solution.

Making the following changes removed the spacings.

gridLayout = (GridLayout) findViewById(R.id.gridlayout_main);
gridLayout.setUseDefaultMargins(false);
gridLayout.setAlignmentMode(GridLayout.ALIGN_BOUNDS);
gridLayout.setRowOrderPreserved(false);

Refer to the image below.

enter image description here

Vamsi Challa
  • 11,038
  • 31
  • 99
  • 149
  • 3
    This is really good information, but I'd also like to point out that android:useDefaultMargins can be set to TRUE or FALSE in xml or overridden by providing a marginTop/Bottom/Left/Right. Personally I like uniformity so I create a – G_V Nov 06 '14 at 10:54
  • The solution you found is correct and it really helped me out. But @G_V suggestion may help as well: it would be nice to edit the answer with its comment too :) – andrea.rinaldi Apr 23 '15 at 07:32
  • Thanks for pointing me to `useDefaultMargins` and `alignmentMode`. Was exactly what I was looking for to add some spacing between the items. – David Gay Jan 12 '18 at 16:57
0

The only solution that worked for me was to add extra columns in the GridLayout like android:columnCount="7" and then the column that needs more width set to 3 or more. The more space you want to give to that column. It then automatically reserves more space for those columns. The whole GridLayout works as a stretching thing. The columnWeight says how much a column can stretch.