XFMoviesDemo: Una aplicación universal con Xamarin Forms y Prism

Xamarin está promoviendo en su universidad desde hace algún tiempo, la utilización de Prism para el desarrollo de aplicaciones con Xamarin Forms. Prism es un viejo conocido de los desarrolladores de Windows Presentation Foundation (WPF), y aunque dicen que más vale malo conocido que bueno por conocer, en este caso se trata de uno bueno conocido que llega, en plena madurez, para hacernos la vida más sencilla en nuestros desarrollos con Xamarin Forms.

Quizás uno de los recursos más potentes que ofrece Prism sea el registro automático de las Views con sus correspondientes ViewModels. No es necesario registrar manualmente en el contenedor IoC los pares <View, ViewModel>, lo cual suele ser un verdadero engorro y origen de bugs cuando nuestra aplicación comienza a crecer. Basta con seguir una serie de convenciones.

Por una parte, las Views y ViewModels deben estar colocadas en sus correspondientes carpetas Views y ViewModels. La explicación es simple: cuando creamos clases en esas carpetas, el namespace se construye de acuerdo con su estructura. Por otra parte, los nombres de vistas y vista-modelos deben terminar en View o ViewModel, según sea el caso. Por último, debemos indicar que deseamos establecer de forma automática la relación de los pares. De esta manera, una instancia de la vista-modelo será asignada automáticamente al DataContext de la vista. Veamos un ejemplo sencillo:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
             prism:ViewModelLocator.AutowireViewModel="True"
             x:Class="XFMoviesDemo.Views.PosterView"
             Title="{Binding Title}">

  <Image Aspect="AspectFit" Source="{Binding Poster}" />
  
</ContentPage>

En este caso, la línea prism:ViewModelLocator.AutowireViewModel=»True» le indica al ViewModelLocator que haga automáticamente todo el trabajo por nosotros.

Prism for Xamarin.Forms ofrece un número considerable de beneficios como por ejemplo, poder utilizar el servicio de dependencias de Xamarin (DepedencyService) de forma desacoplada mediante la inyección de dependencias en el constructor, lo que facilita la ejecución de pruebas de las ViewModels. El patrón utilizado de forma nativa por Xamarin es el ServiceLocator, considerado por algunos como un antipatrón.

El propio James Montemagno reconoce la necesidad de desacoplar el Dependency Service. Al final de su entrada Xamarin Evolve 2016 App Development Retrospective, en la sección What went wrong, comenta:

I love Xamarin.Forms Dependency Service… but I think for testability I shoud have decoupled it and used a custom implementation or Unity for the container.

No pretendo agotar en esta entrada todas las características que hacen de Prism una buena opción a la hora de desarrollar una aplicación multiplataforma con Xamarin Forms, pero sí quiero mostrar el uso de algunas de ellas mediante un ejemplo práctico.

El pasado mes de febrero, la Consultora IT especializada en tecnologías Microsoft, Bravent, organizó en Madrid un evento teórico-práctico sobre Universal Windows Platform, Xamarin y Xamarin.Forms. En el taller práctico se propuso la creación de una app mediante ambas tecnologías, la nativa UWP y la multiplataforma Xamarin.Forms.

Me ha parecido interesante proponer una solución alternativa a las presentadas en el evento, desarrollada con Xamarin Forms y Prism, y que incluya también la plataforma UWP. XFMoviesDemo es una versión Xamarin Forms de la aplicación MoviesDemo, creada para UWP.

XFMoviesDemo ejecutándose en un smartphone Android

Esta app nos muestra cuáles serán los próximos estrenos de cine. Al seleccionar una película, podremos ver información ampliada sobre la misma como, por ejemplo: el género, el director, los protagonistas principales o la fecha prevista de estreno. Por otra parte, si tocamos sobre la imagen del póster, lo veremos ampliado a toda pantalla.

XFMoviesDemo ejecutándose en un smartphone Windows 10 Mobile

La app se muestra de manera consistente en los diferentes dispositivos y sistemas operativos. En todos ofrece un diseño gráfico y experiencia de uso similar, adaptado a cada plataforma.

XFMoviesDemo ejecutándose en un PC con Windows 10

En el caso de Windows 10 en modo escritorio, la app demostrará un comportamiento adaptativo, respondiendo automáticamente a los cambios de dimensiones de la ventana. ¿Quieres saber cómo está hecha? Descárgate el código fuente de la aplicación en GitHub.

Enlaces de interés:

Código del proyecto en GitHub
https://github.com/hinojosachapel/XFMoviesDemo

Prism Samples Forms
https://github.com/PrismLibrary/Prism-Samples-Forms

Sandbox samples
https://github.com/PrismLibrary/Prism/tree/master/Sandbox

Getting started with Prism Xamarin Forms – Preview
https://github.com/brianlagunas/GettingStartedWithPrismXamarinForms-Preview