Android Customize list using RecyclerView

Hello guys Today we will Discuss about Recycler view which is a second option As a list view But now a days Everyone Prefer Recycler view as compared to BaseAdapter because of Reuses cells while scrolling up/down - this is possible with implementing View Holder in the listView adapter, but it was an optional thing, while in the RecycleView it's the default way of writing adapter. Decouples list from its container - so you can put list items easily at run time in the different containers (linearLayout, gridLayout) with setting LayoutManager. Animates common list actions - Animations are decoupled and delegated to ItemAnimator.

This is our Output

So guys Lets Start....

Create new Project

Click on Next

Name your Activity >>Finish

To start With Recycler View First you have to add this Dependency in build.gradle(Module:app)

compile 'com.android.support:recyclerview-v7:25.3.1'

the Value after v7 can vary as per your project buildToolsVersion Which you can find in build.gradle(Module:app)

This is the Project Structure

Firstly make one file if not exists name as dimen.xml in values directory and add this code in that


    30dp
    20dp
    15dp

In activity_main.xml add Recyclerview like this:-

<?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="@color/colorgray"  
   tools:context="com.targetandroid.info.recyclerview.MainActivity">  
   <android.support.v7.widget.RecyclerView  
     android:layout_height="match_parent"  
     android:layout_width="match_parent"  
     android:id="@+id/rv_recyclerview">  
   </android.support.v7.widget.RecyclerView>  
 </LinearLayout>

Make a Custom Layout to Define how the Each item of Recycler view will appear on screen make a layout file in res directory I named it As recycler_layout.xml

<?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="wrap_content"  
   android:weightSum="10"  
   android:layout_marginBottom="10dp"  
   >  
   
   <ImageView  
     android:layout_width="0dp"  
     android:layout_height="match_parent"  
     android:layout_weight="4"  
     android:padding="2dp"  
     android:src="@drawable/burger"  
     android:scaleType="centerCrop"  
     android:id="@+id/imv_recycler"  
     />  
   <LinearLayout  
     android:layout_width="0dp"  
     android:layout_height="wrap_content"  
     android:layout_weight="6"  
     android:orientation="vertical"  
     android:padding="10dp">  
   
     <TextView  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"  
       android:text="Food name"  
       android:id="@+id/tvtitle_recycler"  
       android:textStyle="bold"  
       android:textSize="@dimen/food_namesize"/>  
   
     <TextView  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"  
       android:text="rating"  
       android:id="@+id/tvinfo_recycler"  
       android:textSize="@dimen/food_ratingsize"/>  
   
     <TextView  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"  
       android:text="price"  
       android:textStyle="bold"  
       android:id="@+id/tvprice_recycler"  
       android:textSize="@dimen/food_pricesize"/>  
   </LinearLayout>  
   
 </LinearLayout>

Now after this make a Pojo (Plain Old Java Object) Class and Make some private variable with Constructor and getter and setter method in Java ,Pojo class is used to get and set the values which we want to dispaly some where Here,we are using this to get our value which we want to display in our Recyclerview So make simple class named as Products.java and add this code in that

package com.targetandroid.info.recyclerview;

/**
 * Created by Faizan on 24-04-2016.
 */
public class Products {

    private String name;
    private float rating;
    private double price;
    private int imageid;

    public Products(String name, float rating, double price, int imageid){
        this.name=name;
        this.rating=rating;
        this.price=price;
        this.imageid=imageid;
    }


    public float getRating() {
        return rating;
    }

    public void setRating(float rating) {
        this.rating = rating;
    }
    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public double getPrice() {
        return price;
    }

    public void setPrice(double price) {
        this.price = price;
    }


    public int getImageid() {
        return imageid;
    }

    public void setImageid(int imageid) {
        this.imageid = imageid;
    }

}

Now after This Make a class to implement our adapter for recycler view So make simple class named as RecyclerAdapter.java extend that with RecyclerView.Adapter after this we have to implement some Override methods like onCreateViewHolder; onBindViewHolder; getItemCount(); and we have make one class as our ViewHoder in Adapter only named that class as Myviewholder extends it withRecyclerView.ViewHolder Code for Myviewholder class will like

public static class Myviewholder extends RecyclerView.ViewHolder{
        ImageView imv_recycler;
        TextView tvtitle_recycler,tvinfo_recycler,tvprice_recycler;

