Android xml design slowing down my application

94
January 17, 2021, at 01:00 AM

I have a layout design in my app.

It works smooth on emulator but when I open the App on a real device and scroll it, it scrolls rough I mean not smooth, too slow.

(I used android:largeHeap="true" otherwise it didn't work on my device but only on emulator.)

Can you help me to make it move smoothly?

Picture of xml design

<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <GridLayout
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".FirstFragment"
    android:columnOrderPreserved="false"
    android:alignmentMode="alignMargins"
    android:rowCount="6"
    android:columnCount="2">
        <androidx.cardview.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            app:cardElevation="6dp"
            app:cardCornerRadius="12dp"
            android:layout_margin="12dp"
            >
            <LinearLayout
                android:id="@+id/animal_layout"
                android:orientation="vertical"
                android:gravity="center"
                android:padding="16dp"
                android:layout_width="match_parent"
                android:layout_height="match_parent">
                <ImageView
                    android:src="@drawable/elephant"
                    android:layout_width="80dp"
                    android:layout_height="80dp"/>
                <TextView
                    android:layout_marginTop="12dp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Animals"
                    android:textSize="18sp"
                    android:textColor="#6f6f6f"/>
            </LinearLayout>
        </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="130dp"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        
        <LinearLayout
            android:id="@+id/art_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
                 <ImageView
                     android:src="@drawable/art"
                     android:layout_width="80dp"
                     android:layout_height="80dp"/>
                 <TextView
                     android:layout_marginTop="12dp"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:text="Art"
                     android:textSize="18sp"
                     android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="130dp"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/biography_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/biography"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Biography"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/countries_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/countries"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Countries"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/culture_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/culture"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Culture"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>

    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/environment_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/environment"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Environment"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/health_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/health"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Health"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/holidays_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/holidays"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Holidays"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/literature_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/literature"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Literature"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/politics_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/politics"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Politics"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/science_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/science"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Science"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>
    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        app:cardElevation="6dp"
        app:cardCornerRadius="12dp"
        android:layout_margin="12dp"
        >
        <LinearLayout
            android:id="@+id/sports_layout"
            android:orientation="vertical"
            android:gravity="center"
            android:padding="16dp"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <ImageView
                android:src="@drawable/sport"
                android:layout_width="80dp"
                android:layout_height="80dp"/>
            <TextView
                android:layout_marginTop="12dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Sports"
                android:textSize="18sp"
                android:textColor="#6f6f6f"/>
        </LinearLayout>

    </androidx.cardview.widget.CardView>

</GridLayout>
</ScrollView>
Answer 1

I solved the problem by decreasing sizes of pictures in imageView.

Answer 2

Each widget and layout you add to your application requires initialization, layout, and drawing. For example, using nested instances of LinearLayout can lead to an excessively deep view hierarchy. Furthermore, nesting several instances of LinearLayout that use the layout_weight parameter can be especially expensive as each child needs to be measured twice. This is particularly important when the layout is inflated repeatedly, such as when used in a ListView or GridView.

Read here for Optimizing layout - https://developer.android.com/training/improving-layouts/optimizing-layout

Solution -

ConstraintLayout is the new way to achieve the same flat xml structure. It will surely improve your response time

You can read more about how Constraint Layout improve performance at

https://android-developers.googleblog.com/2017/08/understanding-performance-benefits-of.html

READ ALSO
Passy password generator with boolean parameters

Passy password generator with boolean parameters

Wanted to know the best way to solve thisInput: Will be using the passayPassGenerator and setting the booleans

118
Dashboard Header button and footer button not getting aligned properly in concrete 5

Dashboard Header button and footer button not getting aligned properly in concrete 5

In concrete 5 - Under dashboard pages Header and footer buttons are not getting aligned properlyNeed help

191
Laravel 8 - Automatically update a form field when certain value is selected

Laravel 8 - Automatically update a form field when certain value is selected

I have a truck table and a postman tableBoth tables have a one to one relationship

102
Mongodb Docker init configuration

Mongodb Docker init configuration

I have problems with my docker-mongodb configurationWhen I try to access my mongodb's collection through mongoose, mongo returns the following error:

119