0

Android CardView example tutorial using Android Studio Step by Step

How use CardView with TextView inside it in android application to create beautiful views.

CardView is a type of separate frame layout and rounded corners background and shadow. With the use of CardView android developer can easily create custom views with automatically added background. So here is the complete step by step tutorial for Android CardView example tutorial using Android Studio Step by Step.

android-project-download-code-button

Note: Read below steps very carefully to add CardView library inside your current project.

1. Open your project’s build.gradle ( Module : app ) file.

build-gradle

2. Please add below code inside your build.gradle ( Module : app ) file.

compile 'com.android.support:appcompat-v7:23.4.0'
compile 'com.android.support:cardview-v7:23.0.+'
compile 'com.android.support:recyclerview-v7:23.0.+'

3. Screenshot of build.gradle ( Module : app ) file after adding above code.

Add Import CardView RecyclerView support library in Android Studio

Here your go now CardView library is successfully imported inside your project now its time to start coding.

Android CardView example tutorial using Android Studio Step by Step.

Code for MainActivity.java file.

package com.android_examples.cardview_android_examplescom;

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);
    }
}

Code for activity_main.xml layout file.

 <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.android_examples.cardview_android_examplescom.MainActivity">

    <android.support.v7.widget.CardView
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        android:id="@+id/card_view1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        card_view:cardCornerRadius="6dp"
        card_view:cardElevation="6dp"
        card_view:contentPadding="25dp"
        card_view:cardBackgroundColor="#2196F3"

        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:gravity="center"
            android:text="SIMPLE \n CARDVIEW"
            android:textSize="30sp"
            android:textStyle="bold"
            android:textColor="#E3F2FD"
            />
    </android.support.v7.widget.CardView>

</RelativeLayout>

Screenshot:

Android CardView example tutorial using Android Studio Step by Step

Click here to download Android CardView example tutorial using Android Studio Step by Step project with source code.

Leave a Reply

Your email address will not be published. Required fields are marked *