Como Implementar Clique em Drawables do EditText

O recurso drawable no EditText permite que desenvolvedores adicionem ícones aos lados dos campos de entrada no Android. No entanto, implementar o clique em drawables do EditText requer uma abordagem específica usando OnTouchListener. Neste guia prático, você aprenderá técnicas testadas com código pronto para uso otimizado para o melhor desempenho e experiência do usuário.

Entendendo os Conceitos de Clique em Drawable EditText

O EditText do Android suporta o posicionamento de drawables em quatro posições diferentes: start, top, end e bottom. Para lidar com cliques nesses elementos, você precisa usar OnTouchListener pois não existe um método onClick dedicado. Esta abordagem permite a detecção precisa das coordenadas do toque e comparação com a área do drawable.

Como desenvolvedor, entender o mecanismo de clique em drawable EditText é crucial para criar experiências de usuário intuitivas. Esta técnica é comumente usada em formulários de entrada, campos de pesquisa e controles numéricos em aplicativos Android modernos.

Implementação do Layout XML para Drawables

Primeiro, crie um layout com EditText que tenha drawables nas propriedades drawableStart e drawableEnd. Certifique-se de ter adicionado os ícones necessários na pasta res/drawable com tamanhos e resoluções apropriados.

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">

    <EditText
        android:id="@+id/editText1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:drawableStart="@drawable/ic_baseline_remove_circle_24"
        android:drawableEnd="@drawable/ic_baseline_add_circle_24"
        android:drawablePadding="8dp"
        android:ems="10"
        android:gravity="center_horizontal"
        android:inputType="number"
        android:text="1"
        android:textSize="18sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Configuração do OnTouchListener na MainActivity

Aqui está a implementação completa do OnTouchListener para detectar cliques nos drawables. Use constantes de posição dos drawables e calcule os limites da área de toque com precisão para uma interação confiável.

public class MainActivity extends AppCompatActivity {

    private static final int DRAWABLE_LEFT = 0;
    private static final int DRAWABLE_RIGHT = 2;
    
    @SuppressLint("ClickableViewAccessibility")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        setupDrawableClickListeners();
    }

    private void setupDrawableClickListeners() {
        EditText myText = findViewById(R.id.editText1);
        myText.setOnTouchListener((view, motionEvent) -> {
            if (motionEvent.getAction() == MotionEvent.ACTION_UP) {
                Drawable[] drawables = myText.getCompoundDrawables();
                
                // Detectar clique no drawable end (direita)
                if (isDrawableClick(motionEvent, myText, drawables, DRAWABLE_RIGHT)) {
                    incrementValue();
                    return true;
                }
                
                // Detectar clique no drawable start (esquerda)
                if (isDrawableClick(motionEvent, myText, drawables, DRAWABLE_LEFT)) {
                    decrementValue();
                    return true;
                }
            }
            return false;
        });
    }

    private boolean isDrawableClick(MotionEvent event, EditText editText, 
                                   Drawable[] drawables, int drawableIndex) {
        if (drawables[drawableIndex] == null) {
            return false;
        }
        
        int drawableWidth = drawables[drawableIndex].getBounds().width();
        float x = event.getRawX();
        
        switch (drawableIndex) {
            case DRAWABLE_RIGHT:
                return x >= (editText.getRight() - drawableWidth - editText.getPaddingRight());
            case DRAWABLE_LEFT:
                return x <= (editText.getLeft() + drawableWidth + editText.getPaddingLeft());
            default:
                return false;
        }
    }

    private void incrementValue() {
        EditText myText = findViewById(R.id.editText1);
        try {
            int value = Integer.parseInt(myText.getText().toString());
            myText.setText(String.valueOf(value + 1));
        } catch (NumberFormatException e) {
            myText.setText("1");
        }
    }

    private void decrementValue() {
        EditText myText = findViewById(R.id.editText1);
        try {
            int value = Integer.parseInt(myText.getText().toString());
            if (value > 1) {
                myText.setText(String.valueOf(value - 1));
            }
        } catch (NumberFormatException e) {
            myText.setText("1");
        }
    }
}