RecyclerView with multiple View Type | RecyclerView with different view types | View Pager inside RecyclerView

Hello Friends,
              Today I am going to share my another android tutorial, with the help
of this we can easily create a Recyclerview with multiple different types
of view .
Also this tutorial helps you to create a View pager inside RecyclerView,

1. MainActivity.java :

view plainprint?

1. package com.developer.solutions.recyclerviewwithmultipleviewtype.activity;  
2.   
3. import android.app.Activity;  
4. import android.content.Intent;  
5. import android.os.Binder;  
6. import android.os.Bundle;  
7. import android.support.v7.app.AppCompatActivity;  
8. import android.support.v7.widget.DefaultItemAnimator;  
9. import android.support.v7.widget.LinearLayoutCompat;  
10. import android.support.v7.widget.LinearLayoutManager;  
11. import android.support.v7.widget.OrientationHelper;  
12. import android.support.v7.widget.RecyclerView;  
13. import android.support.v7.widget.Toolbar;  
14. import android.widget.TextView;  
15.   
16. import com.developer.solutions.recyclerviewwithmultipleviewtype.R;  
17. import com.developer.solutions.recyclerviewwithmultipleviewtype.adapter.MultiViewTypeAdapter;  
18. import com.developer.solutions.recyclerviewwithmultipleviewtype.model.Data;  
19.   
20. import java.util.ArrayList;  
21.   
22. import butterknife.BindView;  
23. import butterknife.ButterKnife;  
24. import butterknife.Unbinder;  
25.   
26. /** 
27.  * Created by Mukesh on 3/8/17. 
28.  * himky02@gmail.com 
29.  */  
30. public class MainActivity extends AppCompatActivity {  
31.   
32.     Activity mActivity;  
33.     @BindView(R.id.toolbar)  
34.     Toolbar toolbar;  
35.     @BindView(R.id.rv)  
36.     RecyclerView mRecyclerView;  
37.     Unbinder mUnbinder;  
38.   
39.   
40.     @Override  
41.     protected void onCreate(Bundle savedInstanceState) {  
42.         super.onCreate(savedInstanceState);  
43.         setContentView(R.layout.activity_main);  
44.         //((TextView) findViewById(R.id.tv)).setText("Welcome user");  
45.         mUnbinder = ButterKnife.bind(this);  
46.   
47.         ArrayList<data> list = new ArrayList<>();  
48.         list.add(new Data(Data.VIEW_PAGER, "Hello. This is the View Pager view type with images", 0));  
49.         list.add(new Data(Data.IMAGE_TYPE, "A view type with Image and Textview", R.drawable.disneys_cinderella));  
50.         list.add(new Data(Data.AUDIO_TYPE, "Hey, A view type with Button and Textview", 0));  
51.         list.add(new Data(Data.IMAGE_TYPE, "Hi again. A view with Image and Textview", R.drawable.snow));  
52.   
53.         MultiViewTypeAdapter adapter = new MultiViewTypeAdapter(list, this);  
54.         final LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);  
55.         linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);  
56.         mRecyclerView.setLayoutManager(linearLayoutManager);  
57.         mRecyclerView.setItemAnimator(new DefaultItemAnimator());  
58.         mRecyclerView.setAdapter(adapter);  
59.     }  
60.   
61.     @Override  
62.     protected void onDestroy() {  
63.         super.onDestroy();  
64.          if (mUnbinder != null) mUnbinder.unbind();  
65.     }  
66. }  
67. </data>  

package com.developer.solutions.recyclerviewwithmultipleviewtype.activity;

import android.app.Activity;
import android.content.Intent;
import android.os.Binder;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.DefaultItemAnimator;
import android.support.v7.widget.LinearLayoutCompat;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.OrientationHelper;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.widget.TextView;

import com.developer.solutions.recyclerviewwithmultipleviewtype.R;
import com.developer.solutions.recyclerviewwithmultipleviewtype.adapter.MultiViewTypeAdapter;
import com.developer.solutions.recyclerviewwithmultipleviewtype.model.Data;

