Jaa


#retosMSDN: Solución al Reto 3 de Navidad - Creando una aplicación para resolver Sudokus con Visual Studio

En el primer #retosMSDN de Navidad te propusimos crear una API REST de Sudokus que dado un tablero de Sudoku clásico de 9x9 completa o parcialmente relleno nos dijese si todos los números introducidos están en una posición válida. Aquí tienes su solución. En el segundo te propusimos crear un sitio web que consumiese esa API. Aquí tienes su solución. En el tercero te propusimos crear una aplicación que consumiese esa misma API, y esta es la solución que nosotros hemos creado para este último reto. Esperamos que te hayas entretenido tanto como nosotros.

 

Nuestra Solución

En esta ocasión hemos optado por la creación de una Universal App para Windows Phone 8.1 y Windows 8.1 con C# y XAML.

Este es el aspecto que tiene al ejecutarse en Windows Phone 8.1:

image

Y este el aspecto que tiene al ejecutarse en Windows 10:

image

 

Esta app ha sido creada siguiendo el patrón MVVM con sus vistas, vista-modelo y modelos correspondientes (carpetas Views, ViewModels y Models). No era realmente necesario hacerlo para una app de este tamaño, pero queríamos que tuvieses una solución lo más completa posible. Así que en esta solución, además de la estructura básica de MVVM, podrás encontrar lo siguiente:

  • Implementación del interfaz INotifyPropertyChanged para el binding de datos en las vistas (clase ObservableObject).
  • Uso de la clase RelayCommand de MVVM Light para el binding de comandos en las vistas, incluyendo el uso de CanExecute en los comandos.
  • Uso de servicios para las partes dependientes de la plataforma que no podemos poner en los vista-modelo o en los modelos (carpeta Services). Uno de estos servicios es el que nos permite acceder a la API REST (clase SudokuService).
  • Un servicio que proporciona a cada vista su vista-modelo correspondiente (clase ServiceLocator). Para la inyección de dependencias de los vista-modelo (los servicios que necesita) utiliza Unity.
  • Un servicio que nos permite navegar entre las diferentes vistas desde los vista-modelo (clase NavigationService).
  • Un servicio que nos permite enviar mensajes desde los vista-modelo a las vistas (clase MessagingService). Internamente utiliza MVVM Light.
  • Todos los vista-modelo heredan de una clase BaseViewModel que nos permite notificar a un vista-modelo cuando se navega a su vista o desde su vista se va a otra.
  • Todas las vistas heredan de una clase BasePage que utiliza las clases NavigationHelper y SuspensionManager que crea Visual Studio al añadir una nueva página básica, y que sirven para ayudarnos en la navegación entre páginas y en la gestión del ciclo de vida de la app. Si quieres saber más sobre estas clases que crea Visual Studio y su uso, te recomiendo echarle un vistazo a los capítulos 3 sobre navegación y 7 sobre ciclo de vida de nuestro curso online gratuito Building Apps for Windows Phone 8.1 Jump Start.

 

La solución verás que está formada por 4 proyectos:

  • SudokuApp.Portable: es una librería portable (PCL – Portable Class Library) que contiene todo el código que es reutilizable entre plataformas tan dispares como son las Universal Apps, aplicaciones de escritorio hechas con WPF o apps hechas para iOS y Android con Xamarin:

image

En esta librería puedes encontrar los vista-modelo y modelos de la app, así como las clases base ObservableObject y BaseViewModel. También puedes encontrar algunos servicios que en principio serían dependientes de plataforma, pero que gracias a que usan clases de librerías que son portables en sí mismas (como MVVM Light o Json.NET) también pueden ser reutilizados entre todas las plataformas mencionadas: MessagingService y SudokuService.

  • SudokuApp.Shared: es un proyecto compartido por los proyectos SudokuApp.WindowsPhone y SudokuApp.Windows y contiene todo el código particular de las Universal Apps y que es compartido por Windows Phone y Windows. En este proyecto puedes encontrar los servicios dependientes de la plataforma que usan los vista-modelo (NavigationService), el servicio especial ServiceLocator, clases base como BasePage, e incluso el code behind de las vistas de Windows Phone y Windows que en este caso es común.
  • SudokuApp.WindowsPhone y SudokuApp.Windows: son los proyectos de las apps de Windows Phone y Windows y que contienen el código particular para cada una de estas plataformas. En este caso lo único que no hemos compartido son los XAML de las vistas, que aunque son realmente parecidos los hemos adaptado a cada plataforma. Podríamos haber compartido partes e incluso todo el XAML entre Windows Phone y Windows, pero hemos decidido no hacerlo por simplicidad.

 

En resumen, en esta Universal App hemos podido reutilizar todo el código entre Windows Phone y Windows, y lo único que no hemos reutilizado son los XAML de las vistas. Además, si quisiésemos, podríamos reutilizar bastante código a la hora de hacer una versión para escritorio con WPF o para iOS y Android con Xamarin (especialmente si utilizamos Xamarin.Forms), todo gracias al uso de una PCL.

 

El código completo lo puedes encontrar en esta solución de Visual Studio 2013 que puedes descargarte de GitHub. Y si tienes cualquier duda sobre la solución, no dudes en ponerte en contacto con nosotros en esmsdn@microsoft.com.

Un saludo,

Alejandro Campos Magencio (@alejacma)

Technical Evangelist

PD: Mantente informado de todas las novedades de Microsoft para los desarrolladores españoles a través del Twitter de MSDN, el Facebook de MSDN, el Blog de MSDN y la Newsletter MSDN Flash.