Victor Pietro Moreno
Victor Pietro Moreno

Reputation: 29

Need help on creating 4 relative layouts inside a grid layout (2x2) and put one button in the center of each relative layout

I was trying to create a 2x2 grid layout with one relative layout inside each position in the grid. Later on, inside each position, I'd like to create a button and center it in the relative layout in which this button is inside (which in this case is the parent, am I right?)

So, I was creating everything with no problem so far, but then I got stuck in centering the button.

I've used android:gravity="center_horizontal" with android:layout_alignParentTop="true";

I've also tried using android:layout_gravity="center"

None seem to be working. I'll post my full xml code below - trying to center the first button in the first relative layout, but no success. I've done some research and couldn't find an answer that suits my case.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.victorpietro.musicproject.MainActivity">


    <GridLayout
        android:id="@+id/gridLayout"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:rowCount="2"
        android:columnCount="2"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <RelativeLayout
            android:id="@+id/r_layout1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_columnWeight="1"
            android:layout_row="0"
            android:layout_rowWeight="1"
            android:gravity="fill">

            <Button
                android:id="@+id/button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:layout_gravity="center"
                android:gravity="center_horizontal"
                android:text="Button" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/r_layout2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:layout_columnWeight="1"
            android:layout_row="0"
            android:layout_rowWeight="1"
            android:gravity="fill">

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/r_layout3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:layout_row="1"
            android:gravity="fill"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1">

            <Button
                android:id="@+id/button3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />
        </RelativeLayout>


        <RelativeLayout
            android:id="@+id/r_layout4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:layout_row="1"
            android:gravity="fill"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1">

            <Button
                android:id="@+id/button4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />
        </RelativeLayout>

    </GridLayout>

</android.support.constraint.ConstraintLayout>

Upvotes: 0

Views: 696

Answers (1)

Vishu
Vishu

Reputation: 326

remove android:gravity="fill" from RelativeLayout and add android:layout_gravity="center"

 <RelativeLayout
        android:id="@+id/r_layout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_column="0"
        android:layout_columnWeight="1"
        android:layout_row="0"
        android:layout_gravity="center"
        android:layout_rowWeight="1"
        >

        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button"/>
    </RelativeLayout>

Upvotes: 1

Related Questions