Página Principal

domingo, 27 de marzo de 2016

EditText con Botones símil WhatsApps

Hola gente:


Acá en esta entrega voy a explicar cómo hacer que un EditText de Android se “vea” como si tuviera botones dentro de él, como en WhatsApp...


En principio, desconociendo si verdaderamente la gente que diseño este formato lo hace de otra forma. Debo decirles que esto es solamente un efecto visual, por eso antes escribí  el “vea”.

Si amigos, lo que debemos hacer es trabajar a nivel XML. Primero debemos insertar un EditText y tantos botones (dependiendo nuestro diseño serán ImageButton) quedáramos dentro de un componente layout con orientación horizontal (Para que estén uno al lado del otro).


Lo siguiente es tan simple como modificar el estilo al layout contenedor con esta línea:
style="@android:style/Widget.EditText"

Quedando de esta forma…



 <LinearLayout
        style="@android:style/Widget.EditText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" 
        android:layout_marginTop="10dp">

        <EditText
            android:id="@+id/editProductoBuscar"
            android:layout_width="210dp"
            android:layout_height="wrap_content"
            android:background="@null" >
        </EditText>

        <ImageButton
            android:id="@+id/buttonProductoBusqueda"
            android:layout_width="38dp"
            android:layout_height="38dp"
            android:src="@drawable/lupitas" />

        <ImageButton
            android:id="@+id/imageButtonProductoCam"
            android:layout_width="40dp"
            android:layout_height="38dp"
            android:layout_marginLeft="2dp"
            android:src="@android:drawable/ic_menu_camera" />
    </LinearLayout>
 



Así es como se vería el diseño final de ese layout mostrado:


Espero que les sirva
Un saludo, Cidius


No hay comentarios:

Publicar un comentario