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 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 a AutoCompleteTextView control in two ways either in XML layout file or create it in Activity file programmatically.
Create AutoCompleteTextView in Layout File
Following is the sample way to define AutoCompleteTextView control in XML layout file in 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>
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.
Create AutoCompleteTextView Control in Activity File
In android, we can create AutoCompleteTextView control programmatically in activity file to show the list of suggestions based on 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);
AutoCompleteTextView actv = new AutoCompleteTextView(this);
l_layout.addView(actv);
Set the Text of Android AutoCompleteTextView
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);
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.
Android AutoCompleteTextView Attributes
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 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 text selection highlight. |
android:fontFamily | It is used to specify the fontFamily for the text. |
Android AutoCompleteTextView Control Example
Following is the example of defining AutoCompleteTextView control in LinearLayout to bind the data to defined control using data adapter and getting the selected list item value in 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
activity_main.xml
<?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>
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 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.
MainActivity.java
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();
}
});
}
}
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 android framework to get the required layout for an activity.
Output of Android AutoCompleteTextView Example
When we run above example using 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 textbox.
No comments:
Post a Comment