RecyclerView in Android platform is an important component that is present often in many Android apps.
Just like ListView, Android recyclerview is used to display large amount of items on screen, but with improved performance and other benefits.
RecyclerView in Android uses an adapter to represent the information we want to show as list. In Android Listview we also use adapter, but Android recyclerview extends this concept and improves the way this adapter is used to increase the overall performance.
In this Android recyclerview tutorial, we’ll learn how to use Android Recyclerview to manage and display items on screen.
Let’s Get Started
Add dependecy in build.gradle
compile 'com.android.support:support-v4:25.2.0' compile 'com.android.support:design:25.2.0' compile 'com.android.support:recyclerview-v7:25.2.0'
activity_main.xml
<?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:id="@+id/activity_main" 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.spaceo.recyclerviewdemo.MainActivity"> <android.support.v7.widget.RecyclerView android:id="@+id/recyclerview" android:layout_width="match_parent" android:layout_height="wrap_content" android:scrollbars="vertical"> </android.support.v7.widget.RecyclerView> </RelativeLayout>
row.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="10dp"> <TextView android:id="@+id/txtName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="ewrwerwerwer" android:maxLines="2" android:ellipsize="end" android:textSize="17sp" android:textColor="@android:color/black" /> <TextView android:id="@+id/txtDate" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="erewrwer" /> </LinearLayout>
Model class
public class NewsModel { private String title,date; public NewsModel(String title,String date){ this.title=title; this.date=date; } public String getTitle() { return title; } public void setTitle(String title) { this.title = title; } public String getDate() { return date; } public void setDate(String date) { this.date = date; } }
Want To Develop An Android Application?
Validate your app idea and get a free quote.
NewsAdapter.class
public class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.MyViewHolder> { private List<NewsModel> list; private final OnItemClickListener listener; public NewsAdapter(List<NewsModel> newsList,OnItemClickListener listener) { this.list = newsList; this.listener = listener; } @Override public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { View itemView = LayoutInflater.from(parent.getContext()) .inflate(R.layout.row, parent, false); return new MyViewHolder(itemView); } @Override public void onBindViewHolder(MyViewHolder holder, int position) { holder.bind(list.get(position), listener); } @Override public int getItemCount() { return list.size(); } public class MyViewHolder extends RecyclerView.ViewHolder { public TextView title, date; public MyViewHolder(View view) { super(view); title = (TextView) view.findViewById(R.id.txtName); date = (TextView) view.findViewById(R.id.txtDate); } public void bind(final NewsModel item, final OnItemClickListener listener) { title.setText(item.getTitle()); date.setText(item.getDate()); itemView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { listener.onItemClick(item); } }); } } //Interface to handle click event public interface OnItemClickListener { void onItemClick(NewsModel item); } }
MainActivity
package com.spaceo.recyclerviewdemo; import android.content.Intent; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.DefaultItemAnimator; import android.support.v7.widget.DividerItemDecoration; 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 { private List<NewsModel> newsList = new ArrayList<>(); private RecyclerView recyclerView; private NewsAdapter mAdapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); recyclerView = (RecyclerView) findViewById(R.id.recyclerview); mAdapter = new NewsAdapter(newsList, new NewsAdapter.OnItemClickListener() { @Override public void onItemClick(NewsModel item) { //Click on item will open NewsDetail screen startActivity(new Intent(MainActivity.this,NewsDetailActivity.class).putExtra("title",item.getTitle()).putExtra("date",item.getDate())); } }); //Set Layout to recyclerview RecyclerView.LayoutManager mLayoutManager = new LinearLayoutManager(this); //Set divider DividerItemDecoration dividerItemDecoration = new DividerItemDecoration(recyclerView.getContext(),DividerItemDecoration.VERTICAL); recyclerView.addItemDecoration(dividerItemDecoration); recyclerView.setLayoutManager(mLayoutManager); //Give animation recyclerView.setItemAnimator(new DefaultItemAnimator()); recyclerView.setAdapter(mAdapter); setNewsData(); } private void setNewsData() { //Set news data NewsModel news = new NewsModel("Gupshup brings Microsoft Cognitive Services Intelligent APIs to InterBot","05-12-2017"); newsList.add(news); news = new NewsModel("Decks cleared for Snapdeal to land in Flipkart's basket","05-11-2017"); newsList.add(news); news = new NewsModel("The Apple Watch could help doctors spot the leading cause of hear","05-10-2017"); newsList.add(news); news = new NewsModel("Microsoft's new strategy: A deeper meaning","05-10-2017"); newsList.add(news); news = new NewsModel("Mario Andretti vs. semi-autonomous tech on the track","05-09-2017"); newsList.add(news); news = new NewsModel("What to bring on a plane if your laptop is banned","05-08-2017"); newsList.add(news); news = new NewsModel("Risky to chase growth over unit economics: Liew, Lightspeed Venture Partners","05-07-2017"); newsList.add(news); news = new NewsModel("OnePlus 5 shows up on GeekBench, beats Galaxy S8+ and iPhone 7 Plus","05-06-2017"); newsList.add(news); news = new NewsModel("Google Pixel smartphone available at discount of Rs 13,000","05-05-2017"); newsList.add(news); news = new NewsModel("Oppo planning to export handsets from India","05-04-2017"); newsList.add(news); news = new NewsModel("OnePlus 5 smartphone is arriving this summer","05-04-2017"); newsList.add(news); news = new NewsModel("Decoupled solutions with Hybris","05-03-2017"); newsList.add(news); mAdapter.notifyDataSetChanged(); } }
NewsDetail.class
package com.spaceo.recyclerviewdemo; import android.os.Bundle; import android.support.annotation.Nullable; import android.support.v7.app.AppCompatActivity; import android.widget.TextView; /** * Created by Khyati on 12/5/17. */ public class NewsDetailActivity extends AppCompatActivity { private TextView txtTitle,txtDate; private String title,date; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_detail); Bundle b=getIntent().getExtras(); if(b!=null){ title=b.getString("title"); date=b.getString("date"); } txtTitle=(TextView)findViewById(R.id.txtTitle); txtDate=(TextView)findViewById(R.id.txtDate); txtTitle.setText(title); txtDate.setText(date); } }
activity_detail.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:padding="10dp"> <TextView android:id="@+id/txtTitle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="18sp" android:textColor="@android:color/black"/> <TextView android:id="@+id/txtDate" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="10dp"/> </LinearLayout>
AndroidManifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.spaceo.recyclerviewdemo"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:supportsRtl="true" android:theme="@style/AppTheme"> <activity android:name=".MainActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".NewsDetailActivity"/> </application> </manifest>
And done!
Once you successfully implement this code, you can easily display large amount of items easily on screen. Although, if an app is complex, then implementing recyclerview may become bit difficult. So, if you’re not completely aware with it, you can consult with Android app development company to implement the Android recyclerview correctly.
Get a free copy of Android RecyclerView Example from Github.
You may also like,
- Android Jetpack Tutorial: How to Implement Android Navigation Component in Your App
- How to Create Android Snackbar Using New Android Design Support Library
This page was last edited on December 28th, 2020, at 8:00.