Google implementa el gesto de deslizar en Android para mejorar la experiencia del usuario

En octubre de 2011, Samsung y Google presentaron Ice Cream Sandwich (ICS) y el Galaxy Nexus en un evento en Hong Kong. Matias Duarte, Director de Experiencia de Usuario de Android en Google, introdujo algunas de las nuevas características de ICS y explicó algunas de las mejoras en la interfaz de usuario (UI) y experiencia de usuario (UX). Un cambio importante que me llamó la atención fue que Google adoptó por completo el gesto de deslizamiento hacia la izquierda y derecha e intentó incorporarlo en todas partes posible en el sistema operativo.

Después de usar ICS durante casi dos meses, puedo afirmar que Google hizo un gran trabajo al dispersar este gesto por todo el sistema operativo, y que ayuda a unificar la experiencia de usuario. Incluso Google hizo esto en muchas de sus aplicaciones nativas, lo que te hace sentir que intuitivamente sabes cuando estás usando una aplicación de Google. Estos son algunos de los lugares donde he notado el uso de este gesto:

• Pantalla de inicio
• Cambiando paneles en el cajón de aplicaciones/widgets
• Descartando notificaciones en la bandeja de notificaciones
• Cerrando aplicaciones en la vista de multitarea
• Cerrando pestañas del navegador
• Cambiando entre vistas en tu Stream de Google+
• Cambiando entre correos electrónicos en Gmail
• Cambiando entre vistas en el Market
• Cambiando entre conversaciones en Google Talk

Me impresionaron especialmente las implementaciones de Google+ y el Market, donde puedes deslizarte entre vistas y las etiquetas sobre las vistas se deslizan con la vista pero de una manera separada y desconectada. Es difícil de explicar, así que te animo a que lo veas por ti mismo.

Decidí tratar de incorporar esta experiencia de usuario en mis aplicaciones, porque si los usuarios entienden cómo usar este gesto en otras aplicaciones nativas de Google, debería ser natural e intuitivo en las mías. Recordé una publicación de blog en el Android Developer Blog que hablaba sobre un widget ViewPager Biblioteca de Compatibilidad de Android, que es el mismo widget que Google usó para construir la interfaz de usuario del Market y muy probablemente la interfaz de usuario de Google+. Un aspecto interesante del widget ViewPager es que puedes usarlo para navegar por vistas o fragmentos. Y, la ActionBar en Honeycomb y ICS se puede usar para formar una navegación con pestañas con fragmentos.

Luego decidí tratar de combinar estos dos conceptos para crear una interfaz de usuario que permitiera al usuario deslizarse entre pestañas. Resultó que no fue demasiado difícil combinar FragmentPagerSupport y los ejemplos de navegación de pestañas de ActionBar.

Combinando conceptos

Primero, implementé ambos conceptos en la misma aplicación; este paso fue bastante sencillo. Cuando eso estuvo hecho, tenía pestañas que controlaban un conjunto de fragmentos y otro conjunto de fragmentos deslizables debajo.

Cómo solucionar un error de permiso al iniciar una aplicación en Android Ice Cream Sandwich

Luego, me di cuenta de que tendría que eliminar el conjunto de fragmentos controlados por las pestañas y permitir que las pestañas controlen los fragmentos en el ViewPager. De manera similar, el ViewPager tendría que poder controlar qué pestaña se seleccionaba actualmente, para permitir múltiples formas de navegación.

Eliminando los fragmentos de las pestañas

Para eliminar los fragmentos en las pestañas, modifiqué la clase TabListener del ejemplo de navegación de pestañas de ActionBar. Comencé modificando el constructor para permitir pasar una referencia al ViewPager. Luego, cambié el método onTabSelected para llamar a setCurrentItem en el ViewPager que se pasó al constructor. Me di cuenta de que mientras pasara el índice de la pestaña como "etiqueta" al constructor de TabListener, aunque fuera una cadena de texto, podía analizar un entero desde la etiqueta y pasarlo a setCurrentItem. A continuación, comenté el código existente en onTabUnselected, ya que ya no era necesario.

Controlando las pestañas desde el widget ViewPager

Lo último que quedaba por completar era permitir que el widget ViewPager estableciera la pestaña seleccionada actualmente cada vez que los fragmentos se desplazaban. Intenté modificar el método getItem del FragmentPagerAdapter; sin embargo, como este método se llama inmediatamente cuando se carga el FragmentPagerAdapter, estaba causando problemas a menos que las pestañas se hubieran inicializado. No estaba contento con esta limitación, así que investigué un poco más y encontré la clase OnPageChangeListener, que se puede configurar para el widget ViewPager. Específicamente, el método onPageSelected del OnPageChangeListener se llamará cuando los fragmentos se desplacen, que era el lugar más fácil para establecer los estados de las pestañas. Llamando al método getTabAt en la ActionBar de la actividad, pasando el índice que se pasó a onPageSelected, luego se podía llamar al método select en la pestaña devuelta.

Obtén el código fuente

Subí todo el código fuente de este proyecto a GitHub. No dudes en descargarlo o navegarlo. Si realizas alguna modificación interesante en el código, me encantaría ver lo que se te ocurra, así que házmelo saber en la discusión.

Cómo crear un diálogo de progreso transparente en Android

En Newsmatic nos especializamos en tecnología de vanguardia, contamos con los artículos mas novedosos sobre Android, allí encontraras muchos artículos similares a Google implementa el gesto de deslizar en Android para mejorar la experiencia del usuario , tenemos lo ultimo en tecnología 2023.