{"id":339,"date":"2017-02-16T06:42:50","date_gmt":"2017-02-16T06:42:50","guid":{"rendered":"http:\/\/abhiandroid.com\/materialdesign\/?p=339"},"modified":"2019-06-14T13:26:42","modified_gmt":"2019-06-14T13:26:42","slug":"recyclerview-as-listview","status":"publish","type":"post","link":"https:\/\/abhiandroid.com\/materialdesign\/recyclerview-as-listview.html","title":{"rendered":"RecyclerView As ListView With Example In Android Studio"},"content":{"rendered":"<p>In Android, RecyclerView is an advanced and flexible version of ListView and GridView. It is a container used for displaying large amount of data sets that can be scrolled very efficiently by maintaining a limited number of views.<\/p>\n<p>RecyclerView was introduced in Material Design in API level 21 (Android 5.0 i.e Lollipop). Material Design brings lot of new features in Android that changed a lot the visual design patterns regarding the designing of modern Android applications.<\/p>\n<p>This new widget is a big step for displaying data because the ListView is one of the most commonly used UI widget. In RecyclerView android provides a lots of new features which are not present in existing ListView or GridView.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-326\" src=\"\/materialdesign\/wp-content\/uploads\/2017\/02\/RecyclerView-As-ListView-In-Android-Studio.png\" alt=\"RecyclerView As ListView In Android Studio\" width=\"549\" height=\"320\" srcset=\"https:\/\/abhiandroid.com\/materialdesign\/wp-content\/uploads\/2017\/02\/RecyclerView-As-ListView-In-Android-Studio.png 549w, https:\/\/abhiandroid.com\/materialdesign\/wp-content\/uploads\/2017\/02\/RecyclerView-As-ListView-In-Android-Studio-300x175.png 300w\" sizes=\"auto, (max-width: 549px) 100vw, 549px\" \/><br \/>\n<strong>Basic RecyclerView XML code:<\/strong><\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n&lt;RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"\r\n    tools:context=\"abhiandroid.com.recyclerviewexample.MainActivity\"&gt;\r\n    &lt;android.support.v7.widget.RecyclerView\r\n        android:id=\"@+id\/recyclerView\"\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"match_parent\" \/&gt;\r\n&lt;\/RelativeLayout&gt;\r\n<\/pre>\n<h4><span style=\"color: #008000;\"><strong>Gradle Dependency to use in RecyclerView:<\/strong><\/span><\/h4>\n<p>The RecyclerView widget is a part of separate library valid for API 7 level or higher. You will need to add the following dependency in your Gradle build file to use recyclerview.<\/p>\n<p><strong>Gradle Scripts &gt; build.gradle<\/strong><\/p>\n<pre>dependencies {\r\n ...\r\n compile \"com.android.support:recyclerview-v7:23.0.1\"\r\n }<\/pre>\n<hr \/>\n<h4><strong>RecyclerView As ListView In Android:<\/strong><\/h4>\n<p>In this article we will discuss how to use a RecyclerView as\u00a0ListView. For that we need to understand LayoutManager component of RecyclerView.<\/p>\n<p>Layout Manager is basically a very new concept introduced in RecyclerView for defining the type of Layout which RecyclerView should use.<\/p>\n<p>It contains the references for all the views that are filled by the data of the entry. We can create a Custom Layout Manager by extending RecyclerView.<\/p>\n<p>LayoutManager Class of\u00a0RecyclerView provides three types of in-built Layout Managers.<\/p>\n<ul>\n<li><span style=\"color: #008000;\"><strong>LinearLayoutManager:<\/strong><\/span> It is used for displaying vertical or horizontal list.<\/li>\n<li><span style=\"color: #008000;\"><strong>GridLayoutManager:<\/strong> <\/span>It is used for displaying the items in the form of Grids.<\/li>\n<li><span style=\"color: #008000;\"><strong>StaggeredGridLayoutManager:<\/strong><\/span> It is used to show the items in staggered Grid (uneven size image in Grid).<\/li>\n<\/ul>\n<p>As this article only focus on RecyclerView as ListView so in this article article I am going to\u00a0discuss only about LinearLayoutManager\u00a0because it is used to display the data in the form of List.<\/p>\n<p><span style=\"color: #008000;\"><strong>LinearLayoutManager :<\/strong> <\/span><\/p>\n<p>LinearLayoutManager\u00a0is used for displaying the data items in a horizontal or vertical scrolling List.<\/p>\n<p>If we need a list(vertical or horizontal) then we need to use LinearLayoutManager setting with require orientation. In Simple words we can say that we use the LinearLayoutManager for displaying RecyclerView as a ListView.<\/p>\n<p><span style=\"color: #008000;\"><strong>Public constructor for LinearLayoutManager:\u00a0<\/strong><\/span>Below we define the public constructor for LinearLayoutManager that should be used for defining orientation(vertical or horizontal) of RecyclerView.<\/p>\n<p><strong>1) \u00a0LinearLayoutManager(Context context):<\/strong> It is used to create a vertical LinearLayoutManager. In this we need to set only one parameter i.e used to set the context of the current Activity.<\/p>\n<p><span style=\"color: #008000;\"><strong>Example:<\/strong><\/span><\/p>\n<p>In below code snippet we show how to use this constructor in Android.<br \/>\n<strong>With Default Vertical Orientation:<\/strong><\/p>\n<pre>\/\/ get the reference of RecyclerView\r\n RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView);\r\n \/\/ set a LinearLayoutManager with default orientation\r\n LinearLayoutManager linearLayoutManager = new LinearLayoutManager(getApplicationContext());\r\n recyclerView.setLayoutManager(linearLayoutManager); \/\/ set LayoutManager to RecyclerView\r\n<\/pre>\n<p><strong>With Horizontal Orientation:<\/strong><\/p>\n<pre>\/\/ get the reference of RecyclerView\r\n RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView);\r\n \/\/ set a LinearLayoutManager\r\n LinearLayoutManager linearLayoutManager = new LinearLayoutManager(getApplicationContext());\r\n linearLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL); \/\/ set Horizontal Orientation\r\n recyclerView.setLayoutManager(linearLayoutManager); \/\/ set LayoutManager to RecyclerView<\/pre>\n<p><strong>2) LinearLayoutManager(Context context, int orientation, boolean reverseLayout):<\/strong> In this first parameter is used to set the current context, second is used to set the Layout Orientation should be vertical or horizontal. By using this constructor we can easily create a horizontal or vertical List. Third parameter is a boolean value which set to true layouts from end to start, it means items are arranged from end to start.<\/p>\n<p><span style=\"color: #008000;\"><strong>Example:<\/strong><\/span>\u00a0.<\/p>\n<p>In below code snippet we show how to use this constructor in Android.<\/p>\n<pre>\/\/ get the reference of RecyclerView\r\n RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView);\r\n \/\/ set a LinearLayoutManager with default horizontal orientation and false value for reverseLayout to show the items from start to end\r\n LinearLayoutManager linearLayoutManager = new LinearLayoutManager(getApplicationContext(),LinearLayoutManager.HORIZONTAL,false);\r\n recyclerView.setLayoutManager(linearLayoutManager); \/\/ set LayoutManager to RecyclerView<\/pre>\n<hr \/>\n<h4><strong>Comparison\u00a0between RecyclerView and ListView:<\/strong><\/h4>\n<p>There are a lots of new features in RecyclerView that are not present in existing ListView. The RecyclerView is more flexible, powerful and a major enhancement over ListView. Here I will try to give you a detailed insight into it.<\/p>\n<p>Below we discuss some important features of RecyclerView that should clear the reason why RecyclerView is better than ListView.<\/p>\n<p><span style=\"color: #008000;\"><strong>1. Custom Item Layouts: <\/strong><\/span>ListView can only layout the items in Vertical Arrangement and that arrangement cannot be customized according to our requirements. Suppose we need to create a horizontal List then that thing is not feasible with default ListView. But with introduction of Recyclerview we can easily create a horizontal or Vertical List. By using Layout Manager component of RecyclerView we can easily define the orientation of Items.<\/p>\n<p><span style=\"color: #008000;\"><strong>2. Use Of ViewHolder Pattern:<\/strong><\/span> ListView Adapters do not require the use of ViewHolder but RecyclerView require the use of ViewHolder that is used to store the reference of View&#8217;s.<\/p>\n<p>In ListView it is recommended to use the ViewHolder but it is not compulsion but in RecyclerView it is mandatory to use ViewHolder which\u00a0is the main difference between RecyclerView and ListView.<\/p>\n<p>ViewHolder is a static inner class in our Adapter which holds references to the relevant view&#8217;s. By using these references our code can avoid time consuming findViewById() method to update the widgets with new data.<\/p>\n<p><span style=\"color: #008000;\"><strong>3. Adapters:<\/strong> <\/span>In ListView we use many Adapter&#8217;s like ArrayAdapter for displaying simple array data, BaseAdapter and SimpleAdapters for custom Lists. In RecyclerView we only use RecyclerView.Adapter to set the data in List. In Below code sinppet we show how our CustomAdapter looks when we extends RecyclerView.Adapter class and use ViewHolder in it.<\/p>\n<pre>package abhiandroid.com.recyclerviewexample;\r\n import android.support.v7.widget.RecyclerView;\r\n import android.view.LayoutInflater;\r\n import android.view.View;\r\n import android.view.ViewGroup;\r\n import android.widget.TextView;\r\n public class CustomAdapter extends RecyclerView.Adapter {\r\n @Override\r\n public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {\r\n \/\/ infalte the item Layout\r\n View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.rowlayout, parent, false);\r\n \/\/ set the view's size, margins, paddings and layout parameters\r\n MyViewHolder vh = new MyViewHolder(v); \/\/ pass the view to View Holder\r\n return vh;\r\n }\r\n @Override\r\n public void onBindViewHolder(MyViewHolder holder, int position) {\r\n }\r\n @Override\r\n public int getItemCount() {\r\n return 0;\r\n }\r\n public class MyViewHolder extends RecyclerView.ViewHolder {\r\n TextView textView;\/\/ init the item view's\r\n public MyViewHolder(View itemView) {\r\n super(itemView);\r\n\r\n\/\/ get the reference of item view's\r\n textView = (TextView) itemView.findViewById(R.id.textView);\r\n }\r\n }\r\n }\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>4. Item Animator:<\/strong> <\/span>ListView are lacking in support of good animation. RecyclerView brings a new dimensions in it. By using RecyclerView. ItemAnimator class we can easily animate the view.<\/p>\n<p><span style=\"color: #008000;\"><strong>5. Item Decoration:<\/strong> <\/span>In ListView dynamically decorating items like adding divider or border was not\u00a0easy but in RecyclerView by using RecyclerView. ItemDecorator class we have a huge control on it.<\/p>\n<p><span style=\"color: #008000;\"><strong>Conclusion:<\/strong> <\/span>At the end we can say that RecyclerView is much more customizable than the existing ListView and gives a lots of control and power to developers.<\/p>\n<hr \/>\n<h4><strong>Example Of\u00a0RecyclerView As Vertical ListView In Android Studio:<\/strong><\/h4>\n<p>Below is the example of RecyclerView As ListView in which we display the vertical list of Person Names with their images by using RecyclerView. In this example we are using LinearLayoutManger with vertical orientation to display the items.<\/p>\n<p>Firstly we declare a RecyclerView in our XML file and then get the reference of it in our Activity. After that we creates two ArrayList for Person Names and Images. After that we set a LayoutManager and finally we set the Adapter to show the items in RecyclerView. Whenever a user clicks on an item the name of the Person is displayed on the screen with the help of Toast.<\/p>\n<p style=\"text-align: center;\"><a class=\"download\" href=\"https:\/\/github.com\/abhisheksaini4\/RecyclerViewExampleVerticalListView\" target=\"_blank\" rel=\"nofollow\">Download Code<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-329\" src=\"\/materialdesign\/wp-content\/uploads\/2017\/02\/RecyclerView-As-Vertical-ListView-In-Android-Studio-1.gif\" alt=\"RecyclerView As Vertical ListView In Android Studio\" width=\"269\" height=\"416\" \/><br \/>\n<span style=\"color: #008000;\"><strong>Step 1:<\/strong><\/span> Create A New Project And Name It RecyclerViewExample.<\/p>\n<p><span style=\"color: #008000;\"><strong>Step 2:<\/strong> <\/span>Open <span style=\"color: #008000;\">Gradle Scripts &gt; build.gradle<\/span> and add RecyclerView Library dependency in it.<\/p>\n<pre>apply plugin: 'com.android.application'\r\nandroid {\r\ncompileSdkVersion 24\r\nbuildToolsVersion \"24.0.1\"\r\ndefaultConfig {\r\napplicationId \"abhiandroid.com.recyclerviewexample\"\r\nminSdkVersion 16\r\ntargetSdkVersion 24\r\nversionCode 1\r\nversionName \"1.0\"\r\n}\r\nbuildTypes {\r\nrelease {\r\nminifyEnabled false\r\nproguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'\r\n}\r\n}\r\n}\r\ndependencies {\r\ncompile fileTree(dir: 'libs', include: ['*.jar'])\r\ntestCompile 'junit:junit:4.12'\r\ncompile 'com.android.support:appcompat-v7:24.1.1'\r\ncompile \"com.android.support:recyclerview-v7:23.0.1\" \/\/ dependency file for RecyclerView\r\n}<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 3:<\/strong> <\/span>Open <span style=\"color: #008000;\">res -&gt; layout -&gt; activity_main.xml (or) main.xml<\/span> and add following code:<br \/>\nIn this step we create a RecyclerView in our XML file.<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n&lt;RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"\r\n    tools:context=\"abhiandroid.com.recyclerviewexample.MainActivity\"&gt;\r\n    &lt;android.support.v7.widget.RecyclerView\r\n        android:id=\"@+id\/recyclerView\"\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"match_parent\" \/&gt;\r\n&lt;\/RelativeLayout&gt;\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 4:<\/strong> <\/span>Create a new XML file rowlayout.xml for item of RecyclerView and paste the following code in it.<br \/>\nIn this step we create a new xml file for item row in which we creates a TextView and ImageView to show the data.<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n&lt;LinearLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:orientation=\"horizontal\"\r\n    android:padding=\"5dp\"&gt;\r\n    &lt;!--\r\n    items for a single row of RecyclerView\r\n    --&gt;\r\n    &lt;ImageView\r\n        android:id=\"@+id\/image\"\r\n        android:layout_width=\"70dp\"\r\n        android:layout_height=\"70dp\"\r\n        android:scaleType=\"fitXY\"\r\n        android:src=\"@mipmap\/ic_launcher\" \/&gt;\r\n    &lt;TextView\r\n        android:id=\"@+id\/name\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_gravity=\"center_vertical\"\r\n        android:layout_marginLeft=\"10dp\"\r\n        android:text=\"ABCD\"\r\n        android:textColor=\"#000\"\r\n        android:textSize=\"20sp\" \/&gt;\r\n&lt;\/LinearLayout&gt;\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 5 :<\/strong> <\/span>Now open <span style=\"color: #008000;\">app -&gt; java -&gt; package -&gt; MainActivity.java<\/span> and add the below code.<\/p>\n<p>In this step firstly we get the reference of RecyclerView. After that we creates two ArrayList&#8217;s for Person Names and Images. After that we set a LayoutManager and finally we set the Adapter to show the items in RecyclerView.<\/p>\n<pre>package abhiandroid.com.recyclerviewexample;\r\n import android.os.Bundle;\r\n import android.support.v7.app.AppCompatActivity;\r\n import android.support.v7.widget.LinearLayoutManager;\r\n import android.support.v7.widget.RecyclerView;\r\n import java.util.ArrayList;\r\n import java.util.Arrays;\r\n public class MainActivity extends AppCompatActivity {\r\n \/\/ ArrayList for person names\r\n ArrayList personNames = new ArrayList&lt;&gt;(Arrays.asList(\"Person 1\", \"Person 2\", \"Person 3\", \"Person 4\", \"Person 5\", \"Person 6\", \"Person 7\",\"Person 8\", \"Person 9\", \"Person 10\", \"Person 11\", \"Person 12\", \"Person 13\", \"Person 14\"));\r\n ArrayList personImages = new ArrayList&lt;&gt;(Arrays.asList(R.drawable.person1, R.drawable.person2, R.drawable.person3, R.drawable.person4, R.drawable.person5, R.drawable.person6, R.drawable.person7,R.drawable.person1, R.drawable.person2, R.drawable.person3, R.drawable.person4, R.drawable.person5, R.drawable.person6, R.drawable.person7));\r\n @Override\r\n protected void onCreate(Bundle savedInstanceState) {\r\n super.onCreate(savedInstanceState);\r\n setContentView(R.layout.activity_main);\r\n \/\/ get the reference of RecyclerView\r\n RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView);\r\n \/\/ set a LinearLayoutManager with default vertical orientation\r\n LinearLayoutManager linearLayoutManager = new LinearLayoutManager(getApplicationContext());\r\n recyclerView.setLayoutManager(linearLayoutManager);\r\n \/\/ call the constructor of CustomAdapter to send the reference and data to Adapter\r\n CustomAdapter customAdapter = new CustomAdapter(MainActivity.this, personNames,personImages);\r\n recyclerView.setAdapter(customAdapter); \/\/ set the Adapter to RecyclerView\r\n }\r\n }<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 6:<\/strong> <\/span>Create a new class CustomAdapter.java inside package and add the following code.<br \/>\nIn this step we create a CustomAdapter class and extends RecyclerView.Adapter class with View Holder in it. After that we implement the overrided methods and create a constructor for getting the data from Activity. \u00a0In this custom Adapter two methods are more important first is onCreateViewHolder in which we inflate the layout item xml and pass it to View Holder and other is onBindViewHolder in which we set the data in the view&#8217;s with the help of View Holder. Finally we implement the setOnClickListener event on itemview and on click of item we display the name of the person with the help of Toast.<\/p>\n<pre>package abhiandroid.com.recyclerviewexample;\r\n import android.content.Context;\r\n import android.support.v7.widget.RecyclerView;\r\n import android.view.LayoutInflater;\r\n import android.view.View;\r\n import android.view.ViewGroup;\r\n import android.widget.ImageView;\r\n import android.widget.TextView;\r\n import android.widget.Toast;\r\n import java.util.ArrayList;\r\n public class CustomAdapter extends RecyclerView.Adapter {\r\n ArrayList personNames;\r\n ArrayList personImages;\r\n Context context;\r\n public CustomAdapter(Context context, ArrayList personNames, ArrayList personImages) {\r\n this.context = context;\r\n this.personNames = personNames;\r\n this.personImages = personImages;\r\n }\r\n @Override\r\n public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {\r\n \/\/ infalte the item Layout\r\n View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.rowlayout, parent, false);\r\n \/\/ set the view's size, margins, paddings and layout parameters\r\n MyViewHolder vh = new MyViewHolder(v); \/\/ pass the view to View Holder\r\n return vh;\r\n }\r\n @Override\r\n public void onBindViewHolder(MyViewHolder holder, final int position) {\r\n \/\/ set the data in items\r\n holder.name.setText(personNames.get(position));\r\n holder.image.setImageResource(personImages.get(position));\r\n \/\/ implement setOnClickListener event on item view.\r\n holder.itemView.setOnClickListener(new View.OnClickListener() {\r\n @Override\r\n public void onClick(View view) {\r\n \/\/ display a toast with person name on item click\r\n Toast.makeText(context, personNames.get(position), Toast.LENGTH_SHORT).show();\r\n }\r\n });\r\n }\r\n @Override\r\n public int getItemCount() {\r\n return personNames.size();\r\n }\r\n public class MyViewHolder extends RecyclerView.ViewHolder {\r\n \/\/ init the item view's\r\n TextView name;\r\n ImageView image;\r\n public MyViewHolder(View itemView) {\r\n super(itemView);\r\n \/\/ get the reference of item view's\r\n name = (TextView) itemView.findViewById(R.id.name);\r\n image = (ImageView) itemView.findViewById(R.id.image);\r\n }\r\n }\r\n }<\/pre>\n<p><strong>Output:<\/strong><\/p>\n<p>Now run the App and you will person name which can be scrolled in horizontal direction created using RecyclerView.<\/p>\n<hr \/>\n<h4><strong>Example Of\u00a0RecyclerView As Horizontal ListView In Android Studio<\/strong><\/h4>\n<p>Below is the example of RecyclerView As ListView in which we display the horizontal list of Person Names with their images by using RecyclerView. In this example we are using LinearLayoutManger with horizontal orientation to display the items.<\/p>\n<p>Firstly we declare a RecyclerView in our XML file and then get the reference of it in our Activity. After that we creates two ArrayList&#8217;s for Person Names and Images.<\/p>\n<p>After that we set a LayoutManager with horizontal orientation and finally we set the Adapter to show the items in RecyclerView. Whenever a user clicks on an item the name of the Person is displayed on the screen with the help of Toast.<\/p>\n<p style=\"text-align: center;\"><a class=\"download\" href=\"http:\/\/www.mediafire.com\/file\/n8aecbgtaa5kz0r\/RecyclerViewExampleHorizontalListView.zip\/file\" target=\"_blank\" rel=\"nofollow\">Download Code<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-331\" src=\"\/materialdesign\/wp-content\/uploads\/2017\/02\/RecyclerView-As-Horizontal-ListView-In-Android-Studio.gif\" alt=\"RecyclerView As Horizontal ListView In Android Studio\" width=\"272\" height=\"410\" \/><br \/>\n<span style=\"color: #008000;\"><strong>Step 1:<\/strong> <\/span>Create A New Project And Name It RecyclerViewExample.<\/p>\n<p><span style=\"color: #008000;\"><strong>Step 2:<\/strong><\/span> Open<span style=\"color: #008000;\"> Gradle Scripts &gt; build.gradle<\/span> and add RecyclerView Library dependency in it.<\/p>\n<pre>apply plugin: 'com.android.application'\r\n android {\r\n compileSdkVersion 24\r\n buildToolsVersion \"24.0.1\"\r\n defaultConfig {\r\n applicationId \"abhiandroid.com.recyclerviewexample\"\r\n minSdkVersion 16\r\n targetSdkVersion 24\r\n versionCode 1\r\n versionName \"1.0\"\r\n }\r\n buildTypes {\r\n release {\r\n minifyEnabled false\r\n proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'\r\n }\r\n }\r\n }\r\n dependencies {\r\n compile fileTree(dir: 'libs', include: ['*.jar'])\r\n testCompile 'junit:junit:4.12'\r\n compile 'com.android.support:appcompat-v7:24.1.1'\r\n compile \"com.android.support:recyclerview-v7:23.0.1\" \/\/ dependency file for RecyclerView\r\n }\r\n<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 3:<\/strong><\/span> Open<span style=\"color: #008000;\"> res -&gt; layout -&gt; activity_main.xml (or) main.xml<\/span> and add following code:<br \/>\nIn this step we create a RecyclerView in our XML file.<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n &lt;RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n android:layout_width=\"match_parent\"\r\n android:layout_height=\"match_parent\"\r\n tools:context=\"abhiandroid.com.recyclerviewexample.MainActivity\"&gt;\r\n &lt;android.support.v7.widget.RecyclerView\r\n android:id=\"@+id\/recyclerView\"\r\n android:layout_width=\"match_parent\"\r\n android:layout_height=\"match_parent\" \/&gt;\r\n &lt;\/RelativeLayout&gt;<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 4:<\/strong> <\/span>Create a new XML file <span style=\"color: #008000;\">rowlayout.xml<\/span> for item of RecyclerView and paste the following code in it.<br \/>\nIn this step we create a new xml file for item row in which we creates a TextView and ImageView to show the data.<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n &lt;LinearLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n android:layout_width=\"match_parent\"\r\n android:layout_height=\"wrap_content\"\r\n android:orientation=\"vertical\"\r\n android:padding=\"5dp\"&gt;\r\n &lt;!--\r\n items for a single row of RecyclerView\r\n --&gt;\r\n &lt;ImageView\r\n android:id=\"@+id\/image\"\r\n android:layout_width=\"70dp\"\r\n android:layout_height=\"70dp\"\r\n android:scaleType=\"fitXY\"\r\n android:src=\"@mipmap\/ic_launcher\" \/&gt;\r\n &lt;TextView\r\n android:id=\"@+id\/name\"\r\n android:layout_width=\"wrap_content\"\r\n android:layout_height=\"wrap_content\"\r\n android:layout_gravity=\"center_vertical\"\r\n android:layout_marginLeft=\"10dp\"\r\n android:text=\"ABCD\"\r\n android:textColor=\"#000\" \/&gt;\r\n &lt;\/LinearLayout&gt;<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 5 :<\/strong><\/span> Now open <span style=\"color: #008000;\">app -&gt; java -&gt; package -&gt; MainActivity.java<\/span> and add the below code.<\/p>\n<p>In this step firstly we get the reference of RecyclerView. After that we creates two ArrayList&#8217;s for Person Names and Images. After that we set a LayoutManager with horizontal orientation and finally we set the Adapter to show the items in RecyclerView.<\/p>\n<pre>package abhiandroid.com.recyclerviewexample;\r\n import android.os.Bundle;\r\n import android.support.v7.app.AppCompatActivity;\r\n import android.support.v7.widget.LinearLayoutManager;\r\n import android.support.v7.widget.RecyclerView;\r\n import java.util.ArrayList;\r\n import java.util.Arrays;\r\n public class MainActivity extends AppCompatActivity {\r\n \/\/ ArrayList for person names\r\n ArrayList personNames = new ArrayList&lt;&gt;(Arrays.asList(\"Person 1\", \"Person 2\", \"Person 3\", \"Person 4\", \"Person 5\", \"Person 6\", \"Person 7\",\"Person 8\", \"Person 9\", \"Person 10\", \"Person 11\", \"Person 12\", \"Person 13\", \"Person 14\"));\r\n ArrayList personImages = new ArrayList&lt;&gt;(Arrays.asList(R.drawable.person1, R.drawable.person2, R.drawable.person3, R.drawable.person4, R.drawable.person5, R.drawable.person6, R.drawable.person7,R.drawable.person1, R.drawable.person2, R.drawable.person3, R.drawable.person4, R.drawable.person5, R.drawable.person6, R.drawable.person7));\r\n @Override\r\n protected void onCreate(Bundle savedInstanceState) {\r\n super.onCreate(savedInstanceState);\r\n setContentView(R.layout.activity_main);\r\n \/\/ get the reference of RecyclerView\r\n RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView);\r\n \/\/ set a LinearLayoutManager with default horizontal orientation and false value for reverseLayout to show the items from start to end\r\n LinearLayoutManager linearLayoutManager = new LinearLayoutManager(getApplicationContext(),LinearLayoutManager.HORIZONTAL,false);\r\n recyclerView.setLayoutManager(linearLayoutManager);\r\n \/\/ call the constructor of CustomAdapter to send the reference and data to Adapter\r\n CustomAdapter customAdapter = new CustomAdapter(MainActivity.this, personNames,personImages);\r\n recyclerView.setAdapter(customAdapter); \/\/ set the Adapter to RecyclerView\r\n }\r\n }<\/pre>\n<p><span style=\"color: #008000;\"><strong>Step 6:<\/strong><\/span> Create a new class CustomAdapter.java inside package and add the following code.<br \/>\nIn this step we create a CustomAdapter class and extends RecyclerView.Adapter class with View Holder in it. After that we implement the overrided methods and create a constructor for getting the data from Activity, In this custom Adapter two methods are more important first is onCreateViewHolder in which we inflate the layout item xml and pass it to View Holder and other is onBindViewHolder in which we set the data in the view&#8217;s with the help of View Holder. Finally we implement the setOnClickListener event on itemview and on click of item we display the name of the person with the help of Toast.<\/p>\n<pre>package abhiandroid.com.recyclerviewexample;\r\n import android.content.Context;\r\n import android.support.v7.widget.RecyclerView;\r\n import android.view.LayoutInflater;\r\n import android.view.View;\r\n import android.view.ViewGroup;\r\n import android.widget.ImageView;\r\n import android.widget.TextView;\r\n import android.widget.Toast;\r\n import java.util.ArrayList;\r\n public class CustomAdapter extends RecyclerView.Adapter {\r\n ArrayList personNames;\r\n ArrayList personImages;\r\n Context context;\r\n public CustomAdapter(Context context, ArrayList personNames, ArrayList personImages) {\r\n this.context = context;\r\n this.personNames = personNames;\r\n this.personImages = personImages;\r\n }\r\n @Override\r\n public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {\r\n \/\/ infalte the item Layout\r\n View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.rowlayout, parent, false);\r\n \/\/ set the view's size, margins, paddings and layout parameters\r\n MyViewHolder vh = new MyViewHolder(v); \/\/ pass the view to View Holder\r\n return vh;\r\n }\r\n @Override\r\n public void onBindViewHolder(MyViewHolder holder, final int position) {\r\n \/\/ set the data in items\r\n holder.name.setText(personNames.get(position));\r\n holder.image.setImageResource(personImages.get(position));\r\n \/\/ implement setOnClickListener event on item view.\r\n holder.itemView.setOnClickListener(new View.OnClickListener() {\r\n @Override\r\n public void onClick(View view) {\r\n \/\/ display a toast with person name on item click\r\n Toast.makeText(context, personNames.get(position), Toast.LENGTH_SHORT).show();\r\n }\r\n });\r\n }\r\n @Override\r\n public int getItemCount() {\r\n return personNames.size();\r\n }\r\n public class MyViewHolder extends RecyclerView.ViewHolder {\r\n \/\/ init the item view's\r\n TextView name;\r\n ImageView image;\r\n public MyViewHolder(View itemView) {\r\n super(itemView);\r\n \/\/ get the reference of item view's\r\n name = (TextView) itemView.findViewById(R.id.name);\r\n image = (ImageView) itemView.findViewById(R.id.image);\r\n }\r\n }\r\n }<\/pre>\n<p><strong>Output:<\/strong><\/p>\n<p>Now run the App and you will person name which can be scrolled in horizontal direction created using RecyclerView.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In Android, RecyclerView is an advanced and flexible version of ListView and GridView. It is a container used for displaying large amount of data sets that can be scrolled very efficiently by maintaining a limited number of views. RecyclerView was introduced in Material Design in API level 21 (Android 5.0 i.e Lollipop). Material Design brings &hellip; <a href=\"https:\/\/abhiandroid.com\/materialdesign\/recyclerview-as-listview.html\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">RecyclerView As ListView With Example In Android Studio<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-339","post","type-post","status-publish","format-standard","hentry","category-archive"],"psp_head":"<title>RecyclerView As ListView With Example In Android Studio \u2013 Android Material Design Tutorial<\/title>\r\n<meta name=\"description\" content=\"RecyclerView As ListView tutorial with example for both horizontal and vertical orientation in Android Studio using Adapter.\" \/>\r\n<meta name=\"robots\" content=\"index,follow\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/abhiandroid.com\/materialdesign\/recyclerview-as-listview.html\" \/>\r\n","_links":{"self":[{"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/posts\/339","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/comments?post=339"}],"version-history":[{"count":3,"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/posts\/339\/revisions"}],"predecessor-version":[{"id":759,"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/posts\/339\/revisions\/759"}],"wp:attachment":[{"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/media?parent=339"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/categories?post=339"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/abhiandroid.com\/materialdesign\/wp-json\/wp\/v2\/tags?post=339"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}