Issue while implementing drawable right click event of edittext

Question

I have added cross icon for drawable right to edittext, I want to show drawable right icon only when I enter something in edittext and I want to perform click event on cross icon if there is any entered text it should remove. How can I do it ?

`Drawable`s do not receive any events, the docs say: `"""Unlike a View, a Drawable does not have any facility to receive events or otherwise interact with the user."""` — pskink, Oct 04 '16 at 07:11
possible [duplicate](http://stackoverflow.com/questions/3554377/handling-click-events-on-a-drawable-within-an-edittext) — Akash Patel, Oct 04 '16 at 07:13

score 2 · Accepted Answer · answered Oct 04 '16 at 07:39

XML code `

                    <EditText
                        android:id="@+id/et_text"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:ems="12"
                        android:hint="Text"
                        android:singleLine="true" />

                <ImageButton
                    android:id="@+id/ib_clear"
                    style="?android:buttonBarButtonStyle"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="-50dp"
                    android:layout_marginStart="-50dp"
                    android:src="@drawable/ic_cancel_black_24dp" />
            </LinearLayout>`

you can change the visibility of the cross icon(image button) in Java code. you can add onclicklistener to image button for clickevent.

Do following to hide or display cross icon

 et_text.addTextChangedListener(new TextWatcher(){
public void afterTextChanged(Editable s) {}
public void beforeTextChanged(CharSequence s, int start, int count, int after){}
public void onTextChanged(CharSequence s, int start, int before, int count){if(et_text.getText().toString().length()>0){et_text.setVisibility(VIEW.VISIBLE);}else{et_text.setVisibility(VIEW.GONE);}
}});

score 1 · Answer 2 · answered Oct 04 '16 at 07:42

<RelativeLayout 
android:id="@+id/mainLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">

  <LinearLayout
    android:id="@+id/linearLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_toLeftOf="@+id/crossButton"
    android:orientation="vertical" >

     <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <EditText
            android:id="@+id/editTextField"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            />
    </RelativeLayout>
</LinearLayout>

<ImageButton
    android:id="@+id/crossButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_centerVertical="true"
    android:visibility="gone" />
</RelativeLayout>

After creating your xml like above where you have edittext and image; I have also set your close image visibility to gone. Now inside code implement FocusChangeListener where you will be enabling your button visibility when text is entered.

editTextField.setOnFocusChangeListener(new OnFocusChangeListener(){
@Override
        public void onFocusChange(View view, boolean hasFocus) {
            if(hasFocus && editTextField.getText().toString().length() > 0){
                crossButton.setVisibility(View.VISIBLE);
            }
            else{
                crossButton.setVisibility(View.GONE);
            }

            crossButton.invalidate();
        }
    });

I have wrote a sample code for your reference purpose,Hope this will be answer your query.

One xml having EditText with Image Button.
Inflate this xml and apply code to enable/disable visibility status logic.

@TaraUppin Great! Cheers :) and yes don't forget to accept the answer . — Anurag, Oct 04 '16 at 12:48

score 0 · Answer 3 · answered Oct 04 '16 at 07:19

You cant make drawble listen to events in case of drawble left and drawble right. however using this dynamically can help. So thing you need to do is add textwatcher to your editext and in bafter text

changed listener of your editext You need to hide and show your drawble left and right dynamically . Adding drawble dynamically :

Drawable icon = getContext().getResources().getDrawable(R.drawable.smiley );

  icon.setBounds( 0, 0, 60, 60 );
 editext.setCompoundDrawables( icon, null, null, null );

or

Drawable img = getContext().getResources().getDrawable( R.drawable.smiley );

editext.setCompoundDrawablesWithIntrinsicBounds( img, null, null, null);

or

editext.setCompoundDrawablesWithIntrinsicBounds( R.drawable.smiley, 0, 0, 0);

Issue while implementing drawable right click event of edittext

3 Answers3