Android | RecyclerView

RecyclerView is a ViewGroup added to the android studio as a successor of the GridView and ListView. It is an improvement on both of them and can be found in the latest v-7 support packages. It has been created to make possible construction of any lists with XML layouts as an item which can be customized vastly while improving on the efficiency of ListViews and GridViews. This improvement is achieved by recycling the views which are out of the visibility of the user. For example, if a user scrolled down to a position where the items 4 and 5 are visible; items 1, 2 and 3 would be cleared from the memory to reduce memory consumption.

Implementation: To implement a basic RecyclerView three sub-parts are needed to be constructed which offer the users the degree of control they require in making varying designs of their choice.

  1. The Card Layout: The card layout is an XML layout which will be treated as an item for the list created by the RecyclerView.
  2. The ViewHolder: The ViewHolder is a java class that stores the reference to the card layout views that have to be dynamically modified during the execution of the program by a list of data obtained either by online databases or added in some other way.
  3. The Data Class: The Data class is a custom java class that acts as a structure for holding the information for every item of the RecyclerView.

Below is the implementation of the RecyclerView:

exam_card.xml



filter_none

edit
close

play_arrow

link
brightness_4
code

<!-- XML Code illustrating card layout usage. -->
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="105dp">
  
  
    <TextView
        android:layout_width="200dp"
        android:id="@+id/examName"
        android:textSize="16sp"
        android:layout_marginStart="20dp"
        android:text="First Exam"
        android:textColor="@color/black"
        android:layout_marginEnd="20dp"
        android:maxLines="1"
        android:layout_marginTop="15dp"
        android:layout_height="wrap_content"/>
  
    <ImageView
        android:id="@+id/examPic"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_below="@+id/examName"
        android:tint="#808080"
        android:layout_marginStart="20dp"
        android:layout_marginTop="7dp"
        app:srcCompat="@drawable/baseline_schedule_black_36dp"/>
  
    <TextView
        android:id="@+id/examDate"
        android:layout_toEndOf="@+id/examPic"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/examName"
        android:layout_marginTop="5dp"
        android:layout_marginEnd="20dp"
        android:layout_marginStart="10dp"
        android:gravity="center"
        android:text="May 23, 2015"
        android:textSize="16sp"/>
  
  
  
  
    <ImageView
        android:id="@+id/examPic2"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_below="@+id/examDate"
        android:tint="#808080"
        android:layout_marginStart="20dp"
        android:layout_marginTop="7dp"
        app:srcCompat="@drawable/baseline_school_black_36dp"/>
  
    <TextView
        android:id="@+id/examMessage"
        android:layout_toEndOf="@+id/examPic2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/examDate"
        android:layout_marginEnd="20dp"
        android:layout_marginTop="5dp"
        android:layout_marginStart="10dp"
        android:gravity="center"
        android:text="Best Of Luck"
        android:textSize="16sp"/>
  
  
    <TextView
        android:id="@+id/border2"
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_marginStart="15dp"
        android:layout_marginEnd="15dp"
        android:layout_alignParentBottom="true"
        android:background="#808080"/>
  
  
</RelativeLayout>

chevron_right


examViewHolder.java

filter_none

edit
close

play_arrow

link
brightness_4
code

// ViewHolder code for RecyclerView
package com.example.admin.example;
  
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.TextView;
  
public class examViewHolder
    extends RecyclerView.ViewHolder {
    TextView examName;
    TextView examMessage;
    TextView examDate;
  
    examViewHolder(View itemView)
    {
        super(itemView);
        examName
            = (TextView)itemView
                  .findViewById(R.id.examName);
        examDate
            = (TextView)itemView
                  .findViewById(R.id.examDate);
        examMessage
            = (TextView)itemView
                  .findViewById(R.id.examMessage);
    }
}

chevron_right


examData.java

filter_none

edit
close

play_arrow

link
brightness_4
code

package com.prodigieux.admin.prodigieux;
  
public class examData {
    String name;
    String date;
    String message;
  
    examData(String name,
             String date,
             String message)
    {
        this.name = name;
        this.date = date;
        this.message = message;
    }
}

chevron_right


The Adapter: The adapter is the main code responsible for RecyclerView. It holds all the important methods dealing with the implementation of RecylcerView. The basic methods for a successful implementation are:

  • onCreateViewHolder: which deals with the inflation of the card layout as an item for the RecyclerView.
  • onBindViewHolder: which deals with the setting of different data and methods related to clicks on particular items of the RecyclerView.
  • getItemCount: which Returns the length of the RecyclerView.
  • onAttachedToRecyclerView: which attaches the adapter to the RecyclerView.

