Adam Knirsch
Adam Knirsch

Reputation: 463

Grid layout working differently on different phones

I have following xml file:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/backgroundColor"
tools:context=".MainActivity">

<com.google.android.material.appbar.MaterialToolbar
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/frameMain"
    android:contentInsetLeft="0dp"
    android:contentInsetStart="0dp"
    app:contentInsetLeft="0dp"
    app:contentInsetStart="0dp"
    style="@style/ToolbarElevation"
    />

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:rowCount="3"
    android:columnCount="1"
    android:layout_marginTop="80dp"
    android:layout_marginBottom="60dp">

    <com.google.android.material.button.MaterialButton
        android:layout_rowWeight="1"
        android:id="@+id/mainTestsButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:adjustViewBounds="true"

        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:onClick="goTest"
        android:visibility="visible"
        android:text="TESTY"
        android:elevation="4dp"
        app:icon="@drawable/ic_menu_quiz"
        style="Widget.MaterialComponents.Button.Icon"
        app:iconPadding="10dp"
        android:paddingTop="20dp"
        android:paddingBottom = "20dp"
        app:iconSize="80dp"
        app:iconGravity="start"
        android:textSize="25sp"
        android:backgroundTint="@color/colorSecondary"
        app:shapeAppearance="@style/ShapeAppearance.MyApp.SmallComponent"
        />


    <com.google.android.material.button.MaterialButton
        android:layout_rowWeight="1"
        android:id="@+id/mainLearnButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:adjustViewBounds="true"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:onClick="goLearn"
        android:visibility="visible"
        android:text="UČENÍ"
        android:elevation="4dp"
        app:icon="@drawable/ic_menu_book_24px"
        style="Widget.MaterialComponents.Button.Icon"
        app:iconPadding="10dp"
        app:iconSize="80dp"
        app:iconGravity="start"
        android:paddingTop="20dp"
        android:paddingBottom = "20dp"
        android:textSize="25sp"
        android:backgroundTint="@color/colorSecondary"
        app:shapeAppearance="@style/ShapeAppearance.MyApp.SmallComponent"
        />

    <com.google.android.material.button.MaterialButton
        android:layout_rowWeight="1"
        android:id="@+id/mainSettingsButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:adjustViewBounds="true"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:onClick="goSettings"
        android:visibility="visible"
        android:text="NASTAVENÍ"
        android:elevation="4dp"
        app:icon="@drawable/ic_settings_24px"
        style="Widget.MaterialComponents.Button.Icon"
        app:iconPadding="10dp"
        app:iconSize="80dp"
        app:iconGravity="start"
        android:paddingTop="20dp"
        android:paddingBottom = "20dp"
        android:textSize="25sp"
        android:backgroundTint="@color/colorSecondary"
        app:shapeAppearance="@style/ShapeAppearance.MyApp.SmallComponent"
        />

It works well on most phones (All Xiaomi, Samsung Galaxy S9, All Google Pixels) Correct design

However, it does not work on Moto Z, Mate 9, Nokia 1 and Xperia XZ1 Compact Incorrect design

Sometimes it happened even on my Xiaomi Mi A3 and on Pixel devices device, but it was never reproducible. It started happening after I changed a fixed grid layout height to match parent. Does anyone have any idea?

Upvotes: 0

Views: 73

Answers (1)

Mohammed Alloboany
Mohammed Alloboany

Reputation: 129

What if you use the LinearLayout instead of grid, your buttons are static views:

Set the LinearLayout orientation to vertical and the weight of items to 1.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_marginTop="80dp"
    android:layout_marginBottom="60dp">

    <com.google.android.material.button.MaterialButton
        android:layout_weight="1"
        android:id="@+id/mainTestsButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
      />
...

</LinearLayout>

Upvotes: 1

Related Questions