How To Fix Slow Rendering in my Android Code?

How To Fix Slow Rendering in my Android Code? - android

My app is running very slow when I Scroll Down. Please help me fix this issue.
I am concerned of this because of such articles that seem to say Google Play may penalize your app in the Play Store rankings if you fall in the bottom 25%.
All the project assets are present on this URL http://garudapixel.com/en/modern-dashboard-ui-design-android-studio-tutorial/
I want to make this type of layout in scrolling way...
XML Code
<?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="match_parent"
android:background="#drawable/bgapps"
tools:context=".MainActivity">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_marginTop="32dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/txtdashboard"
android:text="My Dashboard"
android:textColor="#FFFFFF"
android:textSize="22sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="12 Items"
android:layout_marginTop="6dp"
android:layout_below="#+id/txtdashboard"
android:textColor="#52BAFF"
android:textSize="14sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:layout_alignParentEnd="true"
android:src="#drawable/person"
android:layout_width="62dp"
android:layout_height="62dp" />
</RelativeLayout>
<GridLayout
android:columnCount="2"
android:rowCount="5"
android:alignmentMode="alignMargins"
android:columnOrderPreserved="false"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:padding="16dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/bookmark"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#6f6f6f"
android:textSize="18sp"
android:text="Calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
</LinearLayout>
</ScrollView>
Main Activity
package voidgoel.currentaffairs;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}

In my case I got the same problem. It was, images are very large. But your case you can also use recycle view with YourRecycleView.setLayoutManager(new GridLayoutManager(this,2)); within list. Images sizes are small is very important for that mode also. You can get some guide using below link.
https://www.journaldev.com/13792/android-gridlayoutmanager-example

Related

How to align linear ad layout at the bottom in the ScrollView?

Please see my code. I want to set the last linear layout at the bottom of the page. If I through it to the outside of Scrollview it did not work. Can anyone able to help me to solve it, please.. I attached the code. I try it with different combination, but it did not work. Thanks in advance.
<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:fillViewport="true"
android:paddingTop="65dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#drawable/backgroundmain"
tools:context=".TeamInfoAll">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp">
<androidx.cardview.widget.CardView
android:id="#+id/topcard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
android:layout_marginBottom="14dp"
app:cardBackgroundColor="#FAFAFA"
app:cardCornerRadius="12dp"
app:cardElevation="8dp"
tools:targetApi="lollipop">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/aboutbackground"
android:textAlignment="center"/>
</androidx.cardview.widget.CardView>
</LinearLayout>
<GridLayout
android:id="#+id/mainGrid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alignmentMode="alignMargins"
android:columnOrderPreserved="false"
android:padding="10dp"
android:columnCount="1"
android:rowCount="6">
<!--Row 1-->
<androidx.cardview.widget.CardView
android:id="#+id/cardView1"
android:layout_width="match_parent"
android:layout_height="60dp"
app:cardBackgroundColor="#4CAF50"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_marginBottom="14dp"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
app:cardElevation="8dp"
app:cardCornerRadius="12dp"
tools:targetApi="lollipop">
<TextView
android:id="#+id/cardView1Text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/Team1"
android:gravity="center_vertical"
android:textAlignment="center"
android:textColor="#FFFFFF"
android:textSize="25sp"
tools:ignore="RtlCompat" />
</androidx.cardview.widget.CardView>
<!--Row 2-->
<androidx.cardview.widget.CardView
android:id="#+id/cardView2"
android:layout_width="match_parent"
android:layout_height="60dp"
app:cardBackgroundColor="#F44336"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_marginBottom="14dp"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
app:cardElevation="8dp"
app:cardCornerRadius="12dp"
tools:targetApi="lollipop">
<TextView
android:id="#+id/cardView2Text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/Team2"
android:gravity="center_vertical"
android:textAlignment="center"
android:textColor="#FFFFFF"
android:textSize="25sp"
tools:ignore="RtlCompat" />
</androidx.cardview.widget.CardView>
<!--Row 3-->
<androidx.cardview.widget.CardView
android:id="#+id/cardView3"
android:layout_width="match_parent"
android:layout_height="60dp"
app:cardBackgroundColor="#2196F3"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_marginBottom="14dp"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
app:cardElevation="8dp"
app:cardCornerRadius="12dp"
tools:targetApi="lollipop">
<TextView
android:id="#+id/cardView3Text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/Team3"
android:gravity="center_vertical"
android:textAlignment="center"
android:textColor="#FFFFFF"
android:textSize="22sp"
tools:ignore="RtlCompat" />
</androidx.cardview.widget.CardView>
</GridLayout>
<LinearLayout
android:id="#+id/banner_container1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginTop="32dp"
android:gravity="bottom"
android:orientation="vertical"
tools:ignore="ObsoleteLayoutParam" />
</LinearLayout>

