¿Cómo agregar un ícono dentro de la vista EditText en Android?

2 minutos de lectura

avatar de usuario
adham

Quiero agregar un ícono de “búsqueda” para que aparezca dentro de un EditText en el borde izquierdo? como el cuadro de búsqueda en la aplicación de Android de Facebook?

avatar de usuario
marcosbeirigo

Utilizar el android:drawableLeft propiedad en EditText.

<EditText
    ...     
    android:drawableLeft="@drawable/my_icon" />

  • lo siento por la pregunta poco clara, quiero agregar un botón, así que cuando hago clic en él, hace alguna acción

    – adham

    26 de noviembre de 2010 a las 0:38

  • Esta fue solo la solución que esperaba, dado el encabezado de búsqueda.

    – Tomas Ahle

    18 de diciembre de 2010 a las 22:35

  • Además, ajuste el acolchado con el drawablePadding propiedad.

    – Ryan R.

    20 de enero de 2013 a las 1:17

  • Entonces, ¿cuál debería ser el tamaño de ese ícono dibujable y en qué carpeta debo colocarlo?

    – Kalpesh Lakhani

    22 de julio de 2014 a las 6:13

  • @KalpeshLakhani: por lo general, el texto de edición y los elementos dibujables deben ser de 32 dp de acuerdo con las pautas de diseño de Android: developer.android.com/design/style/metrics-grids.html

    – Lee Yi Hong

    23 de julio de 2014 a las 2:39


avatar de usuario
Pedro Ajtai

Puede configurar drawableLeft en el XML como lo sugiere marcos, pero también puede configurarlo mediante programación, por ejemplo, en respuesta a un evento. Para ello utiliza el método setCompuestoDrawablesWithIntrincisBounds(int, int, int, int):

EditText editText = findViewById(R.id.myEditText);

// Set drawables for left, top, right, and bottom - send 0 for nothing
editTxt.setCompoundDrawablesWithIntrinsicBounds(R.drawable.myDrawable, 0, 0, 0);

  • Esto establece el fondo del EditText, no el ícono/imagen en el “Borde izquierdo”, que se menciona claramente en la pregunta.

    – Paresh Mayani

    18 de noviembre de 2011 a las 19:09

  • @Paresh, por eso eliminé la respuesta. Ahora he editado para incluir una solución programática además de la solución XML original.

    -Peter Ajtai

    18 de noviembre de 2011 a las 19:26


  • ¿Cómo ocultar programáticamente el icono? cuando se hace clic en el cuadro de edición?

    – Caza

    18 de abril de 2012 a las 5:40

  • @Hunt: simplemente configure el coumound dibujable en null cuando se hace clic en la vista.

    -Peter Ajtai

    18/04/2012 a las 16:55

Si desea utilizar el elemento de diseño predeterminado de Android, puede utilizar @android:drawable/ic_menu_search como esto:

<EditText android:id="@+id/inputSearch"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:drawableLeft="@android:drawable/ic_menu_search"
    android:hint="Search product.."
    android:inputType="textVisiblePassword"/>

Usar :

<EditText
    ..     
    android:drawableStart="@drawable/icon" />

avatar de usuario
rohit jakhar

usar android: drawbleIniciar propiedad en EditText

    <EditText
        ...     
        android:drawableStart="@drawable/my_icon" />

Use un diseño relativo y configure el botón para que se alinee a la izquierda de la vista de edición de texto, y configure el relleno izquierdo de su vista de texto al tamaño de su botón. No puedo pensar en una buena manera de hacerlo sin codificar el relleno:/

También puedes usar herramienta apk para descomprimir la aplicación de Facebook y echar un vistazo a sus archivos de diseño.

¿Ha sido útil esta solución?

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad