Develop Reference

how to evenly distribute a CardView in android

In my .XML layout file, how can I evenly distribute a cardview so that there are 3 parts and each of them has 2vertical textviews in it ? I wrote the following code but all the texts are under each other. the picture below is what I want it to look like :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="83dp"
android:layout_margin="5dp"
app:cardCornerRadius="5dp"
app:cardElevation="5dp"
app:cardUseCompatPadding="false">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1">
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>

You could use ConstraintLayout to easily make the view evenly distribute vertically or horizontally. And you should have 3 Card views instead of just 1. Each of the CardView will contain the TextView you want to show.
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<androidx.cardview.widget.CardView
android:id="#+id/cardone"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toStartOf="#+id/cardtwo"
app:layout_constraintHorizontal_bias="0.5"
app:cardBackgroundColor="#color/black"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:padding="4dp"
android:textColor="#color/white"
android:text="textviewone" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:textColor="#color/white"
android:padding="4dp"
android:text="textviewone" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/cardtwo"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:cardBackgroundColor="#color/black"
app:layout_constraintEnd_toStartOf="#+id/cardView"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/cardone"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:padding="4dp"
android:textColor="#color/white"
android:text="textviewone" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:textColor="#color/white"
android:padding="4dp"
android:text="textviewone" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="#+id/cardView"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:cardBackgroundColor="#color/black"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="#+id/cardtwo"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:padding="4dp"
android:textColor="#color/white"
android:text="textviewone" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
android:gravity="center"
android:textColor="#color/white"
android:padding="4dp"
android:text="textviewone" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>

Not showing components following format LinearLayout inside GridLayout contains CardView in LinearLayout

I am implementing card view through GridLayout in android but my card view is not showing up. I want to display main layout is Liner Layout inside Grid Layout its contain Card View . I have tried all things but the card view is not showing up.
activity_main.xml
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:rowCount="3">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_rowWeight="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:gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
</LinearLayout>
</ScrollView>
÷ hope any one fix this problem.

Make the height of the ScrollView as wrap_content as its height is determined at runtime. and also the same for its nested LinearLayout
To make the ImageView & TextView visible use android:gravity="center_vertical" for their surrounding LinearLayout
so change your layout to be:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bgapps"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:rowCount="3">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
</LinearLayout>
</ScrollView>
Edit:
Anyone explain why its not showing my GridLayout width as match_parent
I want this :
Solution:
Changes:
Making Gridlayout width to match_parent
Adding android:layout_gravity="center" to the Gridlayout
Making the width & height of all CardViews and underlying
LinearLayouts to "wrap_content" >>>>>> This is the real cause to
the problem.
Making android:gravity="center" to the CardViews underlying
LinearLayout for symmetric purpose >> you can leave it as center_vertical if you wish.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bgapps"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="15dp">
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:padding="50dp"
android:rowCount="2">
<!-- First Row , First Column -->
<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="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<!-- First Row , Second Column-->
<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="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<!-- Second Row , First Column-->
<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="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<!-- Second Row , Second Column-->
<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="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
</LinearLayout>
</ScrollView>

you can ConstrainLayout
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
android:layout_height="match_parent">
</androidx.constraintlayout.widget.ConstraintLayout>

Thanks #Zain your answer is work well , but i have a one more mistake in GridLayout when i try to make GridLayout width as match_parent its not showing anything so i change as Layout_Width ,
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bgapps"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="15dp">
<GridLayout
android:layout_width="wrap_content" // here i want to match_parent
android:layout_height="wrap_content"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:padding="50dp"
android:rowCount="2">
<!-- First Row , First Column -->
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<!-- First Row , Second Column-->
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<!-- Second Row , First Column-->
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<!-- Second Row , Second Column-->
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:layout_margin="12dp"
app:cardCornerRadius="12dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/bookmark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Calendar"
android:textColor="#6f6f6f"
android:textSize="14dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
</LinearLayout>
</ScrollView>
Anyone explain why its not showing my GridLayout width as match_parent
I want this :

