Android AutoCompleteTextView using Adapter with custom filter


Download Android AutoCompleteTextView using Adapter with custom filter sample

AutoCompleteTextView tutorial. Explained how to customize android AutoCompleteTextView with Image & text using custom ArrayAdapter, how to implement custom filter logic in ArrayAdapter. Demonsrated AutoCompleteTextView with a sample

In my previous tutorial, I explained Android AutoCompleteTextView and Android MultiAutoCompleteTextView in which we were showing suggestion list from String type Array of data when user start typing.

Now, consider a Class Customer as given below:

Customer.java

Suppose we have an Array of Customer object. We want when user start typing on AutoCompleteTextView then we filter our customer array by firstName and show filtered suggestion list to the User.

There are 2 ways to handle this situation:

  1. Create our custom AutoCompleteTextView by extending AutoCompleteTextView and override the method that is responsible for filtering
  2. Second and better approach is to create our custom Adapter class. Adapter can handle custom filter as well as customization of suggestion list.

So let's create CustomerAdapter class that extends ArrayAdapter as follows:

We must call a public constructor of ArrayAdapter from our constructor, as I did.

How to customize rows in AutoCompleteTextView suggestion list?

To customize suggestion list we need to do 2 things:

  1. We must specify a row layout, how we want to display rows in suggestion list
  2. We must override getView method in our adapter class
I created a customer_row.xml under res ->layout, code of customer_row.xml is given below:

Here is screenshot, how above layout looks like:

AutoCompleteTextView customer row

Our next step is to override getView method in CustomerAdapter class to complete the customization.

I wanted to display odd and even row in different color so I implemented my logic in above method.

How to implement custom filter logic?


To implement custom filter logic, we must override getFilter method in CustomerAdapter.java. My filter code is given below:

Text decoration in android


Android provides several text decorating attributes like Typeface, font family, text style, text size, text color, text shadow etc. that can be applied to AutoCompleteText. To learn more visit below given link:

How to decorate text in android

Example of AutoCompleteTextView with adapter and custom filter


In this example, we are going to use demonstrate AutoCompleteTextView with customized suggestion box with custom filter logic.

Result

Android autoComplete text view

Step 1: Create a new project in Android Studio and name it Android AutoCompleteTextViewWithCustomAdapter.

Step 2: Open res -> layout -> activity_main.xml and add following code

activity_main.xml

Step 3: Open res -> values -> strings.xml and replace it with below given code.

strings.xml

Step 4: Open your res ->values ->colors.xml and replace it's code with below given code of my colors.xml as follows:

colors.xml

Step 5: Create a new layout resource under res -> layout named customer_row.xml. Replace the code of customer_row.xml with below given code.

customer_row.xml

Step 6: Create a class Customer.java and replace it's code with below given code of my Customer.java as follows:

Customer.java

Step 7:Create a class CustomerAdapter.java and replace it's code with below given code of my CustomerAdapter.java as follows:

CustomerAdapter.java

Step 8: Open your MainActivity.java and replace it's code with below given code of my MainActivity.java as follows:

MainActivity.java

Step 9: Clean and run the project to see the result.


Share & Like

Tutorial topics

About ApnaTutorials.com

ApnaTutorials.com is for Java, J2ee, Html5 and android developers. All tutorials are well explained and are easy to understand. We have tested every tutorials on our developement environment before posting it in public domain.