import java.util.ArrayList;

import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.Unbinder;

/**
 * Created by Mukesh on 3/8/17.
 * himky02@gmail.com
 */
public class MainActivity extends AppCompatActivity {

    Activity mActivity;
    @BindView(R.id.toolbar)
    Toolbar toolbar;
    @BindView(R.id.rv)
    RecyclerView mRecyclerView;
    Unbinder mUnbinder;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //((TextView) findViewById(R.id.tv)).setText("Welcome user");
        mUnbinder = ButterKnife.bind(this);

        ArrayList list = new ArrayList<>();
        list.add(new Data(Data.VIEW_PAGER, "Hello. This is the View Pager view type with images", 0));
        list.add(new Data(Data.IMAGE_TYPE, "A view type with Image and Textview", R.drawable.disneys_cinderella));
        list.add(new Data(Data.AUDIO_TYPE, "Hey, A view type with Button and Textview", 0));
        list.add(new Data(Data.IMAGE_TYPE, "Hi again. A view with Image and Textview", R.drawable.snow));

        MultiViewTypeAdapter adapter = new MultiViewTypeAdapter(list, this);
        final LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
        linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);
        mRecyclerView.setLayoutManager(linearLayoutManager);
        mRecyclerView.setItemAnimator(new DefaultItemAnimator());
        mRecyclerView.setAdapter(adapter);
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
         if (mUnbinder != null) mUnbinder.unbind();
    }
}

2.MultiViewTypeAdapter.java

view plainprint?

