How to align view in grid cells of GridLayout center?

Question

I have a simple gridlayout of 2x2. 3 of them have a view of red, green and blue. I want them to be center aligned in the grid's cells. My layout is as below, but the view are top-left aligned even when I have put layout_gravity for all the views as center. How could I solve this?

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.elyeproj.griddrag.MainActivity">

    <GridLayout
        android:id="@+id/container_grid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnCount="2"
        android:rowCount="2"
        android:orientation="horizontal">
        <View
            android:id="@+id/view_red"
            android:layout_height="100dp"
            android:layout_width="100dp"
            android:layout_gravity="center"
            android:background="#ff0000" />

        <View
            android:id="@+id/view_green"
            android:layout_height="100dp"
            android:layout_width="100dp"
            android:layout_gravity="center"
            android:background="#00ff00" />

        <View
            android:id="@+id/view_blue"
            android:layout_height="100dp"
            android:layout_width="100dp"
            android:layout_gravity="center"
            android:background="#0000ff" />
    </GridLayout>
</RelativeLayout>

Answer 1

the grid layout items are wrap so you better to use weight to align them properly as you want. below xml is what you want:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
>

<GridLayout
    android:id="@+id/container_grid"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="2"
    android:rowCount="3"
    android:orientation="horizontal">

    <View
        android:id="@+id/view_red"
        android:layout_height="100dp"
        android:layout_width="100dp"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_gravity="center"
        android:background="#ff0000"
        android:layout_row="0"
        android:layout_column="0" />

    <View
        android:id="@+id/view_green"
        android:layout_height="100dp"
        android:layout_width="100dp"
        android:layout_columnWeight="1"
        android:layout_gravity="center"
        android:background="#00ff00"
        android:layout_row="0"
        android:layout_column="1" />

    <View
        android:id="@+id/view_blue"
        android:layout_height="100dp"
        android:layout_width="100dp"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_gravity="center"
        android:background="#0000ff"
        android:layout_row="1"
        android:layout_column="0" />
    </GridLayout>
</RelativeLayout>

see the link below for another solution using linearlayout for api below 21: GridLayout (not GridView) how to stretch all children evenly