        public Myviewholder(View view){
            super(view);

            imv_recycler=(ImageView)view.findViewById(R.id.imv_recycler);
            tvtitle_recycler=(TextView)view.findViewById(R.id.tvtitle_recycler);
            tvinfo_recycler=(TextView)view.findViewById(R.id.tvinfo_recycler);
            tvprice_recycler=(TextView)view.findViewById(R.id.tvprice_recycler);
        }



    }

The Full Code For RecyclerAdapter class will like

package com.targetandroid.info.recyclerview;

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

import java.util.List;

/**
 * Created by FaizanSayyed on 24-04-2016.
 */
public class RecyclerAdapter extends RecyclerView.Adapter {


    List plist;

    public RecyclerAdapter(List plist){
        this.plist=plist;

    }


    @Override
    public Myviewholder onCreateViewHolder(ViewGroup parent, int viewType) {
        LayoutInflater inflater= LayoutInflater.from(parent.getContext());
        View view= inflater.inflate(R.layout.recycler_layout,parent,false);
        Myviewholder myviewholder= new Myviewholder(view);

        return myviewholder;
    }

    @Override
    public void onBindViewHolder(RecyclerAdapter.Myviewholder holder, int position) {
        Products products=plist.get(position);
        holder.imv_recycler.setImageResource(products.getImageid());
        holder.tvtitle_recycler.setText(products.getName());
        holder.tvinfo_recycler.setText(String.valueOf(products.getRating()));
        holder.tvprice_recycler.setText(String.valueOf(products.getPrice()));

    }

    @Override
    public int getItemCount() {
        return plist==null?0:plist.size();
    }


    public static class Myviewholder extends RecyclerView.ViewHolder{
        ImageView imv_recycler;
        TextView tvtitle_recycler,tvinfo_recycler,tvprice_recycler;

        public Myviewholder(View view){
            super(view);

            imv_recycler=(ImageView)view.findViewById(R.id.imv_recycler);
            tvtitle_recycler=(TextView)view.findViewById(R.id.tvtitle_recycler);
            tvinfo_recycler=(TextView)view.findViewById(R.id.tvinfo_recycler);
            tvprice_recycler=(TextView)view.findViewById(R.id.tvprice_recycler);
        }



    }
}

In (Myviewholder onCreateViewHolder)

Myviewholder onCreateViewHolder(ViewGroup parent, int viewType)

we are Inflating our customize layout on Recycler View (And In (onBindViewHolder

onBindViewHolder(RecyclerAdapter.Myviewholder holder, int position)

We are Setting the values to Every item to our list view Now Finally come to MainActivity.java in main activity we are setting the value in POJO and getting it in our RecyclerAdapter to set value in Recyclerview here is the full code of MainActivity.java

package com.targetandroid.info.recyclerview;

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

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {


    RecyclerView rv_recyclerview;
    List plist;

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

        //Pointing our variable to its ID
        rv_recyclerview=(RecyclerView)findViewById(R.id.rv_recyclerview);

        //Initializing Our List
        plist=new ArrayList<>();


        //code is to set the value in recycler view
       //we are sending value as per our Constructor on POJO class

        plist.add(new Products("Pizza",4.5f,20000,R.drawable.pizza));
        plist.add(new Products("Burger",4.8f,3000,R.drawable.burger));
        plist.add(new Products("Sandwich", 3.6f, 15000, R.drawable.sandwich));
        plist.add(new Products("Pasta", 2.4f, 25000, R.drawable.pasta));
        plist.add(new Products("Soup", 4.0f, 25000, R.drawable.soup));
        plist.add(new Products("French Fries", 3.2f, 25000, R.drawable.frenchfries));
        plist.add(new Products("Noodles", 4.5f, 25000, R.drawable.noodles));


        RecyclerAdapter recycleadapter=new RecyclerAdapter(plist);//send the plist into adapter
        rv_recyclerview.setAdapter(recycleadapter);// set the adapter into recyclerview

       //Setting the Layout manager to our recycler view
        
       // their are two types of setting layout manager to recyclerview GridLayoutManager,LinearLayoutManager


        LinearLayoutManager layoutmanage= new LinearLayoutManager(this,LinearLayoutManager.VERTICAL,false);
        // GridLayoutManager layoutmanage=new GridLayoutManager(this,3);
        rv_recyclerview.setLayoutManager(layoutmanage);


    }
}

now its done you can Run the Project and Can see the Output Output we be like