ZOFTINO.COM android and web dev tutorials

Android AutoCompleteTextView Example

Android AutoCompleteTextView is a subclass of EditText view with auto completion suggestion feature. AutoCompleteTextView retrieves data from data adapter and display a drop down with suggestions, as user types in to enter input. User can either continue to fill in manually or select one of the suggestions to auto complete the input value.

AutoCompleteTextView Example

Below example shows how to use AutoCompleteTextView. To use AutoCompleteTextView, first you need to define input text element using AutoCompleteTextView in your layout, then in your activity, you need to assign data adapter which will serve data for auto completion dropdown.

android autocompletetextview example

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:android.support.design="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.uicontrols.MainActivity">
    <AutoCompleteTextView
        android:id="@+id/category"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">
    </AutoCompleteTextView>

</android.support.constraint.ConstraintLayout>

Activity

public class AutoCompleteActivity extends AppCompatActivity {

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

        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                android.R.layout.simple_dropdown_item_1line, CATEGORIES);
        AutoCompleteTextView nameTV = (AutoCompleteTextView)
                findViewById(R.id.category);

        nameTV.setAdapter(adapter);
    }

    private static final String[] CATEGORIES = new String[] {
            "Fashion Men", "Fashion Women", "Baby", "Kids", "Electronics", "Appliance",
            "Travel", "Bags", "FootWear", "Jewellery", "Sports", "Electrical"
    };
}

AutoCompleteTextView Attributes

You can set hint using android:completionHint and hint view using completionHintView properties.

Property android:completionThreshold is used to control suggestion drop down display. By setting completionThreshold property to a number of your choice, you are configuring AutoCompleteTextView to show suggestion drop down only after user enters that many characters in the text field.

You can control drop down height, width, selector and background by setting android:dropDownHeight, android:dropDownWidth, android:dropDownSelector, and android:popupBackground respectively.

AutoCompleteTextView with TextInputLayout

By defining AutoCompleteTextView as child of TextInputLayout, floating label for AutoCompleteTextView can be shown, as TextInputLayout supports displaying label when hint is hidden.

You can get more details on other features of TextInputLayout such as character count, error message and password visibility toggle by reading android TextInputLayout tutorial.

android autocompletetextview textinputlayout example

AutoCompleteTextView with TextInputLayout 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:android.support.design="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.uicontrols.MainActivity">
    <android.support.design.widget.TextInputLayout
        android:id="@+id/price_til"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        android.support.design:counterEnabled="true"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">
        <AutoCompleteTextView
            android:id="@+id/category"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Enter Category">
        </AutoCompleteTextView>
    </android.support.design.widget.TextInputLayout>
</android.support.constraint.ConstraintLayout>

AutoCompleteTextView OnItemClickListener

To handle click events of auto completion suggestion dropdown, you need to create an implementation of AdapterView.OnItemClickListener and add it to AutoCompleteTextView by calling setOnItemClickListener method.

When user clicks an item in auto completion suggestion dropdown, AutoCompleteTextView calls onItemClick method of OnItemClickListener which is added to AutoCompleteTextView.

AdapterView OnItemClickListener

AutoCompleteTextView nameTV = (AutoCompleteTextView)
        findViewById(R.id.category);

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

AutoCompleteTextView OnItemSelectedListener

If you are not using custom view with list view for auto suggestion dropdown, you don’t need to use AdapterView.OnItemSelectedListener.

AutoCompleteTextView OnDismissListener

If you need to perform some action after auto complete dropdown has been dismissed, you will have to define AutoCompleteTextView.OnDismissListener and add it to AutoCompleteTextView by calling setOnDismissListener method.

AutoCompleteTextView nameTV = (AutoCompleteTextView)
        findViewById(R.id.category);
nameTV.setOnDismissListener(onDismissListener);

private AutoCompleteTextView.OnDismissListener onDismissListener = new AutoCompleteTextView.OnDismissListener(){
    @Override
    public void onDismiss() {
        Toast.makeText(AutoCompleteActivity.this,
                "Dismissed auto completion list "
                , Toast.LENGTH_SHORT).show();
    }
}; 

AutoCompleteTextView Important Methods

AutoCompleteTextView Validator

To validate and correct user entered value into AutoCompleteTextView, you need to implement AutoCompleteTextView.Validator and add it to AutoCompleteTextView by calling setValidator method. When validation needs to be performed, call performValidation method on AutoCompleteTextView.

AutoCompleteTextView dismissing the dropdown

To dismiss the auto complete suggestion dropdown, you need to call dismissDropDown() method on AutoCompleteTextView object.

AutoCompleteTextView clearListSelection

To clear selection of item from auto complete suggestion dropdown, you need to call clearListSelection() method on AutoCompleteTextView object.