1. package com.developer.solutions.recyclerviewwithmultipleviewtype.adapter;  
2.   
3. import android.app.Activity;  
4. import android.content.Context;  
5. import android.graphics.Color;  
6. import android.os.Handler;  
7. import android.support.v4.view.ViewPager;  
8. import android.support.v7.widget.RecyclerView;  
9. import android.text.Html;  
10. import android.view.LayoutInflater;  
11. import android.view.View;  
12. import android.view.ViewGroup;  
13. import android.widget.Button;  
14. import android.widget.ImageView;  
15. import android.widget.LinearLayout;  
16. import android.widget.TextView;  
17. import android.widget.Toast;  
18.   
19. import com.developer.solutions.recyclerviewwithmultipleviewtype.R;  
20. import com.developer.solutions.recyclerviewwithmultipleviewtype.model.Data;  
21.   
22. import java.util.ArrayList;  
23.   
24. import butterknife.BindView;  
25. import butterknife.ButterKnife;  
26.   
27. /** 
28.  * Created by Mukesh on 3/8/17. 
29.  * himky02@gmail.com 
30.  */  
31. public class MultiViewTypeAdapter extends RecyclerView.Adapter<recyclerview .viewholder=""> {  
32.     private ArrayList<data> dataSet;  
33.     Context mContext;  
34.     int total_types;  
35.     ArrayList<string> slider_image_list;  
36.     int page = 0;  
37.   
38.     public static class TextTypeViewHolder extends RecyclerView.ViewHolder {  
39.         @BindView(R.id.ll_dots)  
40.         LinearLayout ll_dots;  
41.         @BindView(R.id.vp_slider)  
42.         ViewPager mvViewPager;  
43.   
44.         public TextTypeViewHolder(View itemView) {  
45.             super(itemView);  
46.             ButterKnife.bind(this, itemView);  
47.         }  
48.     }  
49.   
50.     public static class ImageTypeViewHolder extends RecyclerView.ViewHolder {  
51.         @BindView(R.id.type)  
52.         TextView tvtype;  
53.         @BindView(R.id.img)  
54.         ImageView iv;  
55.   
56.         public ImageTypeViewHolder(View itemView) {  
57.             super(itemView);  
58.             ButterKnife.bind(this, itemView);  
59.         }  
60.     }  
61.   
62.     public static class ButtonTypeViewHolder extends RecyclerView.ViewHolder {  
63.         @BindView(R.id.type)  
64.         TextView type;  
65.         @BindView(R.id.btn)  
66.         Button btn;  
67.   
68.         public ButtonTypeViewHolder(View itemView) {  
69.             super(itemView);  
70.             ButterKnife.bind(this, itemView);  
71.         }  
72.     }  
73.   
74.     public MultiViewTypeAdapter(ArrayList<data> data, Context context) {  
75.         this.dataSet = data;  
76.         this.mContext = context;  
77.         total_types = dataSet.size();  
78.     }  
79.   
80.     @Override  
81.     public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {  
82.   
83.         View view;  
84.         switch (viewType) {  
85.             case Data.VIEW_PAGER:  
86.                 view = LayoutInflater.from(parent.getContext()).inflate(R.layout.viewpager, parent, false);  
87.                 return new TextTypeViewHolder(view);  
88.             case Data.IMAGE_TYPE:  
89.                 view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_image_type, parent, false);  
90.                 return new ImageTypeViewHolder(view);  
91.             case Data.AUDIO_TYPE:  
92.                 view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_button_type, parent, false);  
93.                 return new ButtonTypeViewHolder(view);  
94.         }  
95.         return null;  
96.   
97.   
98.     }  
99.   
100.   
101.     @Override  
102.     public int getItemViewType(int position) {  
103.   
104.         switch (dataSet.get(position).type) {  
105.             case 0:  
106.                 return Data.VIEW_PAGER;  
107.             case 1:  
108.                 return Data.IMAGE_TYPE;  
109.             case 2:  
110.                 return Data.AUDIO_TYPE;  
111.             default:  
112.                 return -1;  
113.         }  
114.     }  
115.   
116.     @Override  
117.     public void onBindViewHolder(final RecyclerView.ViewHolder holder, final int listPosition) {  
118.   
119.         Data object = dataSet.get(listPosition);  
120.         if (object != null) {  
121.             switch (object.type) {  
122.                 case Data.VIEW_PAGER:  
123.                     //((TextTypeViewHolder) holder).type.setText(object.text);  
124.                     slider_image_list = new ArrayList<>();  
125.   
126.                     //Add few items to slider_image_list ,this should contain url of images which should be displayed in slider  
127.                     // here i am adding few sample image links, you can add your own  
128.   
129.                     slider_image_list.add("http://cdn.collider.com/wp-content/uploads/avengers-movie-banner-scarlett-johansson-jeremy-renner.jpg");  
130.                     slider_image_list.add("http://www.officialterridwyer.com/wp-content/uploads/2015/04/Disneys-Cinderella-2015-Movie-Banner.jpg");  
131.                     slider_image_list.add("http://igmedia.blob.core.windows.net/igmedia/hindi/gallery/movies/raabta/main1.jpg");  
132.                     slider_image_list.add("http://fantoosy.com/wp-content/uploads/2015/11/tamasha.jpg");  
133.                     final SliderPagerAdapter sliderPagerAdapter = new SliderPagerAdapter((Activity) mContext, slider_image_list);  
134.                     ((TextTypeViewHolder) holder).mvViewPager.setAdapter(sliderPagerAdapter);  
135.   
136.                     ((TextTypeViewHolder) holder).mvViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {  
137.                         @Override  
138.                         public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {  
139.   
140.                         }  
141.   
142.                         @Override  
143.                         public void onPageSelected(int position) {  
144.                             addBottomDots(position, ((TextTypeViewHolder) holder).ll_dots);  
145.                             page = position;  
146.                         }  
147.   
148.                         @Override  
149.                         public void onPageScrollStateChanged(int state) {  
150.   
151.                         }  
152.                     });  
153.                     addBottomDots(0, ((TextTypeViewHolder) holder).ll_dots);  
154.                     final Handler h = new Handler();  
155.                     h.postDelayed(new Runnable() {  
156.                         @Override  
157.                         public void run() {  
158.                             if (sliderPagerAdapter.getCount() == page) {  
159.                                 page = 0;  
160.                             } else {  
161.                                 page++;  
162.                             }  
163.                             ((TextTypeViewHolder) holder).mvViewPager.setCurrentItem(page);  
164.                             h.postDelayed(this, 2000);  
165.                         }  
166.                     }, 1000);  
167.   
168.                     break;  
169.                 case Data.IMAGE_TYPE:  
170.                     ((ImageTypeViewHolder) holder).tvtype.setText(object.text);  
171.                     ((ImageTypeViewHolder) holder).iv.setImageResource(object.data);  
172.                     break;  
173.                 case Data.AUDIO_TYPE:  
174.                     ((ButtonTypeViewHolder) holder).type.setText(object.text);  
175.                     ((ButtonTypeViewHolder) holder).btn.setOnClickListener(new View.OnClickListener() {  
176.                         @Override  
177.                         public void onClick(View view) {  
178.                             Toast.makeText(mContext, "You clicked!!!", Toast.LENGTH_SHORT).show();  
179.                         }  
180.                     });  
181.                     break;  
182.             }  
183.         }  
184.   
185.     }  
186.   
187.     @Override  
188.     public int getItemCount() {  
189.         return dataSet.size();  
190.     }  
191.   
192.     //showing dots on screen  
193.     private void addBottomDots(int currentPage, LinearLayout ll_dots) {  
194.         TextView[] dots = new TextView[slider_image_list.size()];  
195.         ll_dots.removeAllViews();  
196.         for (int i = 0; i < dots.length; i++) {  
197.             dots[i] = new TextView(mContext);  
198.             dots[i].setText(Html.fromHtml("•"));  
199.             dots[i].setTextSize(35);  
200.             dots[i].setTextColor(Color.parseColor("#343434"));  
201.             ll_dots.addView(dots[i]);  
202.         }  
203.   
204.         if (dots.length > 0)  
205.             dots[currentPage].setTextColor(Color.parseColor("#A2A2A2"));  
206.     }  
207.   
208. }  
209. </data></string></data></recyclerview>  

