Search Functionality in RecyclerView using EditText

In this post we will learn adding Search Functionality in RecyclerView. If a list contain many items then giving a search option is really necessary for making it user friendly. So lets see how to add Search Functionality in RecyclerView.

Table of Contents

1 Creating a RecyclerView
2 Implementing Search Functionality in RecyclerView

Creating a RecyclerView

Creating new Project

The very first thing we need is the RecyclerView itself. Only then we can add the search. So lets create a new Android Studio Project.

Adding RecyclerView and CardView

Once you have created a new Android Studio Project add RecyclerView and CardView to it. If you don’t know adding RecyclerView and CardView you can refer to the previous RecyclerView Tutorial.

Creating Layouts

Now once you have added the project come inside activity_main.xml and create a RecyclerView. The code for my activity_main.xml is below.

<?xml version="1.0" encoding="utf-8"?>

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context="net.simplifiedlearning.recyclerviewsearch.MainActivity">

<EditText

android:id="@+id/editTextSearch"

android:layout_width="0dp"

android:layout_height="wrap_content"

android:hint="Enter search term"

tools:layout_constraintTop_creator="1"

tools:layout_constraintRight_creator="1"

android:layout_marginStart="8dp"

android:layout_marginEnd="8dp"

app:layout_constraintRight_toRightOf="parent"

android:layout_marginTop="16dp"

tools:layout_constraintLeft_creator="1"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintTop_toTopOf="parent"

android:layout_marginLeft="8dp"

android:layout_marginRight="8dp" />

<android.support.v7.widget.RecyclerView

android:id="@+id/recyclerView"

android:layout_width="0dp"

android:layout_height="0dp"

tools:layout_constraintTop_creator="1"

tools:layout_constraintRight_creator="1"

tools:layout_constraintBottom_creator="1"

android:layout_marginStart="8dp"

app:layout_constraintBottom_toBottomOf="parent"

android:layout_marginEnd="8dp"

app:layout_constraintRight_toRightOf="parent"

android:layout_marginTop="8dp"

app:layout_constraintTop_toBottomOf="@+id/editTextSearch"

tools:layout_constraintLeft_creator="1"

android:layout_marginBottom="8dp"

app:layout_constraintLeft_toLeftOf="parent"

android:layout_marginLeft="8dp"

android:layout_marginRight="8dp"

app:layout_constraintHorizontal_bias="0.0"

app:layout_constraintVertical_bias="1.0">

</android.support.v7.widget.RecyclerView>

</android.support.constraint.ConstraintLayout>

The above code will produce the following layout.

As you can see have a RecyclerView and an EditText. When we type something on EditText the RecyclerView will get filtered.
Now we will create a layout for our List Item. So create a new Layout Resource file named list_layout.xml and write the following xml code.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="vertical">

<android.support.v7.widget.CardView

android:layout_marginTop="5dp"

android:layout_marginBottom="5dp"

android:layout_width="match_parent"

android:layout_height="wrap_content">

<TextView

android:id="@+id/textViewName"

android:padding="15dp"

android:textAppearance="@style/Base.TextAppearance.AppCompat.Large"

android:layout_width="match_parent"

android:layout_height="wrap_content" />

</android.support.v7.widget.CardView>

</LinearLayout>

Creating RecyclerView Adapter

Now we will create Adapter for our RecyclerView. So create a class named CustomAdapter and write the following code.

package net.simplifiedlearning.recyclerviewsearch;

import android.support.v7.widget.RecyclerView;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

import java.util.ArrayList;

/**

* Created by Belal on 6/6/2017.

public class CustomAdapter extends RecyclerView.Adapter<CustomAdapter.ViewHolder> {

private ArrayList<String> names;

public CustomAdapter(ArrayList<String> names) {

this.names = names;

}

@Override

public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

View v = LayoutInflater.from(parent.getContext())

.inflate(R.layout.list_layout, parent, false);

return new ViewHolder(v);

}

@Override

public void onBindViewHolder(ViewHolder holder, int position) {

holder.textViewName.setText(names.get(position));

}

@Override

public int getItemCount() {

return names.size();

}

class ViewHolder extends RecyclerView.ViewHolder {

TextView textViewName;

ViewHolder(View itemView) {

super(itemView);

textViewName = (TextView) itemView.findViewById(R.id.textViewName);

}

Now come to MainActivity.java and write the following code.

package net.simplifiedlearning.recyclerviewsearch;

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.support.v7.widget.LinearLayoutManager;

import android.support.v7.widget.RecyclerView;

import android.text.Editable;

import android.text.TextWatcher;

import android.widget.EditText;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

RecyclerView recyclerView;

EditText editTextSearch;

ArrayList<String> names;

CustomAdapter adapter;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

names = new ArrayList<>();

names.add("Ramiz");

names.add("Belal");

names.add("Azad");

names.add("Manish");

names.add("Sunny");

names.add("Shahid");

names.add("Deepak");

names.add("Deepika");

names.add("Sumit");

names.add("Mehtab");

names.add("Vivek");

recyclerView = (RecyclerView) findViewById(R.id.recyclerView);

editTextSearch = (EditText) findViewById(R.id.editTextSearch);

recyclerView.setHasFixedSize(true);

recyclerView.setLayoutManager(new LinearLayoutManager(this));

adapter = new CustomAdapter(names);

recyclerView.setAdapter(adapter);

}

Now run the application and you will see your RecyclerView.

As you can see we have the RecyclerView. Now we will implement Search Functionality in RecyclerView.

Implementing Search Functionality in RecyclerView

Come to MainActivity.java and add a TextChangedListener as shown below. You have to do this inside onCreate().

//adding a TextChangedListener

//to call a method whenever there is some change on the EditText

editTextSearch.addTextChangedListener(new TextWatcher() {

@Override

public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {

}

@Override

public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {

}

@Override

public void afterTextChanged(Editable editable) {

//after the change calling the method and passing the search input

filter(editable.toString());

}

});

Now we need to create the method filter().

private void filter(String text) {

//new array list that will hold the filtered data

ArrayList<String> filterdNames = new ArrayList<>();

//looping through existing elements

for (String s : names) {

//if the existing elements contains the search input

if (s.toLowerCase().contains(text.toLowerCase())) {

//adding the element to filtered list

filterdNames.add(s);

}

//calling a method of the adapter class and passing the filtered list

adapter.filterList(filterdNames);

}

Lastly we need to create the method filter inside CustomAdapter class. So come inside CustomerAdapter.java and define the following method.

//This method will filter the list

//here we are passing the filtered data

//and assigning it to the list with notifydatasetchanged method

public void filterList(ArrayList<String> filterdNames) {

this.names = filterdNames;

notifyDataSetChanged();

}

Now run the application and try searching.

Bingo! It is working absolutely fine.

So we have the Search Functionality in RecyclerView. Thats all for this tutorial. If you are having any confusions or queries then lets have a discussion on comment section. Also don’t forget to SHARE the post if you found it useful. Thank You 🙂