Migrando una aplicación de Windows 8 a Windows 8.1. Caso práctico Reddit 8.1

Windows 8.1

El lanzamiento de Windows 8.1 es inminente y al ser una actualización gratuita del Sistema Operativo, será mucha gente, por lo decir la mayoría, la que se instale la actualización. Eso significa que si eres desarrollador de Aplicaciones de la Tienda de Windows, estarás muy ocupado ahora mismo migrando tu aplicación de Windows 8 a Windows 8.1.

En esta serie de artículos se van a detallar los diferentes pasos de migración de las aplicaciones. Y para tener un ejemplo concreto se hablará de una aplicación concreta Reddit8. Un cliente de Reddit para Windows 8 que ya está en la Store y que he procedido a migrar a Windows 8.1. Con este pretexto pretendo enseñar los diferentes desafíos que he tenido a nivel personal durante la migración y como la aplicación ha evolucionado.

TfsService

La primera recomendación antes de empezar con la migración es la de tener un control de código fuente. Esto es así porque cuando se empiece la migración, el proceso es irreversible y no se podrá volver a la versión anterior de Windows. Teniendo esto en cuenta se extrae que las aplicaciones de Windows 8.1 no son compatibles con Windows 8. Pero eso no significa que no se quiera seguir dando soporte a los clientes que tengan Windows 8.

Pon un control de código fuente en tú vida.