package com.developer.solutions.recyclerviewwithmultipleviewtype.adapter;

import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.os.Handler;
import android.support.v4.view.ViewPager;
import android.support.v7.widget.RecyclerView;
import android.text.Html;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.Toast;

import com.developer.solutions.recyclerviewwithmultipleviewtype.R;
import com.developer.solutions.recyclerviewwithmultipleviewtype.model.Data;

import java.util.ArrayList;

import butterknife.BindView;
import butterknife.ButterKnife;

/**
 * Created by Mukesh on 3/8/17.
 * himky02@gmail.com
 */
public class MultiViewTypeAdapter extends RecyclerView.Adapter {
    private ArrayList dataSet;
    Context mContext;
    int total_types;
    ArrayList slider_image_list;
    int page = 0;

    public static class TextTypeViewHolder extends RecyclerView.ViewHolder {
        @BindView(R.id.ll_dots)
        LinearLayout ll_dots;
        @BindView(R.id.vp_slider)
        ViewPager mvViewPager;

        public TextTypeViewHolder(View itemView) {
            super(itemView);
            ButterKnife.bind(this, itemView);
        }
    }

    public static class ImageTypeViewHolder extends RecyclerView.ViewHolder {
        @BindView(R.id.type)
        TextView tvtype;
        @BindView(R.id.img)
        ImageView iv;

        public ImageTypeViewHolder(View itemView) {
            super(itemView);
            ButterKnife.bind(this, itemView);
        }
    }

    public static class ButtonTypeViewHolder extends RecyclerView.ViewHolder {
        @BindView(R.id.type)
        TextView type;
        @BindView(R.id.btn)
        Button btn;

        public ButtonTypeViewHolder(View itemView) {
            super(itemView);
            ButterKnife.bind(this, itemView);
        }
    }

    public MultiViewTypeAdapter(ArrayList data, Context context) {
        this.dataSet = data;
        this.mContext = context;
        total_types = dataSet.size();
    }

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