Below program illustrates an example of a custom adapter:

ImageGalleryAdapter2.java

filter_none

edit
close

play_arrow

link
brightness_4
code

private class ImageGalleryAdapter2
    extends RecyclerView.Adapter<examViewHolder> {
  
    List<examData> list
        = Collections.emptyList();
  
    Context context;
  
    public ImageGalleryAdapter2(List<examData> list,
                                Context context)
    {
        this.list = list;
        this.context = context;
    }
  
    @Override
    public examViewHolder
    onCreateViewHolder(ViewGroup parent,
                       int viewType)
    {
  
        Context context
            = parent.getContext();
        LayoutInflater inflater
            = LayoutInflater.from(context);
  
        // Inflate the layout
  
        View photoView
            = inflater
                  .inflate(R.layout.card_exam,
                           parent, false);
  
        examViewHolder viewHolder
            = new examViewHolder(photoView);
        return viewHolder;
    }
  
    @Override
    public void
    onBindViewHolder(final examViewHolder viewHolder,
                     final int position)
    {
  
        viewHolder.examName
            .setText(list.get(position).name);
        viewHolder.examDate
            .setText(list.get(position).date);
        viewHolder.examMessage
            .setText(list.get(position).message);
    }
  
    @Override
    public int getItemCount()
    {
        return list.size();
    }
  
    @Override
    public void onAttachedToRecyclerView(
        RecyclerView recyclerView)
    {
        super.onAttachedToRecyclerView(recyclerView);
    }
  
    // Sample data for RecyclerView
    private List<examData> getData()
    {
        List<examData> list = new ArrayList<>();
        list.add(new examData("First Exam",
                              "May 23, 2015",
                              "Best Of Luck"));
        list.add(new examData("Second Exam",
                              "June 09, 2015",
                              "b of l"));
        list.add(new examData("My Test Exam",
                              "April 27, 2017",
                              "This is testing exam .."));
  
        return list;
    }
}

chevron_right


RecyclerView Implementation in an activity:

exam.java

filter_none

edit
close

play_arrow

link
brightness_4
code

package com.example.admin.example;
  
import android.content.Context;
import android.content.Intent;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.view.LayoutInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
  
import com.prolificinteractive
    .materialcalendarview
    .MaterialCalendarView;
  
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
  
public class exam extends AppCompatActivity
    implements NavigationView
                   .OnNavigationItemSelectedListener {
  
    ImageGalleryAdapter2 adapter;
    RecyclerView recyclerView;
  
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_exam);
        Toolbar toolbar
            = (Toolbar)findViewById(R.id.toolbar);
        toolbar.setTitle("");
        setSupportActionBar(toolbar);
  
        List<examData> list = new ArrayList<>();
        list = getData();
  
        recyclerView
            = (RecyclerView)findViewById(
                R.id.recyclerView);
        adapter
            = new ImageGalleryAdapter2(
                list, getApplication());
        recyclerView.setAdapter(adapter);
        recyclerView.setLayoutManager(
            new LinearLayoutManager(exam.this));
    }
  
    @Override
    public void onBackPressed()
    {
        super.onBackPressed();
    }
  
    // Sample data for RecyclerView
    private List<examData> getData()
    {
        List<examData> list = new ArrayList<>();
        list.add(new examData("First Exam",
                              "May 23, 2015",
                              "Best Of Luck"));
        list.add(new examData("Second Exam",
                              "June 09, 2015",
                              "b of l"));
        list.add(new examData("My Test Exam",
                              "April 27, 2017",
                              "This is testing exam .."));
  
        return list;
    }
}

chevron_right


activity_exam.xml

filter_none

edit
close

play_arrow

link
brightness_4
code

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:layout_marginTop="56dp" 
    android:background="#FFFFFF" 
    tools:context=".exam"
  
    <LinearLayout 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:orientation="vertical"
  
        <android.support.v7.widget.RecyclerView 
            android:nestedScrollingEnabled="false" 
            android:id="@+id/recyclerView" 
            android:layout_width="match_parent" 
            android:overScrollMode="never" 
            android:layout_height="wrap_content"/> 
  
    </LinearLayout
</ScrollView>

chevron_right



Output:

Keep in mind, that the drawable mentioned in the XML layouts have to be added to the drawable folder under res of the Android Studio Project and support package v7 should be added as an implementation in the Gradle file of the project for the code to run. The above code uses ScrollView as a parent to RecyclerView and disables the scrolling of the RecyclerView hence making the whole page scroll instead of just the RecyclerView contents.



My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.




Article Tags :
Practice Tags :


4


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.