RecyclerView with CardView in android example?

RecyclerView:

    RecyclerView is more advanced and flexible alternative for ListView. In ListView custom adapter every time it will create new object for UI binding. where as coming to RecyclerView it won't create multiple times. View will created only once.

   In order to implement RecyclerView, first of all we need to decide the Layout Manager for RecyclerView.

LayoutManager type:
1) LinearLayoutManager               :  It shows the items in vertical or horizontal scrolling list.
2) GridLayoutManager                  :  Shows items in a grid.
3) StaggeredGridLayoutManager  :  Shows items in a staggered grid.


CardView
       CardView is used to show the information inside a card which is consistent. By using this we can apply shadow effect, rounded corner etc. To show shadow effect there is a property called card_view:cardElevetion attribute. in order to show rounded corners card_view:cardCornerRadius property.

Example Sample project to display names & initials names of friends.

Step 1: For Accessing RecyclerView & CardView, First we need to import few libraries in build.gradle file of app.

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

So build.gradle file of app level looks like this.

apply plugin: 'com.android.application'
android {
    compileSdkVersion 23    buildToolsVersion "24.0.1"
    defaultConfig {
        applicationId "com.example.srikanthp.rctest"       

        minSdkVersion 15        

        targetSdkVersion 23        

        versionCode 1        

        versionName "1.0"    

    }
    buildTypes {
        release 

         {
            minifyEnabled false            

            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'

        }
    }
}

dependencies {
    compile fileTree(include: ['*.jar'], dir: 'libs')
    testCompile 'junit:junit:4.12'    

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

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

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

}

Steps 2: Create a xml file in layout folder with the name of activity_main.xml and paste the below code.

<?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.example.srikanthp.rctest.MainActivity">

        <android.support.v7.widget.RecyclerView        

             android:layout_width="match_parent"       

             android:layout_height="match_parent"     

             android:id="@+id/recyclerView"       

             android:scrollbars="vertical">

      </android.support.v7.widget.RecyclerView>

</RelativeLayout>

Step 3: Now create a class with the name of MainActivity.java and paste the below code.

package com.example.srikanthp.rctest;
import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;

import java.util.ArrayList;

public class MainActivity extends Activity
{
    ArrayList<String> first_names,initials_names;
    RecyclerView recyclerView;
    RecyclerView.Adapter adapter;
    RecyclerView.LayoutManager lManager;

    @Override    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        getData();

        recyclerView=(RecyclerView)findViewById(R.id.recyclerView);
        lManager=new LinearLayoutManager(this);

        recyclerView.setLayoutManager(lManager);
        adapter=new MyAdapter(first_names,initials_names);

        recyclerView.setAdapter(adapter);
    }



    public void getData()
    {
        first_names=new ArrayList<String>();
        first_names.clear();
        first_names.add("SrikanthP");
        first_names.add("Mahesh");
        first_names.add("Naveen");
        first_names.add("Srinivas");
        first_names.add("Pawan");
        first_names.add("SrikanthK");
        first_names.add("Ramakanth");
        first_names.add("Sathish");
        first_names.add("Sridhar");
        first_names.add("Vishwanath");

        initials_names=new ArrayList<String>();
        initials_names.clear();
        initials_names.add("Patel");
        initials_names.add("Thippal");
        initials_names.add("Veerabattini");
        initials_names.add("Vanka");
        initials_names.add("Motkuri");
        initials_names.add("Kadari");
        initials_names.add("Kota");
        initials_names.add("Gangishetty");
        initials_names.add("Metraskar");
        initials_names.add("Kota");
    }

}

Note : for creating adapter class we need to create mydapter.xml(in layout folder) & MyAdapter.java(in java folder) .

Step 4: Now create myadaper.xml file in layout folder and paste the below code.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"   
    android:orientation="horizontal"
    android:layout_width="match_parent"  
    android:layout_height="match_parent"   
    android:layout_margin="10dp"   
    xmlns:app="http://schemas.android.com/apk/res-auto">

        <android.support.v7.widget.CardView            
          android:layout_width="match_parent"          
          android:layout_height="match_parent"          
          app:cardCornerRadius="10dp"   
          android:elevation="10dp">

           <LinearLayout      
               android:layout_width="match_parent"   
               android:layout_height="match_parent"
               android:orientation="horizontal">

                  <TextView 
                    android:id="@+id/tvNames"
                    android:layout_width="0dp"
                    android:layout_weight="0.6"
                    android:layout_height="wrap_content"
                    android:text="Names.."
                    android:textSize="30sp"
                    android:textStyle="bold"/>

                <TextView 
                    android:id="@+id/tvInitials"
                    android:layout_width="0dp"
                    android:layout_weight="0.6"
                    android:layout_height="wrap_content"
                    android:text="Initial names.."
                    android:textSize="30sp"
                    android:textStyle="bold"/>

            </LinearLayout>

        </android.support.v7.widget.CardView>

</LinearLayout>

Step 5: Create a class with the name of MyAdapter.java and paste below code.

package com.example.srikanthp.rctest;

import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import java.lang.reflect.Array;
import java.util.ArrayList;

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder>
{

    ArrayList<String> names,initials;


    public MyAdapter(ArrayList<String> nm,ArrayList<String> nt)
    {
        this.names=nm;
        this.initials=nt;
    }

    public static class ViewHolder extends  RecyclerView.ViewHolder
    {
        TextView tvNames,tvInitials;

        public ViewHolder(View v)
        {
            super(v);
            tvNames=(TextView)v.findViewById(R.id.tvNames);
            tvInitials=(TextView)v.findViewById(R.id.tvInitials);
        }
    }

    @Override    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

        View v= LayoutInflater.from(parent.getContext()).inflate(R.layout.myadapter,parent,false);

        ViewHolder hold=new ViewHolder(v);

        return hold;
    }

    @Override    public void onBindViewHolder(ViewHolder holder, int position) {
        holder.tvNames.setText(names.get(position));
        holder.tvInitials.setText(initials.get(position));
    }

    @Override    public int getItemCount() {
        return names.size();
    }

}