en Android

Desarrollo para Android: Estilo Holo en versiones pre Honeycomb

Voy a empezar a escribir uno de los que espero sean varios artículos dedicados al mundo del desarrollo para Android. No pretendo hacer una guía para dar los primeros pasos. No enseñaré a configurar Eclipse ni voy a contar de dónde descargar el SDK. Vamos a ir directo a temas que a lo largo de este tiempo me han costado encontrar en internet. Abordaré temas relacionados con el impacto de la carga de imágenes en memoria, la destrucción y recuperación de instancias, uso de servicios para carga de datos remotos… Como sabéis, minube tiene una aplicación de viajes para android en Google Play y partiré de esa experiencia que he ido recogiendo para intentar exponer temas interesantes que seguro que a más de un desarrollador pueda servir.

El tema que quiero tratar hoy es menos de desarrollo duro y más de base sobre la cual cimentar nuestra aplicación de cara a que sea compatible con versiones previas a Android 3 (Honeycomb) intentando conservar la experiencia del usuario al máximo. Para ello vamos a hacer que nuestra aplicación luzca exactamente igual tanto en Ice Cream como en Froyo. Como sabéis, Android ha tenido una evolución muy grande en cuanto a interfaz de usuario. Partió de una experiencia lamentable, con estilos nada unificados hasta llegar hoy a Jelly Bean donde el estilo del sistema operativo respira una misma experiencia casi en todos lados. Ahora es tema de los desarrolladores hacer esto con nuestras aplicaciones de cara a preservar este gran trabajo de interfaz que está haciendo Google. Para ello vamos a repasar algunas recomendaciones que se hacen en el sitio de Developers de Android:

Utiliza los estilos y componentes nativos del sistema

Uno de los errores más comunes en las empresas es desarrollar una aplicación para iOS y, luego, intentar replicar esa experiencia en un sistema operativo distinto (Android, Windows Phone, etc). Error! Android tiene elementos propios de interfaz que los usuarios reconocen y saben utilizar, flujos de interfaz de usuario distintos, navegaciones bien diferenciadas. Vamos a hacerlo bien! Veamos un ejemplo gráfico

Como podéis ver tanto Android, como iOs y Windows Phone tienen elementos de interfaz totalmente distintos. Como comentaba anteriormente, un gran error es intentar pintar en android un botón típico de iOS o poner una barra con las típicas navegaciones hacia atrás…. Lo mismo pasa con los iconos, los elementos de las listas, los menús, etc.

Holo

A partir de la versión 3 de Android, la gente de Google empezó a ver claro el éxito de iOS en interfaces de usuario y se dió cuenta que el jardín que tenía montado en su sistema operativo no era el camino adecuado. Es por esto que decidió dar un giro y empezar a unificar todo. El resultado tiene nombres y son Holo y Roboto. Holo no es más que un tema consistente y unificado que se aplica tanto a los componentes (botones, listas, etc) como al resto de la experiencia visual del sistema operativo y las aplicaciones. Poco a poco vemos que más y más desarrolladores adoptan este nuevo estilo, lo que convierte a Android en una experiencia más sencilla y unificada para los usuarios.

El problema

Como dije anteriormente, Holo nació con Honeycomb y se ha adoptado con mayor fuerza en Ice Cream y Jelly Bean. Pero la realidad es que la cuota de adopción de estas versiones sigue siendo algo baja con respecto a la cantidad de terminales con Gingerbread, Froyo o anteriores. Pero no os preocupéis, las diferencias son salvables y es lo que vamos a ver a continuación.

El ActionBar

Una novedad introducida en Android 3 fue el ActionBar. Se trata de una barra que nos dará la posibilidad de esquematizar nuestras aplicaciones mejor puesto que se creó con la idea de quitar los engorrosos menús activados con botones físicos para dar lugar a un lugar en pantalla donde siempre veamos las acciones frecuentes de nuestra aplicación. Esta barra posee tres sectores bien diferenciados:

1- El icono: Aquí es donde va nuestra marca, logo, etc. A su vez se utiliza como elemento de navegación dentro de la aplicación

2- El título y subtítulo: Aquí podremos incluir información de la ventana que estamos mostrando (el nombre de un contacto en el caso de una agenda, el nombre de un sitio en el caso de una ficha, etc)

3- El espacio para acciones: Este es nuestro menú. Aquí cabe un número limitado de iconos que deberemos escoger sumamente bien para dar mayor o menor importancia a las acciones de nuestra aplicación. Para ello nos recomiendan usar dos iconos para acciones muy frecuentes y el tercer espacio para poner un menu desplegable con las acciones menos frecuentes

Para poder dotar de un ActionBar casi igual al de Ice Cream en versiones previas a Android 3, existe un proyecto muy bueno llamado ActionBarSherlock. Esta librería nos da compatibilidad y nos sirve de base para nuestras aplicaciones. Recomiendo adoptarlo antes de empezar una app, puesto que luego puede ser un poco más engorroso modificar la aplicación. Este proyecto se soporta a su vez por una librería de soporte que nos brinda android para versiones 2X e inferiores que nos da soporte para fragmentos, cargadores asíncronos de cursores, etc etc etc.

El proyecto podéis encontrarlo en http://actionbarsherlock.com/

Holoeverywhere

Una vez que tenemos ActionBarSherlock y la librería de compatiblidad de Android montadas en nuestro proyecto, vamos a resolver de un solo plumazo el tema del diseño y del tema Holo para nuestra App. El proyecto se encuentra en Github en  https://github.com/ChristopheVersieux/HoloEverywhere y podéis descargaros una demo de Google Play y probarla en un terminal Gingerbread o inferior para que veáis lo logrado que está https://play.google.com/store/apps/details?id=org.holoeverywhere.demo

Con este paquete lo que conseguiremos es que todos los componentes que utilicemos en nuestra app se vean iguales tanto en versiones 2X como en versiones 4X de Android

Todos estos proyectos trabajan juntos y necesitan la librería de compatibilidad de Android. Os recomiendo montar un proyecto y empezar a poner Holo en todas vuestras aplicaciones

Escribe un comentario

Comentario

  1. ¿Como Instalo la HoloEverywhere en lalibreria de androird?

  2. Llevo toda la tarde tratando de utilizar Holo pero no lo logro :@ lo que me descargo de git tiene unos errores y no encuentro una guía de como hacerlo. alguien sabe?