Es por eso que el primer paso antes de nada, es asegurarse de que se está trabajando con un control de código fuente. Yo recomiendo usar Team Foundation Service (http://tfs.visualstudio.com/) porque se integra perfectamente con Visual Studio, incluye gestión de elementos de trabajo, está en la nube y accesible desde cualquier sitio, permite trabajar con equipos de manera ágil y planificar los procesos de desarrollo.

Y lo mejor de todo esto, es que se puede usar de manera gratuita hasta 5 usuarios simplemente teniendo una cuenta de Microsoft.

image

Branch

Lo primero que hay que hacer, después de tener el código fuente en TfsService es crear una rama dentro del proyecto en el que se esté trabajando. En el ejemplo que se está siguiendo en el artículo, se pasó de llamar la carpeta Reddit8 a llamarse Reddit8.1 y ser una rama de la carpeta antes mencionada.

Migrando a Windows 8.1

La primera vez que se abre un proyecto de Windows 8 en Visual Studio 2013 Preview, VS avisa de que la solución es un proyecto de Windows 8 y que si se desea migrar a Windows 8.1. Si se elige la opción de sí, se migran todos los proyectos que tengan la solución a Windows 8.1 siendo este proceso irreversible.

En el caso de querer hacer el proceso de migración en otro momento lo único que hay que hacer es ir a las propiedades del proyecto, y en la pestaña de aplicación aparece un desplegable con la opción de cambiar la plataforma.

image

Errores de compilación

Una vez que se ha realizado el proceso de cambiar la plataforma de destino de todos los proyectos, 4 en Reddit8, se compila el proyecto y aparecen los primeros errores.

image

Que se pueden resumir en errores del framework de publicidad de Microsoft, que no es la versión correcta, y el resto de errores, son a la hora de actualizar las Tiles secundarios de la aplicación. Esto es comprensible, porque una de las características nuevas de Windows 8.1 es justamente que se han cambiado el tamaño de los Tiles.

Estos errores son fáciles de corregir. El primero simplemente es bajarse la versión para Windows 8.1 del SDK de Advertising de Microsoft de aquí. (http://msdn.microsoft.com/en-us/library/dn283993(v=msads.10).aspx)

Y el resto de errores no son tan inmediatos de corregir, porque la forma en la que se generar los Tiles secundarios ha cambiado, así que no es simplemente corregir los errores sino que hay que añadir nueva funcionalidad.

API Obsoletas

Después de corregir esos errores de los Tiles secundarios aparecen una lista de errores más grande con API que se han hecho obsoletas en Windows 8.1 y que hay otra manera de consumirlas. Se resumen brevemente en:

  • ScrollViewer. Ya no tiene métodos específicos para cambiar el desplazamiento vertical y horizontal, sino que se han integrado todos en un método llamado ChangeView que te permite cambiar desplazamiento vertical, horizontal y valor de zoom.
  • ItemsControls. Ya no se puede usar la propiedad ItemContainerGenerator que permite obtener el contenedor de una colección de elementos a partir de índice o del valor. Simplemente se ha de eliminar el texto de ItemContainerGenerator, ya que, por ejemplo, ContainerFromIndex forma parte de la clase ItemsControls y no de la clase ItemContainerGenenator.
  • ApplicationView.Value. Si se estaba usando la plantilla de código que venía con Visual Studio que incluía una clase llamada LayoutAwarePage, se ha simplificado el desarrollo de este componente.
  • DataPackage. El método SetUri, se ha cambiado por SetWebLink o SetApplicationLink.

Cambio en experiencia de usuario

Las novedades de Windows8.1 no solo están en el código sino también en los controles nuevos que permiten acercase mucho más a la experiencia de usuario de Windows8 de manera más sencilla.

A continuación se verán algunos de los cambios de funcionalidad que se han podido mejorar con controles y funcionalidad específica de Windows 8.1.

HomePage

La página principal de la aplicación ha pasado de tener un GridView con dos categorías, frontpage y subreddits.

image

A esto otro.

image

El cambio ha sido a mucho mejor. Se ha utilizado el nuevo control Hub, que soporta zoom semántico y organizar la información en secciones para mostrarlas todas seguidas.

En el caso concreto de Reddit8 se muestra una imagen que pertenece a la frontpage, que en la medida de lo posible se intenta que no se repita y el usuario siempre pueda ver contenido directamente.

El Hub control es una colección de HubSections, incluyendo una cabecera de todo el control. Cada una de las secciones incluye una cabecera y un contenido que es establecido a través de una plantilla. Así de esta manera podemos personalizar tanto el contenido como el aspecto de cada una de las secciones.

clip_image011Otro cambio incluido en la app, es la nueva barra de búsqueda que tiene la misma funcionalidad que el charm de búsqueda de Windows 8. Además se pueden seguir haciendo sugerencias de contenido conforme el usuario escribe. De esta manera ya no es necesario activar la capacidad de busqueda, ya que los dos son incopatibles entre sí.

Vista de Subreddit

Esta es la vista antes del cambio. Un GridView exactamente igual que en la página principal, pero que además mostraba información sobre el subreddit.

image

Esta es la manera en la que se muestra el contenido ahora:

image

Se ha vuelto a utilizar el mismo tipo de layout que en la página principal, pero esta vez el título de Hub es el nombre del subreddit (/r/windows8). Se ha eliminado la información del subreddit por considerarse superflua y se ha puesto en la barra de comandos.

image

En la barra de comandos de abajo aparecen, utilizando la nueva CommandBar, los comandos que son principales y secundarios. Los principales son refrescar, subscribirse al subreddit (si has iniciado sesión) agregarlos a favoritos para la navegación de la barra de arriba. En el caso de los comandos secundarios está anclar al inicio e información. Este último utiliza el controls Flyout para mostrar contenido de manera mucho más cómoda y directa que antes.

El desarrollo de la barra de comandos, se ha simplificado y se ha hecho más acorde con el estilo de aplicaciones de Windows 8.

Live tiles

Otra de las novedades de Windows 8.1 es el cambio de tamaño de los Tiles en el menú de inicio. Ahora cuando un usuario quiere anclar un elemento puede elegir el tamaño en el que quiere anclarlo.

clip_image018

Eso significa que se puede tener tiles en todos los tamaños, incluso cuando el usuario los crea.

clip_image019

Conclusión

Windows 8.1 es una mejora muy sustancial de las API que Microsoft ofrece a los desarrolladores. Ahora es más fácil que nunca adecuar nuestras aplicaciones de Windows 8 con la estética de Modern UI. Y en el caso concreto de Reddit8 la mejora, desde mi punto de vista, es más que notable. Ahora el contenido es el centro del diseño y de la funcionalidad.

Si quieres probar la nueva funcionalidad de este cliente de Reddit, puedes ir aquí para descargarte las betas que hay públicas.

http://www.reddit.com/r/reddit8/

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *