Search code examples
androidxmlandroid-edittextandroid-alertdialog

How show editText character limit in buttom right corner of editText box?? Example below


enter image description here

The above image shows a editext, which has it's text limit displaying at the bottom right corner with 250 characters. As the user types characters in the editText the "250" decreases.

I have been trying to implement this into my edit text, but it's been a bit challenging. I have tried various stuff. Just to let you know I am using a alertDialog, which has the editText inside it. The alertDialog then displays a xml, which has the editText attributes in it.

Thanks for the help!!!!


Solution

  • This is very easy with android material. I hope its help:

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/textField"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:counterEnabled="true" --this makes counter enable
        app:counterMaxLength="20" -- this is the limittion 
        android:hint="@string/label">
    
        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
        />
    
    </com.google.android.material.textfield.TextInputLayout>
    

    enter image description here

    or if you want just an EditeText you can use TextWatcher:

    private TextView mTextView;
    private EditText mEditText;
    mTextView.setText("250");
    private final TextWatcher mTextEditorWatcher = new TextWatcher() {
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {
            }
    
            public void onTextChanged(CharSequence s, int start, int before, int count) {
               //This sets a textview to the current length
               mTextView.setText(String.valueOf(250-s.length()));
            }
    
            public void afterTextChanged(Editable s) {
            }
    }; 
    
    
    mEditText.addTextChangedListener(mTextEditorWatcher);