GridLayout(not GridView) - Spaces between the cells
Asked Answered
G

2

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

Gallivant answered 30/1, 2014 at 11:40 Comment(4)
Why can't u use a fixed xml to show a single cell in your gridView?Vittle
The position of the buttons change depending on the user activity and hence i cannot have a fixed xml.Gallivant
Ok.. Now increase these two values app:columnCount="3" app:rowCount="5". You can observe change in your grid layoutVittle
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?Gallivant
G
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

Gallivant answered 30/1, 2014 at 12:20 Comment(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 <style> in style.xml, then put style=@style/YOURSTYLEHERE in the element. This makes re-use a lot simpler and doesn't stop you from inflating it to fill it dynamically later.Microparasite
The solution you found is correct and it really helped me out. But @Microparasite suggestion may help as well: it would be nice to edit the answer with its comment too :)Nike
Thanks for pointing me to useDefaultMargins and alignmentMode. Was exactly what I was looking for to add some spacing between the items.Ashy
L
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.

Lifesize answered 23/3, 2022 at 16:49 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.