In android, AutoCompleteTextView is an editable text view which is used to show the list of suggestions based on the user typing text. The list of suggestions will be shown as a dropdown menu from which the user can choose an item to replace the content of the textbox.
The AutoCompleteTextView is a subclass of EditText class so we can inherit all the properties of EditText in AutoCompleteTextView based on our requirements.
Following is the pictorial representation of using AutoCompleteTextView in android applications.
Generally, the dropdown list of suggestions can be obtained from the data adaptor and those suggestions will be appeared only after giving the number characters defined in the Threshold limit.
The Threshold property of AutoCompleteTextView is used to define the minimum number of characters the user must type to see the list of suggestions.
The dropdown list of suggestions can be closed at any time in case if no item is selected from the list or by pressing the back or enter key.
In android, we can create an AutoCompleteTextView control in two ways either in the XML layout file or create it in the Activity file programmatically.
Following is the sample way to define AutoCompleteTextView control in the XML layout file in the android application.
<?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="match_parent"
android:orientation="vertical" >
<AutoCompleteTextView
android:id="@+id/autoComplete_Country"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
If you observe above code snippet, here we defined AutoCompleteTextView control in xml layout file.
In android, we can create AutoCompleteTextView control programmatically in an activity file to show the list of suggestions based on the user entered text.
Following is the example of creating AutoCompleteTextView control dynamically in activity file.
LinearLayout l_layout = (LinearLayout) findViewById(R.id.linear_Layout);
AutoCompleteTextView actv = new AutoCompleteTextView(this);
l_layout.addView(actv);
In android, we can set the text of AutoCompleteTextView control by using setAdapter() method in Activity file.
Following is example of binding data AutoCompleteTextView in activity file using setAdapter() method.
String[] Countries = { "India", "USA", "Australia", "UK", "Italy", "Ireland", "Africa" };
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, Countries);
AutoCompleteTextView actv = AutoCompleteTextView)findViewById(R.id.autoComplete_Country);
actv.setAdapter(adapter);
If you observe above code snippet, we are finding the AutoCompleteTextView control which we defined in XML layout file using id property and binding the data using setAdapter() method.
Following are the some of commonly used attributes related to AutoCompleteTextView control in android applications.
Attribute | Description |
---|---|
android:id | It is used to uniquely identify the control |
android:gravity | It is used to specify how to align the text like left, right, center, top, etc. |
android:text | It is used to set the text. |
android:hint | It is used to display the hint text when text is empty |
android:textColor | It is used to change the color of the text. |
android:textColorHint | It is used to change the text color of hint text. |
android:textSize | It is used to specify the size of text. |
android:textStyle | It is used to change the style (bold, italic, bolditalic) of text. |
android:background | It is used to set the background color for autocomplete textview control |
android:ems | It is used to make the textview be exactly this many ems wide. |
android:width | It makes the TextView be exactly this many pixels wide. |
android:height | It makes the TextView be exactly this many pixels tall. |
android:textColorHighlight | It is used to change the color of the text selection highlight. |
android:fontFamily | It is used to specify the fontFamily for the text. |
Following is the example of defining AutoCompleteTextView control in LinearLayout to bind the data to defined control using a data adapter and getting the selected list item value in the android application.
Create a new android application using android studio and give names as AutoCompleteTextViewExample. In case if you are not aware of creating an app in android studio check this article Android Hello World App.
Now open an activity_main.xml file from \res\layout path and write the code like as shown below
<?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="match_parent"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:orientation="vertical"
android:id="@+id/linear_Layout">
<AutoCompleteTextView
android:id="@+id/ac_Country"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="100dp"
android:hint="Enter Country Name"/>
</LinearLayout>
If you observe above code we created AutoCompleteTextView control in XML Layout file.
Once we are done with the creation of layout with required control, we need to load the XML layout resource from our activity onCreate() callback method, for that open main activity file MainActivity.java from \java\com.tutlane.autocompletetextviewexample path and write the code like as shown below.
package com.tutlane.autocompletetextviewexample;
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.Toast;
public class MainActivity extends AppCompatActivity {
String[] Countries = { "India", "USA", "Australia", "UK", "Italy", "Ireland", "Africa" };
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_dropdown_item_1line, Countries);
AutoCompleteTextView actv = (AutoCompleteTextView)findViewById(R.id.ac_Country);
actv.setThreshold(1);
actv.setAdapter(adapter);
actv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Toast.makeText(getApplicationContext(), "Selected Item: " + parent.getSelectedItem(), Toast.LENGTH_SHORT).show();
}
});
}
}
If you observe above code we are calling our layout using setContentView method in the form of R.layout.layout_file_name in our activity file. Here our xml file name is activity_main.xml so we used file name activity_main and binding data to our AutoCompleteTextView using ArrayAdapter and getting selected list item value using getSelectedItem() method.
Generally, during the launch of our activity, onCreate() callback method will be called by the android framework to get the required layout for an activity.
When we run above example using the android virtual device (AVD) we will get a result like as shown below.
This is how we can use AutoCompleteTextView control in android applications to show the list of suggestions to the user based on the text they entered in the textbox.