ZOFTINO.COM android and web dev tutorials

Android MultiAutoCompleteTextView Tutorial

Android MultiAutoCompleteTextView is a subclass of EditText view and can be configured to show auto suggestions drop down when user is entering text into it. MultiAutoCompleteTextView extends AutoCompleteTextView with additional feature. MultiAutoCompleteTextView allows users to enter multiple values separated by specified token terminator and for each value auto suggestion dropdown is displayed.

In this post, using MultiAutoCompleteTextView with an example, custom MultiAutoCompleteTextView.Tokenizer are explained.

Android MultiAutoCompleteTextView Example

Below picture shows MultiAutoCompleteTextView with suggestion dropdown for second item after entering first item separated by comma.

android MultiAutoCompleteTextView example

Define MultiAutoCompleteTextView element in your layout.

 <?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="zoftino.com.multiautocompletetextview.MainActivity">
    <MultiAutoCompleteTextView
        android:id="@+id/brand"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        android:hint="Enter Brands"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"></MultiAutoCompleteTextView>
</android.support.constraint.ConstraintLayout> 

In your activity, first get the MultiAutoCompleteTextView object. Then set data adapter by calling setAdapter method on MultiAutoCompleteTextView object, since our example uses array of strings as source of data for auto suggestion dropdown, we will use ArrayAdapter.

Then set tokenizer by calling setTokenizer method passing MultiAutoCompleteTextView.CommaTokenizer which is an implementation of MultiAutoCompleteTextView.Tokenizer provided by android. Tokenizer is used to separate substring or multiple values in MultiAutoCompleteTextView view with token terminator like comma.

Finally if needed, set OnItemClickListener to listen to click event of items in auto suggestion drop down.

 import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.AutoCompleteTextView;
import android.widget.MultiAutoCompleteTextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        MultiAutoCompleteTextView brandTextView = (MultiAutoCompleteTextView)
                findViewById(R.id.brand);

        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                android.R.layout.simple_dropdown_item_1line, Brands);

        brandTextView.setAdapter(adapter);
        brandTextView.setTokenizer(new MultiAutoCompleteTextView.CommaTokenizer());
        brandTextView.setOnItemClickListener(onItemClickListener);

    }
    private AdapterView.OnItemClickListener onItemClickListener =
            new AdapterView.OnItemClickListener(){
                @Override
                public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                    Toast.makeText(MainActivity.this,
                            "Clicked item from auto completion list "
                                    + adapterView.getItemAtPosition(i)
                            , Toast.LENGTH_SHORT).show();
                }
            };

    private static final String[] Brands = new String[] {
            "Nike", "Adidas", "Reebok", "Puma", "RF", "Polo",
            "Tommy", "Nautica", "Boss", "Spin", "Narwa", "Nivia"
    };
} 

Android MultiAutoCompleteTextView Important Methods

To get complete user entered text with multiple values separated by token, you can use getText method.

To validate each token instead of entire text entered into MultiAutoCompleteTextView, you can call performValidation.

Android MultiAutoCompleteTextView Custom Tokenizer

Below is an example of custom tokenizer with pipe terminator.

 public class PipeTokenizer implements MultiAutoCompleteTextView.Tokenizer {
        public int findTokenStart(CharSequence text, int cursor) {
            int i = cursor;
            while (i > 0 && text.charAt(i - 1) != '|') {
                i--;
            }
            while (i < cursor && text.charAt(i) == ' ') {
                i++;
            }
            return i;
        }
        public int findTokenEnd(CharSequence text, int cursor) {
            int i = cursor;
            int len = text.length();
            while (i < len) {
                if (text.charAt(i) == '|') {
                    return i;
                } else {
                    i++;
                }
            }
            return len;
        }
        public CharSequence terminateToken(CharSequence text) {
            int i = text.length();
            while (i > 0 && text.charAt(i - 1) == ' ') {
                i--;
            }
            if (i > 0 && text.charAt(i - 1) == '|') {
                return text;
            } else {
                if (text instanceof Spanned) {
                    SpannableString sp = new SpannableString(text + ", ");
                    TextUtils.copySpansFrom((Spanned) text, 0, text.length(),
                            Object.class, sp, 0);
                    return sp;
                } else {
                    return text + "| ";
                }
            }
        }
} 

For MultiAutoCompleteTextView custom adapter, MultiAutoCompleteTextView custom layout, populating suggestion drop down data from database and MultiAutoCompleteTextView custom filter, read auto suggestions from database example.