Try This
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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"
android:orientation="vertical">
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#drawable/backgroundmain"
android:fillViewport="true"
android:orientation="vertical"
android:paddingTop="65dp"
app:layout_constraintBottom_toTopOf="#+id/banner_container1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:context=".TeamInfoAll">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp">
<androidx.cardview.widget.CardView
android:id="#+id/topcard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
android:layout_marginBottom="14dp"
app:cardBackgroundColor="#FAFAFA"
app:cardCornerRadius="12dp"
app:cardElevation="8dp"
tools:targetApi="lollipop">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/aboutbackground"
android:textAlignment="center" />
</androidx.cardview.widget.CardView>
</LinearLayout>
<GridLayout
android:id="#+id/mainGrid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alignmentMode="alignMargins"
android:columnCount="1"
android:columnOrderPreserved="false"
android:padding="10dp"
android:rowCount="6">
<!--Row 1-->
<androidx.cardview.widget.CardView
android:id="#+id/cardView1"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
android:layout_marginBottom="14dp"
app:cardBackgroundColor="#4CAF50"
app:cardCornerRadius="12dp"
app:cardElevation="8dp"
tools:targetApi="lollipop">
<TextView
android:id="#+id/cardView1Text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:text="#string/Team1"
android:textAlignment="center"
android:textColor="#FFFFFF"
android:textSize="25sp"
tools:ignore="RtlCompat" />
</androidx.cardview.widget.CardView>
<!--Row 2-->
<androidx.cardview.widget.CardView
android:id="#+id/cardView2"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
android:layout_marginBottom="14dp"
app:cardBackgroundColor="#F44336"
app:cardCornerRadius="12dp"
app:cardElevation="8dp"
tools:targetApi="lollipop">
<TextView
android:id="#+id/cardView2Text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:text="#string/Team2"
android:textAlignment="center"
android:textColor="#FFFFFF"
android:textSize="25sp"
tools:ignore="RtlCompat" />
</androidx.cardview.widget.CardView>
<!--Row 3-->
<androidx.cardview.widget.CardView
android:id="#+id/cardView3"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
android:layout_marginBottom="14dp"
app:cardBackgroundColor="#2196F3"
app:cardCornerRadius="12dp"
app:cardElevation="8dp"
tools:targetApi="lollipop">
<TextView
android:id="#+id/cardView3Text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:text="#string/Team3"
android:textAlignment="center"
android:textColor="#FFFFFF"
android:textSize="22sp"
tools:ignore="RtlCompat" />
</androidx.cardview.widget.CardView>
</GridLayout>
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/banner_container1"
android:layout_width="0dp"
android:layout_height="100dp"
android:layout_alignParentBottom="true"
android:gravity="bottom"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:ignore="ObsoleteLayoutParam" />
</androidx.constraintlayout.widget.ConstraintLayout>
You can adjust the height of the bottom layout as per your requirement.

Gridlayout layout not working correctly on some android

