Android Design Support Library (VI): TextInputLayout

Otra entrega de la serie de tutoriales donde aprenderemos a utilizar la nueva librería de diseño Android Design Support Library. En esta semana veremos como implementar TextInputLayout.

TEXT INPUT LAYOUT

Con la llegada de Material Design se formó mucho hype sobre ciertos elementos, los cuales al no tener un soporte oficial fuera de las simples guías de diseño, originaron librerías de terceros. Uno de los que más tuvo culpa de eso es sin duda los títulos/placeholders con animaciones en los EditText, también conocido como Floating labels. Finalmente se han dignado a facilitarnos un estándar en la librería de diseño con TextInputLayout.

SHOW ME THE CODE

Este es otro de los widgets más sencillos de implementar, simplemente tendremos que añadir la etiqueta en nuestro layout e insertar dentro un EditText, es lógico si tenemos en cuenta que este widget nada más que extiende la funcionalidad del EditText corriente. Quedaría una cosa así: <android.support.design.widget.TextInputLayout android:id="@+id/edit_text_wrapper" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="4dp"> <EditText android:id="@+id/edit_text" android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Username"/> </android.support.design.widget.TextInputLayout> Y así de sencillo y así de rápido tendremos nuestro widget implementado. Recordad que tenéis todo el código en el repositorio de GitHub.