        View view;
        switch (viewType) {
            case Data.VIEW_PAGER:
                view = LayoutInflater.from(parent.getContext()).inflate(R.layout.viewpager, parent, false);
                return new TextTypeViewHolder(view);
            case Data.IMAGE_TYPE:
                view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_image_type, parent, false);
                return new ImageTypeViewHolder(view);
            case Data.AUDIO_TYPE:
                view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_button_type, parent, false);
                return new ButtonTypeViewHolder(view);
        }
        return null;


    }


    @Override
    public int getItemViewType(int position) {

        switch (dataSet.get(position).type) {
            case 0:
                return Data.VIEW_PAGER;
            case 1:
                return Data.IMAGE_TYPE;
            case 2:
                return Data.AUDIO_TYPE;
            default:
                return -1;
        }
    }

    @Override
    public void onBindViewHolder(final RecyclerView.ViewHolder holder, final int listPosition) {

        Data object = dataSet.get(listPosition);
        if (object != null) {
            switch (object.type) {
                case Data.VIEW_PAGER:
                    //((TextTypeViewHolder) holder).type.setText(object.text);
                    slider_image_list = new ArrayList<>();

                    //Add few items to slider_image_list ,this should contain url of images which should be displayed in slider
                    // here i am adding few sample image links, you can add your own

                    slider_image_list.add("http://cdn.collider.com/wp-content/uploads/avengers-movie-banner-scarlett-johansson-jeremy-renner.jpg");
                    slider_image_list.add("http://www.officialterridwyer.com/wp-content/uploads/2015/04/Disneys-Cinderella-2015-Movie-Banner.jpg");
                    slider_image_list.add("http://igmedia.blob.core.windows.net/igmedia/hindi/gallery/movies/raabta/main1.jpg");
                    slider_image_list.add("http://fantoosy.com/wp-content/uploads/2015/11/tamasha.jpg");
                    final SliderPagerAdapter sliderPagerAdapter = new SliderPagerAdapter((Activity) mContext, slider_image_list);
                    ((TextTypeViewHolder) holder).mvViewPager.setAdapter(sliderPagerAdapter);

                    ((TextTypeViewHolder) holder).mvViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
                        @Override
                        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

                        }

                        @Override
                        public void onPageSelected(int position) {
                            addBottomDots(position, ((TextTypeViewHolder) holder).ll_dots);
                            page = position;
                        }

                        @Override
                        public void onPageScrollStateChanged(int state) {

                        }
                    });
                    addBottomDots(0, ((TextTypeViewHolder) holder).ll_dots);
                    final Handler h = new Handler();
                    h.postDelayed(new Runnable() {
                        @Override
                        public void run() {
                            if (sliderPagerAdapter.getCount() == page) {
                                page = 0;
                            } else {
                                page++;
                            }
                            ((TextTypeViewHolder) holder).mvViewPager.setCurrentItem(page);
                            h.postDelayed(this, 2000);
                        }
                    }, 1000);

                    break;
                case Data.IMAGE_TYPE:
                    ((ImageTypeViewHolder) holder).tvtype.setText(object.text);
                    ((ImageTypeViewHolder) holder).iv.setImageResource(object.data);
                    break;
                case Data.AUDIO_TYPE:
                    ((ButtonTypeViewHolder) holder).type.setText(object.text);
                    ((ButtonTypeViewHolder) holder).btn.setOnClickListener(new View.OnClickListener() {
                        @Override
                        public void onClick(View view) {
                            Toast.makeText(mContext, "You clicked!!!", Toast.LENGTH_SHORT).show();
                        }
                    });
                    break;
            }
        }

    }

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

    //showing dots on screen
    private void addBottomDots(int currentPage, LinearLayout ll_dots) {
        TextView[] dots = new TextView[slider_image_list.size()];
        ll_dots.removeAllViews();
        for (int i = 0; i < dots.length; i++) {
            dots[i] = new TextView(mContext);
            dots[i].setText(Html.fromHtml("•"));
            dots[i].setTextSize(35);
            dots[i].setTextColor(Color.parseColor("#343434"));
            ll_dots.addView(dots[i]);
        }

        if (dots.length > 0)
            dots[currentPage].setTextColor(Color.parseColor("#A2A2A2"));
    }

}

Download the code from here

Hope this will helps some one.
Enjoy Coding....