I am working on grid-layout and designed layout with 3 column and 5 rows. Its working fine on most androids but some my application users reported that on their android it shows very ugly layout. I can't figureout whats the issue with interface. It shows me proper 3 columns but on some my users android, grid-layout cells goes outside the screen and not showing another 2 cells.
I have deleted 5th rows code due to character's limitation 30,000
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alignmentMode="alignMargins"
android:columnCount="3"
android:columnOrderPreserved="false"
android:rowCount="6">
<androidx.cardview.widget.CardView
android:id="#+id/numsection"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="verify"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newsim" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="نمبرملکیت"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="cnic"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newothersims" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="ملحقہ نمبرز"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/emergencysection"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="random"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newemergency" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="ایمرجینسی"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="drivingmenu"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newdriving" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="ڈرائیونگ لائسنس"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="vehiclemenu"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newvehicle" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="ملکیت وہیکل"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="idcardaddress"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/id" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="آئیڈی انفارمیشن"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="punjabland"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newpunjabland" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="پنجاب لینڈ"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/freshsection"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="newdata"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newoffice" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="فریش ڈیٹا"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/nadraclick"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="newdata"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/nadra" />
<TextView
android:id="#+id/activate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="نادرا رجسٹریشن"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="ip"
app:cardElevation="5dp">
<com.flyco.labelview.LabelView xmlns:lv="http://schemas.android.com/apk/res-auto"
android:id="#+id/iptag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:paddingLeft="1dp"
android:paddingRight="1dp"
lv:lv_background_color="#FF5722"
lv:lv_fill_triangle="true"
lv:lv_gravity="TOP_LEFT"
lv:lv_text="Global"
lv:lv_text_all_caps="false"
lv:lv_text_size="10sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newip" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="آئی پی انفارمیشن"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="telenorblock"
app:cardElevation="5dp">
<com.flyco.labelview.LabelView xmlns:lv="http://schemas.android.com/apk/res-auto"
android:id="#+id/telenortag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:paddingLeft="1dp"
android:paddingRight="1dp"
lv:lv_background_color="#FF5722"
lv:lv_fill_triangle="true"
lv:lv_gravity="TOP_LEFT"
lv:lv_text="Global"
lv:lv_text_all_caps="false"
lv:lv_text_size="10sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/telenor" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="ٹیلینارنمبربلاک"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/fbhacksection"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="1dp"
android:onClick="FacebookHack"
app:cardElevation="5dp">
<com.flyco.labelview.LabelView xmlns:lv="http://schemas.android.com/apk/res-auto"
android:id="#+id/fbhacktag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:paddingLeft="1dp"
android:paddingRight="1dp"
lv:lv_background_color="#FF5722"
lv:lv_fill_triangle="true"
lv:lv_gravity="TOP_LEFT"
lv:lv_text="Global"
lv:lv_text_all_caps="false"
lv:lv_text_size="10sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newhacking" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="فیسبک ہیک"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
Some Screenshots
Actual Layout
On some android shows ugly interface

Try This Solution:
will create recyclerview
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rc_txt_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
app:spanCount="3" />
We will create rowView
<androidx.cardview.widget.CardView
android:id="#+id/emergencysection"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="1dp"
android:onClick="random"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="5dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#mipmap/newemergency" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/jameel"
android:text="ایمرجینسی"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>

Android Grid Layout Cardview items visible only from top of the screen

