Wilson Vargas
Wilson Vargas

Un programador enamorado de su código.

Wilson Vargas
Author

Un chico con una gran experiencia en el arte del desarrollo software. Desarrollador de aplicaciones de móviles, especialista en ASP.Net, Xamarin y tecnologías de computo en la Nube en especial Azure.

Share


Suscribete


Mantente al tanto de mis nuevos artículos

Tags


Featured on Planet Xamarin badge

Twitter


Aplicaciones Multiplataforma: Sincronizando Datos Offline a Azure

Wilson VargasWilson Vargas

He estado un buen tiempo alejado de mi blog, un poco saturado con la universidad y mi trabajo, pero siempre con la idea de escribir algo que les sea de mucha ayuda para ustedes. Hace días escribí un post en mi perfil de Facebook, diciendo que si esa publicación tenía más de 20 Likes escribiría algo “positrónico” (palabra inventada por los programadores locos que existen en mi universidad). Bueno, la publicación logro tener más de 20 Likes, aquí les muestro eso:

En mi artículo anterior doy una explicación bastante extensa de cómo configurar y utilizar Azure Mobile Services desde una biblioteca de clases portable (PCL) en un proyecto Xamarin con la ayuda de MvvmCross. Desde que escribí ese artículo dos cambios importantes han llegado a esta plataforma.
El primero es Xamarin.Forms, que nos permite escribir código C# en todas las plataformas y llevar la interfaz de usuario dentro del código compartido, mientras que la presentación todavía se hace de forma nativa en cada plataforma y que todavía permite personalizaciones específicas en cada una de ellas.
La segunda es la la capacidad de sincronizar los datos de tu aplicación, sin la necesidad de tener una conexión a Azure Mobile Services, utilizando SQLite.

Nota: Este es el artículo anterior:
Aplicaciones Multiplataforma: Tu aplicación en todos lados, con poco trabajo

Hoy nos enfocaremos específicamente en la segunda característica nueva, pero si estás triste porque también querías ver algo de la primera característica, no te preocupes este post habla un poco de las dos.

Ten en cuenta que la versión 1.3 de los componentes Azure Mobile Services sigue en pre-lanzamiento. Si estás tratando de usar Xamarin Forms pero quieres seguir con la versión estable, entonces todavía puedes trabajar siguiendo este artículo, don't worry! Voy a mostrar donde son las diferencias.
Lo malo es que no vas a poder tener la capacidad de sincronizar los datos sin conexión. (El código es casi idéntico.)

Como fue el caso con el artículo anterior, no estoy tratando de mostrar la forma de crear un Servicio Móvil en Azure. Si necesitas una mano con esto hay un enlace en el otro artículo que te puede servir.
La única diferencia entre el artículo anterior y este, es que este se hace sin la ayuda de MvvmCross.

Entonces, primero vamos a crear una aplicación Xamarin Forms. Usaremos una biblioteca de clases portable (PCL) otra vez.

Los que ya están familiarizados con las soluciones Xamarin Forms con PCL reconocerán la estructura generada:

Ahora, vamos a añadir las referencias que necesitamos. Haz clic derecho sobre la solución y seleccione "Administrar paquetes NuGet para la solución", de esta manera podemos hacer esto una sola vez y tener las referencias añadidas a todos los proyectos que tenemos.

Para obtener la capacidad de sincronización sin conexión tú necesitas cambiar el menú desplegable en la parte superior de 'estable' a 'Incluir Versiones preliminares' y asegurar que se agregan ambos paquetes seleccionados. Si estás escogiendo la versión 'Estable' sólo tendrás la opción de instalar el paquete "Windows Azure Services Mobile “.

Debes instalar el paquete en todos los proyectos, así como se muestra en la imagen:

En la actualidad (y de hecho desde hace bastante tiempo) los paquetes NuGet para los proyectos Xamarin.iOS y Xamarin.Android requieren un pequeño orden antes de que va a trabajar. Si construyes los proyectos ahora, veras algunos errores de referencia duplicados, siempre me quejo de éstos:

  • System.IO
  • System.Runtime
  • System.Threading.Tasks

Por ahora tienes que quitar manualmente esto de los dos proyectos, con el fin de conseguir que compilen, seguro más adelante van a solucionarlo.

Ahora tenemos que añadir algo de código de inicialización para hacer que las referencias funcionen, todo lo que hemos agregado solo se despliega en tiempo de compilación. Esta es la única parte del código específico para cada plataforma que vamos a escribir.
En el proyecto de iOS, abre el archivo AppDelegate.cs para añadir dos líneas al método FinishedLaunching, después de la línea Forms.Init():

Estas dos líneas realizan la inicialización necesaria para Azure Mobile Services y SQLite, respectivamente.

En el proyecto Android, abrir el archivo MainActivity.cs y añadir una línea para inicializar Azure Mobile Services:

Para hacer que todo esto funcione en Windows Phone 8 tienes que instalar SQLite para Windows Phone. En Visual Studio, selecciona Extensiones y actualizaciones desde el menú Herramientas, buscar "SQLite for Windows Phone" e instalarlo.

A continuación vamos a configurar las carpetas para el uso de MVVM, así que añadimos las siguientes carpetas en el proyecto PCL:

  • Services
  • Models
  • ViewModels
  • Views