Cardview is not visible when launching on my device

I'm attempting to use a cardview to show 2 images. Everything seems to work in android studio and i can see my layouts in the design tab perfectly. However, when i run on my tablet the cardview is not showing. The layout is working for a virtual device but not for my personal device.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:background="#D3D3D3"
android:weightSum="10">
<RelativeLayout
android:layout_weight="2"
android:layout_width="match_parent"
android:layout_height="0dp">
<TextView
android:id="#+id/textGrid"
android:text="GRID LAYOUT"
android:textSize="34sp"
android:textColor="#000"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
<GridLayout
android:id="#+id/mainGrid"
android:rowCount="3"
android:columnCount="2"
android:alignmentMode="alignMargins"
android:columnOrderPreserved="false"
android:layout_weight="8"
android:layout_width="match_parent"
android:layout_height="0dp"
android:padding="14dp">
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_marginBottom="16dp"
android:layout_rowWeight="1"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:orientation="vertical">
</LinearLayout>
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/torso2green" />
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_marginBottom="16dp"
android:layout_rowWeight="1"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:orientation="vertical">
</LinearLayout>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/torso2" />
</androidx.cardview.widget.CardView>
</GridLayout>
Things i've tried:
adding the dependency: implementation 'com.android.support:cardview-v7:28.0.0'
adding: android:hardwareAccelerated="true" to the manifest file
dragging the layouts in rather than coding them
I know it seems a bit basic, but been stuck for a while and can't seem to find a fix. Any help is much appreciated.

<GridLayout
android:id="#+id/mainGrid"
android:rowCount="3"
android:columnCount="2"
android:alignmentMode="alignMargins"
android:columnOrderPreserved="false"
android:layout_weight="8"
android:layout_width="match_parent"
**android:layout_height="0dp"**
android:padding="14dp">
your layout hight is 0. I guess that's the problem.

`
<LinearLayout
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="match_parent"
android:orientation="vertical"
android:background="#D3D3D3"
android:weightSum="10">
<TextView
android:id="#+id/textGrid"
android:text="Using Linear Layout"
android:textSize="34sp"
android:textColor="#000"
android:gravity="center"
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_weight="1"
android:layout_marginLeft="14dp"
android:layout_marginRight="7dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:orientation="vertical">
</LinearLayout>
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_margin="10dp"
android:text="TextView" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_weight="1"
android:layout_marginLeft="7dp"
android:layout_marginRight="14dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:orientation="vertical">
</LinearLayout>
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="TextView" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
</androidx.cardview.widget.CardView>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="14dp"
android:orientation="horizontal">
<androidx.cardview.widget.CardView
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_weight="1"
android:layout_marginLeft="14dp"
android:layout_marginRight="7dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:orientation="vertical">
</LinearLayout>
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_margin="10dp"
android:text="TextView" />
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_weight="1"
android:layout_marginLeft="7dp"
android:layout_marginRight="14dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:orientation="vertical">
</LinearLayout>
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="TextView" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
</androidx.cardview.widget.CardView>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>`

Scroll view not working with Grid view and linear layout

I've been trying to implement a scroll view into my existing code however when i attempt to do so, the app crashes. I have tried to add a linear view first, then the scroll view but i don't think i have done this correctly. I think there is an error with the layout weights but I'm not too sure. Any help at all would be much appreciated.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="match_parent"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="none">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2">
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="59dp"
android:layout_marginStart="59dp"
android:layout_marginTop="16dp"
android:textSize="20sp"
android:textStyle="bold" />
</RelativeLayout>
<GridLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="8"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:padding="14dp"
android:rowCount="3">
<!--Row 1 -->
<!--column 1 -->
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_rowWeight="1"
app:cardCornerRadius="8dp"
app:cardElevation="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#color/colorTextHint"
android:src="#drawable/logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ME"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold"
/>
</LinearLayout>
</android.support.v7.widget.CardView>
<!--Row 1 -->
<!--column 2 -->
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_rowWeight="1"
app:cardCornerRadius="8dp"
app:cardElevation="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="#drawable/logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ME"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold"
/>
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
</ScrollView>
</LinearLayout>

Your ScrollView contains several children objects, but it can only contain one children object. However, these children's objects may in turn receive children's objects.
Hope that helps you and I have made no mistake now.
edit:
<?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="match_parent"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="59dp"
android:layout_marginStart="59dp"
android:layout_marginTop="16dp"
android:text="23452345345edfsdf"
android:textSize="20sp"
android:textStyle="bold" />
</RelativeLayout>
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:padding="14dp"
android:rowCount="3">
<!--Row 1 -->
<!--column 1 -->
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_columnWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_rowWeight="1"
app:cardCornerRadius="8dp"
app:cardElevation="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="#mipmap/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ME"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView>
<!--Row 1 -->
<!--column 2 -->
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_columnWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_rowWeight="1"
app:cardCornerRadius="8dp"
app:cardElevation="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="#mipmap/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ME"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
</LinearLayout>
</ScrollView>

Cardview is ok in preview but does not appear on mobile

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:weightSum="10"
tools:context="com.example.taksi.cardview.MainActivity">
<RelativeLayout
android:layout_weight="2"
android:layout_width="match_parent"
android:layout_height="0dp">
<TextView
android:id="#+id/textGrid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:layout_centerInParent="true"
android:text="GRID LAYOUT"
android:textSize="34sp" />
</RelativeLayout>
<GridLayout
android:columnCount="2"
android:rowCount="3"
android:layout_weight="8"
android:columnOrderPreserved="false"
android:alignmentMode="alignMargins"
android:padding="14dp"
android:layout_width="match_parent"
android:layout_height="0dp">
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp"
>
<LinearLayout
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:src="#drawable/me_time"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="Me"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp"
>
<LinearLayout
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:src="#drawable/family_time"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="Family"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp"
>
<LinearLayout
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:src="#drawable/lovely_time"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="Lovely"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:cardElevation="8dp"
app:cardCornerRadius="8dp"
>
<LinearLayout
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:src="#drawable/team_time"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="Team"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
</GridLayout>
</LinearLayout>
In the preview it is like:
But when it runs on mobile it is like:
When I run it my mobile, it's look like the second picture. But I want to get the same output like the preview window. But it doesn't appear on my mobile. I make some changes ,but nothing is changed. The output remains same as before. What can do now? Please Help. Thanks in advance.

You can try this.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical"
android:weightSum="1"
android:padding="10dp"
android:background="#fcfcfc"
android:gravity="center"
android:id="#+id/ll">
<LinearLayout
android:clipToPadding="false"
android:gravity="center"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
android:foreground="?android:attr/selectableItemBackground"
android:clickable="true"
android:id="#+id/bankcardId"
android:layout_width="130dp"
android:layout_height="150dp"
android:layout_margin="10dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:layout_width="64dp"
android:layout_height="64dp"
android:src="#drawable/your_image"
android:padding="10dp"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/lightgray"
android:layout_margin="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="12sp"
android:text="Me"
android:padding="2dp"
android:textColor="#android:color/darker_gray"/>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:foreground="?android:attr/selectableItemBackground"
android:clickable="true"
android:layout_width="130dp"
android:layout_height="150dp"
android:layout_margin="10dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:layout_width="64dp"
android:layout_height="64dp"
android:src="#drawable/your_image"
android:padding="10dp"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/lightgray"
android:layout_margin="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="12sp"
android:text="Family"
android:padding="2dp"
android:textColor="#android:color/darker_gray"/>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>

try to remove grid layout and use Linear layout than place your cardviews