I am having a problem in my application, card view items are only visible from the top of the screen when I start scrolling the page.
here is the screenshot
here's the COMPLETE dashboard XML grid layout code for some items
<?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="400dp"
android:layout_height="200dp"
android:background="#drawable/green"
tools:context=".Dashboard">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="20dp"
android:layout_marginRight="32dp"
android:layout_marginLeft="32dp"
android:paddingLeft="20dp">
<TextView
android:textSize="24sp"
android:textColor="#FFFFFF"
android:textStyle="bold"
android:text="Dashboard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_marginTop="30dp"
android:id="#+id/txtdashboard"
android:textColor="#52BAFF"
android:text="Items"
android:textStyle="bold"
android:textSize="24sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<ImageView
android:layout_width="62dp"
android:layout_height="62dp"
android:layout_alignParentRight="true"
android:src="#drawable/menu" />
</RelativeLayout>
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:numColumns="2"
android:rowCount="5">
USER XML
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/users"
android:layout_gravity="center"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:textColor="#6f6f6f"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="User"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
LOGOUT XML CODE
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/logoutt"
android:layout_gravity="center"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:textColor="#6f6f6f"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="LogOut"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
CALENDER XML CODES
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/calender"
android:layout_gravity="center"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:textColor="#6f6f6f"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="Calendar"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
COWS XML CODE
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/logo"
android:layout_gravity="center"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:textColor="#6f6f6f"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="Cows"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
MILK
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/milk"
android:layout_gravity="center"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:textColor="#6f6f6f"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="Milk"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
FEEDS
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/feed"
android:layout_gravity="center"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:textColor="#6f6f6f"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="Feeds"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
M-REPORTS
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/report" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="M-Reports"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
REPORTS
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_gravity="center"
android:src="#drawable/report"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:layout_gravity="center"
android:textColor="#6f6f6f"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="F-Reports"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
RETURNS CARD
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_gravity="center"
android:src="#drawable/profit"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:textColor="#6f6f6f"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="Returns"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
ABOUT CARD VIEW
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_row="1"
app:cardElevation="6dp"
app:cardCornerRadius="12dp"
android:layout_margin="12dp"
>
<LinearLayout
android:orientation="vertical"
android:padding="16dp"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/about"
android:layout_gravity="center"
android:layout_width="80dp"
android:layout_height="80dp"
/>
<TextView
android:textColor="#6f6f6f"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:textSize="24sp"
android:textStyle="bold"
android:text="About"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
</LinearLayout>
It should be able to view grid items from the bottom up the screen as I scroll up but I don't know what's wrong. Please help

Here is the updated layout.
It's working fine.
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:numColumns="2"
android:rowCount="3">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center"
android:src="#drawable/logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:text="User"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center"
app:srcCompat="#drawable/ic_logout" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:text="LogOut"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center"
app:srcCompat="#drawable/ic_camera" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center"
android:src="#drawable/logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:text="Cows"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center"
android:src="#drawable/logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:text="Milk"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center"
android:src="#drawable/logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:text="Feeds"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="M-Reports"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center"
android:src="#drawable/logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="12dp"
android:text="F-Reports"
android:textColor="#6f6f6f"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
</ScrollView>

Grid Layout Isn't Showing in Android Fragment

