Horizontal Views Center in Android GridLayout

Question

We are writing an application targeted at ICS + and we believe that GridLayout is the best layout paradigm, but very little has been written about it, and we have problems with alignment.

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/row_background" android:rowCount="1" android:columnCount="3" android:layout_width="match_parent" android:layout_height="match_parent" android:useDefaultMargins="true" android:background="@drawable/list_item_bg"> <ImageView android:id="@+id/visibilityIcon" android:layout_row="0" android:layout_column="0" android:src="@drawable/visibility_icon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal"/> <ImageView android:id="@+id/windIcon" android:layout_row="0" android:layout_column="1" android:src="@drawable/wind_icon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal"/> <ImageView android:id="@+id/crosswindIcon" android:layout_row="0" android:layout_column="2" android:src="@drawable/cloud_icon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal"/> </GridLayout> 

However, the left 2 icons remain left aligned and the rightmost icon is centered with the remaining space.

Essentially, we need to specify the size of each column as 1/3 (with 3 columns) of the total screen size. I thought that this is what GridLayout did, but it seems that “wrap_content” causes this behavior (makes sense), but “match_parent” forces the first column to fill the entire screen, rather than filling its cell, as I would expect.

It seems that we tried every combination of gravity, layout_gravity, etc., but either we are fundamentally doing something wrong, or we found a GridLayout constraint.

Thank you for your help!

Answer 1

Only one row and one column can grow in a GridLayout, and this is the force that has gravity along this axis. If several rows or columns define gravity, then only one will get it (if I remember that this is the "last"). Choose a different layout or write your own. If you only need a line with equally spaced icons, you can use LinearLayout, where the component width is 0px and the weight is the same, for example. one.