Diseño Android: Formulario en cuadro de diálogo con Fragment

logo androidEn el tutorial Diseño Android: Cuadros de diálogo de selección vimos cómo crear un cuadro de diálogo de selección encapsulado en un fragment y también echamos un vistazo rápido a las características de los cuadros de diálogo en Android. En el presente tutorial haremos lo mismo pero en lugar de mostrar un listado de elementos a seleccionar haremos lo propio con un pequeño formulario. En concreto, implementaremos el siguiente formulario con dos campos de texto.

Seguir leyendo

Diseño Android: Cuadros de diálogo de selección

android

Los cuadros de diálogo son un elemento básico de la mayoría de interfaces de usuario y no necesitan presentación alguna. Según las guías de estilos de Material Design, “informan a los usuarios sobre una tarea específica y pueden contener información crítica, requerir decisiones o implicar varias tareas.” En Android, son ventanas que se muestran sobre una pantalla, representada por una Activity o un Fragment, y que bloquean el uso de la pantalla subyacente. Esta ventana es gestionada directamente por una implementación del contrato android.content.DialogInterface, aunque en la práctica será suficiente con utilizar alguna de las implementaciones que ya incluye Android.

El siguiente diagrama muestra las clases e interfaces más importantes para los cuadros de diálogos proporcionadas por Android de forma nativa, esto es, sin tener en cuenta las support libraries.

Seguir leyendo

Diseño Android: Menús con Bottom Sheet y Material Design

android

Seguimos en el blog echando un vistazo a componentes de Material Design de los que disponemos de implementaciones proporcionadas por Google. En este tutorial veremos el componente Bottom Sheet, un panel que se desliza hacia arriba desde la parte inferior de la pantalla. Su uso más habitual es mostrar información contextual o funcionar a modo de menú de selección. Este segundo caso es el que vamos a implementar con dos diseños distintos (modo lista y modo grid) y encapsulado en un fragment. El primero de ellos es una copia del utilizado en la versión 2.0 de Muspy for Android. La siguiente imagen muestra lo que vamos a implementar en este tutorial.

Seguir leyendo

Diseño Android: Transiciones entre activities con Shared Element

android

Material Design hace especial hincapié en el concepto de motion (movimiento) para “describir las relaciones espaciales, la funcionalidad y la intención con belleza y fluidez”. Dentro de los patrones de diseño propuestos podemos encontrar ejemplos y consejos para mantener la continuidad al navegar entre las distintas pantallas de forma coherente, natural y elegante, siendo uno de los comportamientos más llamativos el desplazamiento rápido y suave entre pantallas de elementos comunes entre ellas (shared elements). Podemos encontrar un buen ejemplo de ello en Google Play.

Seguir leyendo

Android: Servicio periódico con inicio automático. IntentService y JobService.

Última actualización: 03/12/2017

android

En este tutorial vamos a ver una solución para un escenario en el que necesitamos que una aplicación realice una tarea en segundo plano de forma periódica y sin intervención por parte del usuario, por ejemplo para realizar una sincronización de datos con un servidor. Esta tarea puede ser implementada con un servicio, “un componente de una aplicación que puede realizar operaciones de larga ejecución en segundo plano y que no proporciona una interfaz de usuario”. Además de implementar este servicio, tenemos que encontrar un modo de programar su ejecución periódica y asegurar que se ejecute aunque la aplicación no se esté en ejecutando en ese momento.

Seguir leyendo

Dagger 2: Inyección de dependencias en Android

Última actualización: 02/07/2017

android

La inyección de dependencias (Dependency Injection, DI) es un patrón de diseño que ayuda a hacer nuestras aplicaciones más modulares y fáciles de testear, mantener y evolucionar. Su uso está más que asumido en el mundo Java gracias a Spring y al estándar JEE, y en Android se está utilizando cada vez más de la mano de Dagger 2, herramienta desarrollada por Google utilizando como base Dagger de Square y que también puede utilizarse en Java.

Seguir leyendo

Android: Integración con Chrome (Custom Tabs)

android

A finales del verano de 2015, Google publicó dentro de las librerías de compatibilidad un nuevo módulo para permitir realizar cierta integración entre nuestras apps y el navegador Chrome 45+. El objetivo consiste básicamente en poder solicitar a Chrome mostrar un contenido web y que el navegador “parezca” que forma parte de nuestra app y no de la sensación al usuario que hemos salido de la misma.

Seguir leyendo

Diseño Android: EditText con Material Design y TextInputLayout

Última actualización : 18/08/2016

android

La especificación de Material Design para los campos de texto recoge la utilización de las denominadas “etiquetas flotantes” (floating labels). Este elemento de usabilidad consiste en ubicar las etiquetas de los campos de texto dentro del mismo (inline) para posteriormente mostrarlas en la parte superior del campo mientras este tenga el foco o bien contenga algún valor. El objetivo es optimizar el espacio vertical de la pantalla al mostrarse la etiqueta dentro del campo del texto pero evitar a la vez que el usuario pierda la noción del contenido que corresponde al campo del texto. La siguiente animación, extraída de la aplicación de ejemplo que construiremos en el presente tutorial, muestra este comportamiento:

Android TextInputLayout

Seguir leyendo

Diseño Android: Toolbar y Pestañas con Material Design

android

Uno de los componentes gráficos definidos por Material Design que más rápidamente han sido adoptados en Android es el nuevo estilo de pestañas integradas en la barra de acciones. Podemos encontrar una infinidad de ejemplos de su implementación, por ejemplo Google Play:

google play tabs
Seguir leyendo

Diseño Android: PercentRelativeLayout

tutorial android

Una limitación que a veces encontramos al utilizar un layout en Android es la imposibilidad de definir dimensiones relativas mediante porcentajes. Siempre podemos implementar nuestro propio layout pero la estrategia más habitual suele ser utilizar LinearLayout y el atributo layout_weight tal y como se muestra en el tutorial Diseño Android: Dashboard UI con LinearLayout. El problema de esta técnica es que estamos limitados a utilizar sólo LinearLayout y que el “anidamiento” de los mismos si se utiliza layout_weight penaliza el rendimiento de la generación de la interfaz gráfica debido a los cálculos realizados para obtener el tamaño a utilizar.

Seguir leyendo