I want to create some 4 grid layout which is have Constraint Layout as a root layout. The file is created to be as a fragment, but I think that won't be a problem, mentioned in title to describe it as detail as possible.
The xml file is looked like this:
<?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"
android:background="#color/colorPrimaryLight"
tools:context=".view.LoanDetail">
<View
android:id="#+id/divider_loan"
android:layout_width="match_parent"
android:layout_height="3dp"
android:layout_marginTop="8dp"
android:background="#drawable/line_white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:id="#+id/linearLayout3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:baselineAligned="false"
android:orientation="horizontal"
android:weightSum="2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/divider_loan">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:drawableEnd="#drawable/ic_money_outl"
android:drawablePadding="#dimen/margin16"
android:gravity="center"
android:text="Total Pinjaman"
android:textColor="#color/white" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="start|center_vertical"
android:orientation="horizontal">
<TextView
android:id="#+id/tv_currency_dep"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginEnd="#dimen/margin8"
android:gravity="center|clip_vertical"
android:text="IDR"
android:textColor="#color/white"
android:textSize="12sp" />
<TextView
android:id="#+id/TEXTVIEW"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginEnd="#dimen/margin8"
android:gravity="center_vertical"
android:text="100,000,000"
android:textColor="#color/white"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>
<GridLayout
android:id="#+id/gridLayout"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="#dimen/margin16"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:padding="#dimen/margin8"
android:rowCount="2"
app:layout_constraintBottom_toTopOf="#+id/linearLayout4"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout3">
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginStart="#dimen/margin8"
android:layout_marginEnd="#dimen/margin8"
android:layout_marginBottom="#dimen/margin8"
app:cardCornerRadius="#dimen/margin8"
app:cardElevation="#dimen/margin8">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingStart="#dimen/margin8"
android:paddingTop="#dimen/margin16"
android:paddingEnd="#dimen/margin8"
android:paddingBottom="#dimen/margin8">
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pokok"
android:textColor="#color/black" />
<TextView
android:id="#+id/textView12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin24"
android:text="IDR"
android:textColor="#color/colorPrimaryLight"
android:textSize="12sp" />
<TextView
android:id="#+id/tv_loan_det_prim"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin8"
android:layout_marginTop="#dimen/margin8"
android:text="100,000,000"
android:textColor="#color/colorPrimaryLight"
android:textSize="18sp" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginStart="#dimen/margin8"
android:layout_marginEnd="#dimen/margin8"
android:layout_marginBottom="#dimen/margin8"
app:cardCornerRadius="#dimen/margin8"
app:cardElevation="#dimen/margin8">
<LinearLayout
android:id="#+id/rel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingStart="#dimen/margin8"
android:paddingTop="#dimen/margin16"
android:paddingEnd="#dimen/margin8"
android:paddingBottom="#dimen/margin8">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/textView14"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Angsuran"
android:textColor="#color/black" />
<TextView
android:id="#+id/textView15"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin8"
android:layout_marginEnd="#dimen/margin8"
android:text="TERTUNGGAK"
android:textColor="#color/colorAccent"
android:textSize="10sp" />
</LinearLayout>
<TextView
android:id="#+id/textView16"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin24"
android:text="IDR"
android:textColor="#color/colorPrimaryLight"
android:textSize="12sp" />
<TextView
android:id="#+id/textView17"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin8"
android:layout_marginTop="#dimen/margin8"
android:text="500,000"
android:textColor="#color/colorAccent"
android:textSize="18sp" />
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="36dp"
android:layout_marginStart="#dimen/margin8"
android:layout_marginTop="#dimen/margin8"
android:layout_marginEnd="#dimen/margin8"
android:background="#drawable/bg_green_primary"
android:text="BAYARAN"
android:textColor="#color/white" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginStart="#dimen/margin8"
android:layout_marginEnd="#dimen/margin8"
android:layout_marginBottom="#dimen/margin8"
app:cardCornerRadius="#dimen/margin8"
app:cardElevation="#dimen/margin8">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingStart="#dimen/margin8"
android:paddingTop="#dimen/margin16"
android:paddingEnd="#dimen/margin8"
android:paddingBottom="#dimen/margin8">
<TextView
android:id="#+id/textView18"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Sisa Plafon"
android:textColor="#color/black" />
<TextView
android:id="#+id/textView19"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin24"
android:text="IDR"
android:textColor="#color/colorPrimaryLight"
android:textSize="12sp" />
<TextView
android:id="#+id/textView20"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin8"
android:layout_marginTop="#dimen/margin8"
android:text="9,500,000"
android:textColor="#color/colorPrimaryLight"
android:textSize="18sp" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_marginStart="#dimen/margin8"
android:layout_marginEnd="#dimen/margin8"
android:layout_marginBottom="#dimen/margin8"
app:cardCornerRadius="#dimen/margin8"
app:cardElevation="#dimen/margin8">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:orientation="vertical"
android:paddingStart="#dimen/margin8"
android:paddingTop="#dimen/margin16"
android:paddingEnd="#dimen/margin8"
android:paddingBottom="#dimen/margin8">
<TextView
android:id="#+id/textView21"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Tenor/Bunga Bulanan"
android:textColor="#color/black" />
<TextView
android:id="#+id/textView22"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin8"
android:layout_marginTop="#dimen/margin24"
android:text="12 / 0.50%"
android:textColor="#color/colorPrimaryLight"
android:textSize="18sp" />
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
<LinearLayout
android:id="#+id/linearLayout4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="16dp"
android:background="#drawable/bg_green_dark"
android:orientation="horizontal"
android:padding="#dimen/margin16"
android:weightSum="4"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent">
<TextView
android:id="#+id/textView9"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:drawableTop="#drawable/ic_list_inactive"
android:gravity="center"
android:text="Senarai Simpanan"
android:textColor="#color/grey_inactive" />
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:clickable="true"
android:drawableTop="#drawable/ic_apps"
android:focusable="true"
android:gravity="center"
android:text="Detil"
android:textColor="#color/white" />
<TextView
android:id="#+id/textView11"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:drawableTop="#drawable/ic_history_inactive"
android:gravity="center"
android:text="Transaksi"
android:textColor="#color/grey_inactive" />
<TextView
android:id="#+id/textView13"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:drawableTop="#drawable/ic_pen_inactive"
android:gravity="center"
android:text="Aplikasi Baru"
android:textColor="#color/grey_inactive" />
</LinearLayout>
</android.support.constraint.ConstraintLayout>
And it should be looked like this (screenshot taken from Android Studio preview)
But the output in the real device the Grid layout is not showing.
Is there a thing I miss?
#Note: The rest layout is showed just fine no problem, only the GridLayout.

