How to Implement RecyclerView in a Fragment in Android?

In Android, a fragment is a modular section of a user interface that can be combined with other fragments to create a flexible and responsive application.  A fragment represents a behavior or a portion of the user interface in an Activity, which can be reused in different activities or layouts. It has its own lifecycle and can receive input events and interact with the user. Fragments were introduced in Android 3.0 (API level 11) as a way to create more flexible and dynamic user interfaces for larger-screen devices, such as tablets. They allow developers to reuse UI components across different screen sizes and orientations, and to create more efficient and responsive applications.

Fragments can be added, removed, replaced, or rearranged dynamically at runtime, which makes it easier to create complex and flexible layouts. They are often used in combination with the FragmentManager class, which manages the lifecycle of fragments and their interaction with the hosting activity. In this article we are going to see how can we implement a RecycleView within a Fragment in Android, In this project, by clicking a button we are moving to a fragment and a RecycleView is displayed within the Fragment. To implement RecycleView in Fragment we have to follow some steps :

1. Create a RecyclerView layout
2. Create a RecyclerView Adapter
3. Set the RecyclerView Adapter and LayoutManager  in our fragment onCreateView method
4. Bind data to the RecyclerView Adapter

To learn more about RecycleView in Android you can visit this article RecyclerView in Android with Example.

Step by Step Implementation

Step 1: Create a New Project in Android Studio

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Kotlin as the programming language.

Step 2: Change the StatusBar Color

Navigate to app > res > values > themes > themes.xml and add the below code under the style section in the themes.xml file.

<item name="android:statusBarColor" tools:targetApi="l">#308d46</item>

Step 3: Creating a new Fragment 

In this step, we have to create a new Fragment named as FirstFragment.

👁 Image

Click on Fragment(Blank) and create a new Fragment.

Step 4: Creating a layout for RecyclerView

Navigate to app > res > layout then Create a new layout resource file and name it items_list.xml. It includes two Text Views for displaying the Name and Emails of the Employees. Comments are added inside the code for a better understanding of the Code.

Step 5: Working fragment_first.xml

Navigate to app > res > layout > fragment_first.xml. In this fragment layout file, we are going to implement the recyclerView.

Step 6: Working with activity_main.xml

Navigate to the app > res > layout > activity_main.xml and add the below code to the activity_main.xml file. In this layout, we have created a button by clicking this button the fragment layout will be displayed.

Step 7: Creating an Employee Model

In this step, we are going to create an employee model for our RecyclerView. It Contains the Employee’s Name and Employee email Id.  Below is the code for the Employee model. Navigate to app >java > your package name >  Create a Kotlin data class named it Employee.kt.

Step 8: Creating Employee ArrayList

In this step, we are going to prepare the ArrayList of employees with the employee name and employee email. Below is the code for Creating and adding data to the ArrayList. Comments are added inside the code for a better understanding of the Code. Navigate to app > java >your package name > Create a Kotlin Object named Constants.

Step 9: Create an Adapter for our RecyclerView

In this step, we are going to create an adapter class for our recycleView and override its three-member functions. Navigate to app > java >your package name > Create a Kotlin Object named Adapter. Below is the code for the ItemAdapter class. Comments are added inside the code for a better understanding of the Code.

Step 10: Working with FirstFragment.kt

Navigate to the app > java >your package name > FirstFragment, in this file, we are going to initialize the RecyclerView and its adapter within the onCreateView method. Add the below code to your FirstFragment.kt file.

Full Code of the FirstFragment.kt:

Step 11: Working with MainActivity.kt

Navigate to the app > java >your package name > MainActivity, in this step we are going to setOnclickListener to the button and replace the FrameLayout with the Fragment.

Output: