Wednesday, July 8, 2015

Simple RecyclerView example

It's a simple example of using RecyclerView to display a List in vertical and horizontal.



To use RecyclerView in your Android Studio project, you have to Add Support Libraries of RecyclerView as dependencies.

Create our custom Adapter and ViewHolder for RecyclerView, com.example.androidrecyclerview.RecyclerViewAdapter.java
package com.example.androidrecyclerview;

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;

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

public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ItemHolder> {

    private List<String> itemsName;
    private OnItemClickListener onItemClickListener;
    private LayoutInflater layoutInflater;

    public RecyclerViewAdapter(Context context){
        layoutInflater = LayoutInflater.from(context);
        itemsName = new ArrayList<String>();
    }

    @Override
    public RecyclerViewAdapter.ItemHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View itemView = layoutInflater.inflate(R.layout.layout_item, parent, false);
        return new ItemHolder(itemView, this);
    }

    @Override
    public void onBindViewHolder(RecyclerViewAdapter.ItemHolder holder, int position) {
        holder.setItemName(itemsName.get(position));
    }

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

    public void setOnItemClickListener(OnItemClickListener listener){
        onItemClickListener = listener;
    }

    public OnItemClickListener getOnItemClickListener(){
        return onItemClickListener;
    }

    public interface OnItemClickListener{
        public void onItemClick(ItemHolder item, int position);
    }

    public void add(int location, String iName){
        itemsName.add(location, iName);
        notifyItemInserted(location);
    }

    public void remove(int location){
        if(location >= itemsName.size())
            return;

        itemsName.remove(location);
        notifyItemRemoved(location);
    }

    public static class ItemHolder extends RecyclerView.ViewHolder implements View.OnClickListener{

        private RecyclerViewAdapter parent;
        TextView textItemName;

        public ItemHolder(View itemView, RecyclerViewAdapter parent) {
            super(itemView);
            itemView.setOnClickListener(this);
            this.parent = parent;
            textItemName = (TextView) itemView.findViewById(R.id.item_name);
        }

        public void setItemName(CharSequence name){
            textItemName.setText(name);
        }

        public CharSequence getItemName(){
            return textItemName.getText();
        }

        @Override
        public void onClick(View v) {
            final OnItemClickListener listener = parent.getOnItemClickListener();
            if(listener != null){
                listener.onItemClick(this, getPosition());
            }
        }
    }
}


And the layout for each cell in the RecyclerView, layout/layout_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/item_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="40dp"/>

</LinearLayout>


com.example.androidrecyclerview.MainActivity.java
package com.example.androidrecyclerview;

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

public class MainActivity extends ActionBarActivity implements RecyclerViewAdapter.OnItemClickListener{

    private RecyclerView myRecyclerView;
    private LinearLayoutManager linearLayoutManager;
    private RecyclerViewAdapter myRecyclerViewAdapter;

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

        myRecyclerView = new RecyclerView(this);

        linearLayoutManager =
                new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);
        /*
        linearLayoutManager =
                new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);
        */

        myRecyclerViewAdapter = new RecyclerViewAdapter(this);
        myRecyclerViewAdapter.setOnItemClickListener(this);
        myRecyclerView.setAdapter(myRecyclerViewAdapter);
        myRecyclerView.setLayoutManager(linearLayoutManager);

        setContentView(myRecyclerView);

        //insert dummy items
        myRecyclerViewAdapter.add(0, "Eric");
        myRecyclerViewAdapter.add(1, "Android");
        myRecyclerViewAdapter.add(0, "Android-er");
        myRecyclerViewAdapter.add(2, "Google");
        myRecyclerViewAdapter.add(3, "android dev");
        myRecyclerViewAdapter.add(0, "android-er.blogspot.com");
        myRecyclerViewAdapter.add(4, "Peter");
        myRecyclerViewAdapter.add(4, "Paul");
        myRecyclerViewAdapter.add(4, "Mary");
        myRecyclerViewAdapter.add(4, "May");
        myRecyclerViewAdapter.add(4, "Divid");
        myRecyclerViewAdapter.add(4, "Frankie");
    }

    @Override
    public void onItemClick(RecyclerViewAdapter.ItemHolder item, int position) {
        Toast.makeText(this,
                position + " : " + item.getItemName(),
                Toast.LENGTH_SHORT).show();
    }
}


download filesDownload the files (Android Studio Format).


Android RecyclerView examples (step-by-step):


Add Support Libraries of RecyclerView, CardView to Android Studio Project
- Simple RecyclerView example (this post)
Place RecyclerView in layout XML
Add and remove items to RecyclerView, with default animation
Implement custom ItemDecoration for RecyclerView
LinearLayoutManager and GridLayoutManager for RecyclerView
set SpanSizeLookup to GridLayoutManager of RecyclerView
onDraw() and onDrawOver() of ItemDecoration for RecyclerView
- Example using RecyclerView with CardView
StaggeredGridLayoutManager (Google+ App-like) on RecyclerView
RecyclerView + CardView example with ImageView - list available Drawable
RecyclerView + CardView example - list system properties using System.getProperties()
Intent.ACTION_OPEN_DOCUMENT to load images in RecyclerView + CardView
Gallery-like RecyclerView + CardView example
RecyclerView + CardView example: with Button
SwipeRefreshLayout, work with RecyclerView

2 comments:

Anonymous said...

thank you for example.. You are wnderful. :)

Eric De Wildt said...

Thanks for the example I was able to use it make my RecyclerView dynamic and function as intended.