1

¿Cómo puedo lograr un estilo para un editText en Android como el de la siguiente imagen?

introducir la descripción de la imagen aquí

La parte de la lupa es un botón, también el editText tiene una sombra muy similar a la que está usando el editText del buscador Google (el editText de la imagen tiene una pequeña sombra que en la imagen no se logra observar muy bien).

Ese diseño lo hice para web y estoy comenzando en Android (usando Android Studio).

Y si es posible, me gustaría poder hacer la misma animación que la barra de google animación: cuando se coloca el mouse encima o se le da tap (en caso del móvil) entonces que la sombra se muestre más grande.

7
  • Puedes usar un cardview, añadirle un edittext a la izquierda y un botón con imagen a la derecha. No tiene mucha dificultad. Commented el 12 ene. 2017 a las 10:16
  • quieres que el edittext este siempre visible? o que aparezca?
    – Maguz
    Commented el 12 ene. 2017 a las 12:54
  • @FabioVenturiPastor si puedo hacer eso, pero el estilo del editText, podré modificarlo para que se muestre como el de la imagen? gracias por contestar
    – kev
    Commented el 12 ene. 2017 a las 15:09
  • @Maguz que esté siempre visible :)
    – kev
    Commented el 12 ene. 2017 a las 15:09
  • ¿la imagen de buscar es un boton o solo un imageView?, edita tu pregunta agrega más detalles de lo que buscas
    – Rene Limon
    Commented el 12 ene. 2017 a las 16:11

1 respuesta 1

1

después de un rato logré estos estilos: en el layout del activity usar este código para el editText y para un ImageButton:

<EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:inputType="textAutoCorrect"
        android:hint="@string/hintext_buscar"
        android:ems="10"
        android:id="@+id/editTextBuscar"
        android:textAlignment="center"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        android:layout_centerVertical="true"
        android:layout_alignParentStart="true"
        android:background="@drawable/edittext_border"
        android:elevation="2.5dp"
        android:layout_toStartOf="@+id/btnBuscar" />

<ImageButton
        android:theme="@style/AppTheme.Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:srcCompat="@drawable/searchicon"
        android:id="@+id/btnBuscar"
        android:paddingTop="18.5dp"
        android:paddingBottom="18.5dp"
        android:contentDescription="buscarbtn"
        android:layout_centerVertical="true"
        android:layout_alignParentEnd="true" />

Y crear un xml en drawable con el siguiente código:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- Background Color -->
    <solid android:color="#ffffff" />
    <!-- Border Color -->
    <stroke android:width="1dp" android:color="#ffffff" />
    <!-- Round Corners -->
    <corners android:radius="1dp" />
    <padding android:top="12dp" android:bottom="12dp"></padding>

</shape>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.