home top ad

How To Use GridLayout and CardView in Android Studio

Hello friends today will be learn about how to use GridLayout and cardView in android.Some time we are use gridlayout in fragment or activity.We use gridlayout to show the file in order or to go to any fragment or activity by clicking on cardView or for anything else.Let's see how to implement it in your project.
First we will create a project in android studio.As soon as we create the project, we will see the activity_main and MainActivity.java files.

activity_main

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:background="#0589B5"
    android:orientation="vertical"
    android:weightSum="10"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name"
        android:textSize="30sp"
         android:layout_gravity="center_horizontal"
        android:layout_marginTop="90dp" />

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:padding="20dp"
        android:columnCount="2"
        android:rowCount="3"
        android:alignmentMode="alignMargins"
        android:layout_weight="8">

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_margin="16dp"
            android:layout_rowWeight="1"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:layout_margin="16dp"
                android:layout_gravity="center_horizontal|center_vertical">


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/ic_shopping"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Shopping"
                    android:textColor="@color/black"
                    android:textAlignment="center"/>



            </LinearLayout>



        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_margin="16dp"
            android:layout_rowWeight="1"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:layout_margin="16dp"
                android:layout_gravity="center_horizontal|center_vertical">


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/ic_camera"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Camera"
                    android:textColor="@color/black"
                    android:textAlignment="center"/>



            </LinearLayout>



        </androidx.cardview.widget.CardView>


        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_margin="16dp"
            android:layout_rowWeight="1"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:layout_margin="16dp"
                android:layout_gravity="center_horizontal|center_vertical">


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/ic_family"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Family"
                    android:textColor="@color/black"
                    android:textAlignment="center"/>



            </LinearLayout>



        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_margin="16dp"
            android:layout_rowWeight="1"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:layout_margin="16dp"
                android:layout_gravity="center_horizontal|center_vertical">


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/ic_moter"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Motercycle"
                    android:textColor="@color/black"
                    android:textAlignment="center"/>



            </LinearLayout>



        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_margin="16dp"
            android:layout_rowWeight="1"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:layout_margin="16dp"
                android:layout_gravity="center_horizontal|center_vertical">


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/ic_setting"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Setting"
                    android:textColor="@color/black"
                    android:textAlignment="center"/>



            </LinearLayout>



        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_columnWeight="1"
            android:layout_margin="16dp"
            android:layout_rowWeight="1"
            app:cardElevation="8dp"
            app:cardCornerRadius="8dp">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:layout_margin="16dp"
                android:layout_gravity="center_horizontal|center_vertical">


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/ic_shopping"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Shop Now"
                    android:textColor="@color/black"
                    android:textAlignment="center"/>


            </LinearLayout>


        </androidx.cardview.widget.CardView>


    </GridLayout>


</LinearLayout>
In this layout we have used a GridLayout, inside which we have used CardView, inside which we have used LinearLayout and inside it also we have used an ImageView and TextView.

If you also want to use cardView using only layout then you can do it like this.

Thanks you

Post a Comment

0 Comments