Please set the height and width of the GridLayout, where you didn't define, please copy and paste the code as it is which is given below it will definitely work.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<GridLayout
android:id="#+id/gridLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:rowCount="2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:ignore="MissingConstraints">
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pokok"
android:textColor="#color/black" />
<TextView
android:id="#+id/textView12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="IDR"
android:textSize="12sp" />
<TextView
android:id="#+id/tv_loan_det_prim"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="100,000,000"
android:textSize="18sp" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
>
<LinearLayout
android:id="#+id/rel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/textView14"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Angsuran"
android:textColor="#color/black" />
<TextView
android:id="#+id/textView15"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TERTUNGGAK"
android:textColor="#color/colorAccent"
android:textSize="10sp" />
</LinearLayout>
<TextView
android:id="#+id/textView16"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="IDR"
android:textSize="12sp" />
<TextView
android:id="#+id/textView17"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="500,000"
android:textColor="#color/colorAccent"
android:textSize="18sp" />
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="36dp"
android:text="BAYARAN"
android:textColor="#color/white" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<TextView
android:id="#+id/textView18"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Sisa Plafon"
android:textColor="#color/black" />
<TextView
android:id="#+id/textView19"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="IDR"
android:textSize="12sp" />
<TextView
android:id="#+id/textView20"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="9,500,000"
android:textSize="18sp" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:orientation="horizontal">
<TextView
android:id="#+id/textView21"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Tenor/Bunga Bulanan"
android:textColor="#color/black" />
<TextView
android:id="#+id/textView22"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="12 / 0.50%"
android:textSize="18sp" />
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
</android.support.constraint.ConstraintLayout>

implementation 'com.android.support:support-v4:28.0.0'
implementation'com.android.support:design:28.0.0'

CardView inside GridLayout going off screen

