Creating responsive grid layout in android studio-CodePudding

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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="wrap_content"
    android:background="#804fc4"
    tools:context=".MainActivity">
    <GridLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity = "center"
        android:columnCount="2"
        android:layout_margin="@dimen/_10sdp"
        android:rowCount="5">

        <Button
            android:layout_width="@dimen/_130sdp"
            android:layout_height="@dimen/_50sdp"
            android:layout_margin="@dimen/_7sdp"
            android:text="button"
            android:textSize="@dimen/_10sdp"/>

        <Button
            android:layout_width="@dimen/_130sdp"
            android:layout_height="@dimen/_50sdp"
            android:layout_margin="@dimen/_7sdp"
            android:text="button"
            android:textSize="@dimen/_10sdp"/>

        <Button
            android:layout_width="@dimen/_130sdp"
            android:layout_height="@dimen/_50sdp"
            android:layout_margin="@dimen/_7sdp"
            android:text="button"
            android:textSize="@dimen/_10sdp"/>

        <Button
            android:layout_width="@dimen/_130sdp"
            android:layout_height="@dimen/_50sdp"
            android:layout_margin="@dimen/_7sdp"
            android:text="button"
            android:textSize="@dimen/_10sdp"/>


    </GridLayout>
</ScrollView>

I'm trying to create a grid layout that can fit in most of the devices. But children on right side are getting less margin compared to the children on left side. I've tried using gravity attribute but it didn't work. How can I give each side same amount of margin?

Here is the pic of how it looks https://i.stack.imgur.com/hCLut.png

CodePudding user response：

The problem is that you are assigning specific widths to the buttons when they should be allowed to vary. Try the following using

android:layout_width="0dp"
android:layout_columnWeight="1"
android:layout_gravity="fill_horizontal"

as XML attributes for the buttons. Also, make the width of the GridLayout match_parent.

<ScrollView 
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#804fc4"
    tools:context=".MainActivity">
    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity = "center"
        android:columnCount="2"
        android:layout_margin="@dimen/_10sdp"
        android:rowCount="5">

        <Button
            android:layout_width="0dp"
            android:layout_columnWeight="1"
            android:layout_gravity="fill_horizontal"
            android:layout_height="@dimen/_50sdp"
            android:layout_margin="@dimen/_7sdp"
            android:text="button"
            android:textSize="@dimen/_10sdp"/>

        <Button
            android:layout_width="0dp"
            android:layout_columnWeight="1"
            android:layout_gravity="fill_horizontal"
            android:layout_margin="@dimen/_7sdp"
            android:text="button"
            android:textSize="@dimen/_10sdp"/>

        <Button
            android:layout_width="@dimen/_130sdp"
            android:layout_height="@dimen/_50sdp"
            android:layout_columnWeight="1"
            android:layout_gravity="fill_horizontal"
            android:layout_margin="@dimen/_7sdp"
            android:text="button"
            android:textSize="@dimen/_10sdp"/>

        <Button
            android:layout_width="@dimen/_130sdp"
            android:layout_height="@dimen/_50sdp"
            android:layout_columnWeight="1"
            android:layout_gravity="fill_horizontal"
            android:layout_margin="@dimen/_7sdp"
            android:text="button"
            android:textSize="@dimen/_10sdp"/>
    </GridLayout>
</ScrollView>