Horizontally center Views inside Android GridLayout

Question

We are writing an app targeting ICS+ and believe a GridLayout is the best layout paradigm, but it seems very little has been written about it, and we are having some alignment issues.

<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 right-most icon centers with the remaining space.

Essentially what we need to do is specify the size of each column to be 1/3 (since 3 columns) of the total screen size. I thought this is what GridLayout did, but it appears 'wrap_content' causes this behavior (makes sense), but 'match_parent' causes the first column to fill the entire screen, rather than fill its cell which is the behavior I would have expected.

We seem to have tried every combination of gravity, layout_gravity, etc., but either we fundamentally are doing something wrong, or have found a limitation of the GridLayout.

Thanks for your help!

Laurentian

GridLayout seems useless! – Muna

Answer 1

Only one row and one column is allowed to grow in a GridLayout, and that is the one with gravity along that axis. If more than one row or column specify gravity only one will get it (if I remember it is the "last" one). Choose another layout or write your own. If you only want a row with equally split icons you can use a LinearLayout where the widths of the components are 0px and the weight are all the same, e.g. 1.

Wenoa

Thanks for the answer. Out of curiosity, where did you find that limitation? We are going to investigate more, but it seems likely you are correct here. – Laurentian

As with many things with Android it was trial-and-error and reading the source ;) But there is actually a section in the docs called Limitations, with the following sentences: "GridLayout does not provide support for the principle of weight, as defined in weight. In general, it is not therefore possible to configure a GridLayout to distribute excess space between multiple components." – Wenoa

Thanks. I know I am diverging from the initial question here--but is "weight" in a LinearLayout the concept I am likely looking for? My goal is to evenly distribute these icons within the screen with an equal amount of spacing. – Laurentian

Including this useful link about LinearLayouts and weights for posterity: joseluisugia.wordpress.com/2012/01/19/… – Laurentian