I am using a GridLayout with CardViews inside of it to display a set of objects for users to click on and use to navigate around the app.
Everything appears to be fine on my tablet that I am testing on, but when I sent the APK to a friend, 2/3 of it runs off the screen and just doesn't seem to work.
Example screenshot:
The "Games" section here seems to work just fine. Unable to find any errors, I copy and pasted this section into the "Community" section and just re-named the icons so that the code would be identical except for a few strings.
I don't understand why one section will work and the others do not.
Layout.xml File
<?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="match_parent"
android:background="#drawable/gradient_background"
tools:context=".Dashboard">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_marginTop="32dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="Dashboard"
android:id="#+id/dashTextMain"
android:textSize="34sp"
android:textColor="#FFF"
android:fontFamily="sans-serif-black"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/dashTextSub"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/dashTextMain"
android:layout_marginTop="-2dp"
android:text="Welcome to RoCodes.io,"
android:textColor="#E8E8E8"
android:textSize="20sp" />
<TextView
android:id="#+id/dashTextSub2"
android:textSize="20sp"
android:textColor="#E8E8E8"
android:text="what would you like to find?"
android:paddingBottom="50dp"
android:layout_below="#id/dashTextSub"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
//---------------------- START FIRST GRID LAYOUT -------------------------------------
<TextView
android:text="Music"
android:layout_marginLeft="20dp"
android:textSize="34sp"
android:textColor="#FFFFFF"
android:fontFamily="sans-serif-black"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<GridLayout
android:rowCount="1"
android:columnCount="2"
android:alignmentMode="alignMargins"
android:columnOrderPreserved="false"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="30dp"
>
<android.support.v7.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/musicCodesButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFF"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/ic_music" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Music Codes"
android:textColor="#000000"
android:textSize="18dp" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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/artistSearchButton"
android:orientation="vertical"
android:background="#FFF"
android:gravity="center"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/ic_artist"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#000000"
android:textSize="18dp"
android:text="Search Artists"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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/categorySearchButton"
android:orientation="vertical"
android:background="#FFF"
android:gravity="center"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/ic_categories"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#000000"
android:textSize="18dp"
android:text="Music Categories"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
//---------------------- END FIRST GRID LAYOUT -------------------------------------
//---------------------- START SECOND GRID LAYOUT -------------------------------------
<TextView
android:text="Games"
android:layout_marginLeft="20dp"
android:textSize="34sp"
android:textColor="#FFFFFF"
android:fontFamily="sans-serif-black"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<GridLayout
android:rowCount="1"
android:columnCount="2"
android:layout_marginBottom="30dp"
android:alignmentMode="alignMargins"
android:columnOrderPreserved="false"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<android.support.v7.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/twitterCodesButton"
android:orientation="vertical"
android:gravity="center"
android:background="#FFFFFF"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/ic_newcodes"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#000000"
android:textSize="18dp"
android:text="New Codes"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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:orientation="vertical"
android:gravity="center"
android:background="#FFFFFF"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/ic_gamecodes"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#000000"
android:textSize="18dp"
android:text="Coming Soon"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
//---------------------- END SECOND GRID LAYOUT -------------------------------------
//---------------------- START THIRD GRID LAYOUT -------------------------------------
<TextView
android:text="Community"
android:layout_marginLeft="20dp"
android:textSize="34sp"
android:textColor="#FFFFFF"
android:fontFamily="sans-serif-black"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<GridLayout
android:rowCount="1"
android:columnCount="2"
android:layout_marginBottom="30dp"
android:alignmentMode="alignMargins"
android:columnOrderPreserved="false"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<android.support.v7.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/discordServerButton"
android:orientation="vertical"
android:gravity="center"
android:background="#FFFFFF"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/ic_discord"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#000000"
android:textSize="18dp"
android:text="RoCodes Discord"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.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/websiteButton"
android:orientation="vertical"
android:gravity="center"
android:background="#FFFFFF"
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#drawable/ic_website"
android:layout_width="80dp"
android:layout_height="80dp" />
<TextView
android:layout_marginTop="12dp"
android:textColor="#000000"
android:textSize="18dp"
android:text="RoCodes Website"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
//---------------------- END THIRD GRID LAYOUT -------------------------------------
</LinearLayout>
</ScrollView>```

I had the same problem trying to align my GridLayout children (especially when using a CardView). I solved it by setting the following attributes for each child:
android:layout_columnWeight="1"
android:layout_gravity="fill_horizontal"
Like for example:
<GridLayout
android:id="#+id/grLayout_HelloWorld"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:columnCount="2"
android:rowCount="1"
android:useDefaultMargins="true">
<androidx.cardview.widget.CardView
android:id="#+id/crdView_simple_Card00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill_horizontal"
app:cardBackgroundColor="#color/color_lime_shade1">
<TextView
android:id="#+id/txtView_TestCard00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="My First Card" />
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/crdView_simple_Card01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill_horizontal"
app:cardBackgroundColor="#color/color_lime_shade1">
<TextView
android:id="#+id/txtView_TestCard01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="My Second Card" />
</androidx.cardview.widget.CardView>
</GridLayout>
You will notice that i did not use the rowWeight attribute.
Disclaimer:
To be honest, I have no idea WHY this works... All I know is that it bothered me for some time, and I spent a lot of time on Google and StackOverflow until I found some info saying that fill_horizontal might be the solution... Then I just hacked my way from there, trying different layout attributes until I found columnWeight as well.
Hope this helps... Let me know if it works for you.
Good luck, brother (or sister) ✊

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

How To Fix Slow Rendering in my Android Code? - android

Related

How to align linear ad layout at the bottom in the ScrollView?

Gridlayout layout not working correctly on some android

Android Grid Layout Cardview items visible only from top of the screen

Grid Layout Isn't Showing in Android Fragment

CardView inside GridLayout going off screen

Categories

Resources