No te sorprendas, SÍ! Así es, la carpeta Views ahora se sitúa en el PCL, gracias a Xamarin Forms. Dentro de la carpeta Models crea una clase Contacto, de la siguiente manera:

Esto te debería resultar familiar si es que leíste el artículo anterior. El único cambio que hay que destacar, es la incorporación de la propiedad Version. Esta es requerida por el manipulador de sincronización.
El siguiente paso es agregar una clase DataService en la carpeta Services. Allí tendremos que definir la conexión al servicio móvil de la siguiente manera:

Luego agregaremos un método genérico GetAll(), que simplemente devuelve la totalidad del contenido de la tabla de Contacto.

También pondremos en un método genérico en Guardar.

Si te das cuenta hay una línea comentada en estos dos métodos: MobileService.GetTable ()

Esta línea es la que necesitarás siempre y cuando tengas la versión estable de Azure Mobile Services, si estás utilizando una versión de los componentes Azure Mobile Services que no tiene capacidad de sincronización offline (es decir, pre 1.3), entonces utiliza la línea comentada.
De lo contrario utiliza la línea que está debajo, es decir: GetSyncTable ().

Luego agregaremos un método genérico Pull() (no necesitarás esto si estás usando algo menor a la versión 1.3).

Como un ejemplo del uso de esta característica, escribiremos algo código en el método GetAll() para guardar los datos descargados desde el servicio móvil en la base de datos local antes de que la base de datos local los lea y los muestre. En la práctica, tal vez ustedes hacen algo mejor, así que espero sus push request en el repositorio de GitHub. La línea que hay que añadir al método GetAll() es la siguiente:

Ahora tenemos que hacer un poco de inicialización en el constructor de la clase DataService.

Tú necesitará los siguientes espacios de nombres para resolver algunos errores:

La última cosa que hacer aquí es añadir un método que inicialmente rellenará la tabla Contactos por nosotros.

Ahora que la clase DataService está lista vamos a crear una interfaz haciendo clic derecho sobre "DataService” en la declaración de clase y seleccionando 'Refactor ' y luego 'Extraer Interface'. Como se muestra en la imagen:

Lo único que hay que hacer aquí, es hacer pública la interfaz resultante, y guardar todo.

La última cosa que haremos en la carpeta Services es agregar una clase ServiceLocator simple, algo como esto:

A continuación, agrega un ViewModelLocator similar en la carpeta ViewModels.

Ahora podemos pasar al ViewModel del patrón MVVM. En primer lugar, agrega una clase BaseViewModel a la carpeta ViewModels, como la siguiente:

Verán que me gusta usar regiones (no me juzguen), las uso, pero con moderación. Ahora podemos añadir la clase ListaContactosViewModel en la carpeta ViewModels.

He puesto en un constructor sin parámetros, lo que se va a utilizar. Esto hará uso de la clase estática ServiceLocator para encontrar el servicio de datos. Sin embargo, también he añadido un constructor que recibe el servicio como parámetro, por si trato de mejorar esto algún día y trato de hacer algo de inyección de dependencias.

Aparte, vemos que esto es un viewmodel muy sencillo - no hay una propiedad ObservableCollection que vamos a unir a una lista en la vista, y no hay un método para mostrarlo al hacer una llamada asincrónica al servicio de datos.
Ahora haremos la magia de Xamarin Forms. Agregar una Pagina Forms Xaml a la carpeta Views y llamarla ListaContactosView.

Esto te creará los archivos ContactosView.xaml y ContactosView.xaml.cs, como era de esperar si has desarrollado aplicaciones Windows Phone (o WPF o Silverlight).

Abre el archivo XAML y cámbialo a este aspecto:

Este código, hace binding a la lista de la propiedad Contactos en el ViewModel, y define la plantilla a utilizar, en cada celda de toda lista se mostrarán los bindings de dos propiedades de la clase Contacto, en este caso sólo Nombre y Apellido.

Ahora tenemos que poner algo en el Code Behind. Recuerda que no estamos utilizando el MvvmCross esta vez (o cualquier otro framework MVVM) así que tenemos que hacer los bindings manualmente.

Eso es todo lo que tenemos que hacer en la vista. Ahora en el archivo App.cs del proyecto PCL tenemos que indicar que la vista que hemos creado se va a mostrar cuando inicie nuestra aplicación.

Ahora tienes un proyecto para las tres plataformas que puede guardar datos de manera offline y luego sincronizarlos cuando tengas una nueva conexión. Está demás decir que está basado en mi artículo anterior, así que si estás un poco perdido puedes revisarlo, adicionalmente utilizamos el SDK de Windows Mobile Services en su versión Pre-Release 1.3.
Puedes modificar el código o descargarlo desde mi perfil de GitHub, espero te sirva, disfrútalo y modifícalo. Tú eres el genio!

Más información:
Para obtener detalles sobre cómo manejar los conflictos de sincronización revisa esto:
http://azure.microsoft.com/en-us/documentation/articles/mobile-services-windows-store-dotnet-handling-conflicts-offline-data/

Esta página también es digna de una mirada, y también tiene algunos enlaces útiles:
http://msopentech.com/blog/2014/06/09/azure-mobile-services-offline-adds-xamarin-support-using-sqlitepcl/

Un chico con una gran experiencia en el arte del desarrollo software. Desarrollador de aplicaciones de móviles, especialista en ASP.Net, Xamarin y tecnologías de computo en la Nube en especial Azure.

Comentarios