Sunday, December 4, 2016

Android RecyclerView Tutorial

1. What is RecyclerView?

              RecyclerView widget is the more advanced version of ListView. Android released this widget in API Level 21. It is used to display a large amount of data as list item and the list items are recycled when they are out of screen. It is same as ListView but it has a lot of features than the ListView. RecyclerView can handle a lot of datas without lagging when scrolling the List Items. So that's why RecyclerView comes into the picture...

              Below gmail app of android is the good example for RecyclerView but it's customized one.


 2. Adding Support Library

              You have to add the following support library in order to use RecyclerView class because the Android doesn't have RecyclerView widget by default.

     1. Open your build.gradle(module : app) file
     2. Then add below code inside the dependencies block

dependencies {
    
    compile 'com.android.support:appcompat-v7:24.2.1'
    compile 'com.android.support:recyclerview-v7:24.0.+'
   
}



Now you can use RecyclerView class in your project


3. ViewHolder in RecyclerView 

         When the list items are goes out off the screen, then the list items are placed for Recycling. In ListView we've to create ViewHolder manually to improve the performance of ListView. But now its obligatory to implement this ViewHolder class in RecyclerView. It is included in the RecyclerView's Adapter class. ViewHolder keeps your views references to the views in list item. So there's no need to create findViewById every time. By this way, the RecyclerView list items are scrolled very smoothly without lagging. That's why ViewHolder comes into the picture..

4. RecyclerView Layouts

              RecyclerView has three different layout managers. They are
  1.  LinearLayout - It can be used to display lists in vertical or horizontal in RecyclerView
  2.  GridLayoutManager - This is used to display grids in RecyclerView
  3.  StaggeredGridLayoutManager - It is used to display staggered grids in RecyclerView
For this tutorial, I'm gonna use LinearLayoutManager. Let's get started to coding..


MainActivity.java 

package in.coderearth.recyclerviewnewnew;

/**
 * Created by vinothvino on 03/12/16.
 */

import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.LinearLayoutManager;

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;
    private RecyclerView.Adapter adapter;
    private Context context;
    private RecyclerView.LayoutManager layoutManager;
    String[] datas = {

            "Android Developer",
            "iOS Developer",
            "Python Developer",
            "UI Designer",
            "Android Studio",
            "Xcode",
            "Java programming language",
            "Swit programming language",
            "Stack Overflow",
            "GitHub",
            "Gitter",
            "Slack",
            "Genymotion Emulator",
            "Sketch Mac app",
            "Safari",
            "MacBook Air",
            "MacBook Pro",
            "Mac",
            "iMac",
            "iPhone",
            "iPad",
            "iPod",
            "Google Pixel",
            "Google nexus",
            "Sublime text editor",
            "Mac OS",
            "Windows OS",
            "Ubuntu OS",
            "Eclipse IDE",
            "Photoshop",
            "iOS SDK",
            "Android SDK",
            "Google Chrome",
            "Firefox",
            "Gmail",
            "iCloud",
            "Google Drive",
            "Dropbox"

    };

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

        recyclerView = (RecyclerView)findViewById(R.id.recyclerviewid);

        context = getApplicationContext();

        layoutManager = new LinearLayoutManager(context);

        recyclerView.setLayoutManager(layoutManager);

        adapter = new RecyclerViewAdapter(context,datas);

        recyclerView.setAdapter(adapter);

        recyclerView.setHasFixedSize(true);  //Improves the performance


    }
}



RecyclerViewAdapter.java 

package in.coderearth.recyclerviewnewnew;

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

/**
 * Created by vinothvino on 03/12/16.
 */

public class RecyclerViewAdapter extends RecyclerView.Adapter{

    String[] data;
    Context context;
    View view;
    ViewHolder viewHolder;

    public RecyclerViewAdapter(Context contextn, String[] datan){

        data = datan;
        context = contextn;
    }

    public static class ViewHolder extends RecyclerView.ViewHolder{

        public TextView textView;

        public ViewHolder(View v){

            super(v);

            textView = (TextView)v.findViewById(R.id.datas_textview);
        }
    }



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

        view = LayoutInflater.from(context).inflate(R.layout.row_list,parent,false);

        viewHolder = new ViewHolder(view);

        return viewHolder;
    }

    @Override
    public void onBindViewHolder(RecyclerViewAdapter.ViewHolder holder, int position) {

        holder.textView.setText(data[position]);

    }

    @Override
    public int getItemCount() {

        return data.length;
    }
}





OUTPUT : 




Happy Coding!!


NOTE :  It is necessary to change the list items root layout attribute layout_height = "match_parent" to layout_height = "wrap_content" when using RecyclerView support library 23 and above

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

Otherwise your list items are bigger in size(It'll happen after app launched or it'll occurs after scrolling down).Pay attention to below image...





   


Location:India, Tamil Nadu, Tuticorin Thoothukudi, Tamil Nadu, India