Wednesday, December 4, 2019

Custom AutoCompleteTextView is combination of Spinner and AutoCompleteTextView.

What is AutoCompleteTextView?
An editable text view that shows completion suggestions automatically while the user is typing. The list of suggestions is displayed in a drop-down menu from which the user can choose an item to replace the content of the edit box.
The drop-down can be dismissed at any time by pressing the back key or, if no item is selected in the drop-down, by pressing the enter/dpad center key.
The list of suggestions is obtained from a data adapter and appears only after a given number of characters defined by the threshold.

What is Spinner?
A view that displays one child at a time and lets the user pick among them. The items in the Spinner come from the Adapter associated with this view.
Using this blog we are going to combine the functionality of Spinner into the AutoCompleteTextView. 
Example:- When AutoCompleteTextView gets the focus it shows all the values the same as Spinner.
This is the XML I am using in this example:-
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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">

    <AutoCompleteTextView
        android:id="@+id/auto_type"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/margin_10"
        android:background="@color/white"
        android:padding="@dimen/ten_view_size"
        android:maxLines="1"
        android:completionThreshold="1"
        android:singleLine="true"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>
We have to set mAutoCompleteTextView.setThreshold(1);.
We need to use setOnFocusChangeListener and addTextChangedListener to get the functionality of Spinner in the AutoCompleteTextView. We have to show drop-down whenever it gets focus.
  mAutoCompleteTextView.setOnFocusChangeListener(new View.OnFocusChangeListener() {
            @Override
            public void onFocusChange(View v, boolean hasFocus) {
                mAutoCompleteTextView.showDropDown();
            }
        });
We need to use addTextChangedListener for when the text change whenever we edit our text.
 mAutoCompleteTextView.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {

            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {

            }

            @Override
            public void afterTextChanged(final Editable s) {
                if (s.toString().isEmpty())
                    handler.postDelayed(new Runnable() {
                        @Override
                        public void run() {
                            mAutoCompleteTextView.clearFocus();
                            mAutoCompleteTextView.requestFocus();
                        }
                    }, 100);
            }
        });
    }
Here is Full Activity Class:-
public class SampleActivity extends AppCompatActivity {

    String[] names = {"Sam", "Sushil", "Mahesh", "Lack"};
    final Handler handler = new Handler();

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

        final AutoCompleteTextView mAutoCompleteTextView = findViewById(R.id.auto_type);
        ArrayAdapter<String> arrayAdapter = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, names);
        mAutoCompleteTextView.setThreshold(1);
        mAutoCompleteTextView.setAdapter(arrayAdapter);
        mAutoCompleteTextView.setOnFocusChangeListener(new View.OnFocusChangeListener() {
            @Override
            public void onFocusChange(View v, boolean hasFocus) {
                mAutoCompleteTextView.showDropDown();
            }
        });

        mAutoCompleteTextView.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {

            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {

            }

            @Override
            public void afterTextChanged(final Editable s) {
                if (s.toString().isEmpty())
                    handler.postDelayed(new Runnable() {
                        @Override
                        public void run() {
                            mAutoCompleteTextView.clearFocus();
                            mAutoCompleteTextView.requestFocus();
                        }
                    }, 100);
            }
        });
    }
}
Here is the output of this code:-



That is all. If any help related to this post please comment.
Thank you, guys.
Enjoy coding.

No comments:

Post a Comment