Desarrollo de aplicaciones

mviles multiplataforma con

C# - Xamarin VS
3: Estructura y organizacin de una aplicacin
E.J. Hernndez Valdelamar
Marzo, 2016

Sesin 3 - Objetivo

Analizar un ejemplo con elementos ms complejos,

para revisar tcnicas adicionales de programacin.
Analizar la organizacin del cdigo de una solucin un
poco ms compleja.
Exponer algunas estrategias para el desarrollo de
software multiplataforma.
Plantear una arquitectura bsica para una aplicacin
multiplataforma y estructurar el cdigo usando PCL's

Contenido

Primero lo primero: Xamarin para todos!

Actualizacin de una instalacin previa

Compartiendo cdigo entre plataformas

Portable class libraries y shared projects

El arte de disear aplicaciones

Caso de estudio: MVVM con Xamarin Forms

Comentarios

The Pinball Wizard in a miracle cure!

31. mar. 2016
Microsoft ha anunciado que Xamarin comienza a estar disponible de manera gratuita para los
usuarios de las diferentes ediciones de Visual Studio: Visual Studio Community Edition (gratis),
Visual Studio Professional y Visual Studio Enterprise.
http://wwwhatsnew.com/2016/03/31/xamarin-ahora-disponible-para-todos-los-usuarios-de-visual-studio-de-forma-gratuita/

Hace apenas diez das desde que Microsoft compr Xamarin y todo el mundo se preguntaba
por las intenciones que tena Microsoft para Xamarin. Pues hoy Scott Guthrie ha indicado que
Xamarin pasa a ser gratuito para todas las ediciones de Visual Studio incluyendo la edicin
Community.
Adems al igual que ASP, Xamarin pasa a ser de cdigo abierto y estar en la .NET
Foundation. Xamarin pasa a ser de cdigo abierto y multiplataforma. Los servicios de Xamarin
estn disponibles junto con las posibilidades de DevOps.
http://www.microsoftinsider.es/101970/xamarin-es-gratuito-para-todos-los-usuarios-de-visual-studio/

https://store.xamarin.com

Y de repente...

Me vuelvo a firmar, pero parece que sigue en modo trial

Entonces hay que volver a

instalar TODO?

NOTA: esto aplica si tienen previamente instalado el Xamarin

Segn la informacin que se encuentra en esta liga
https://developer.xamarin.com/recipes/cross-platform/ide/change_updates_channel/
En el menu de VS en Tools/Options, estn las opciones de Xamarin, y en Other se
encuentra un Check Now que revisa si hay actualizaciones disponibles.

En efecto, despus de la actualizacin, la cuenta la pone como

VISUAL STUDIO (Community, Professional o ENTREPRISE )
As que no ms trial ;)

Rascando la superficie

Al momento, usando una

solucin de tipo Xamarin
Forms Portable, solo se ha
explorado la parte de
cdigo de UI compartido y
algunas particularidades
para Android.
Falta descubrir todo lo que
implica la base del
tempano, donde se debe
colocar la funcionalidad de
la aplicacin.

Compartir cdigo entre plataformas

Cuando nos planteemos desarrollar un proyecto multiplataforma uno de

nuestros principales hitos ser conseguir compartir el mximo cdigo
posible entre todas ellas.
As, del mismo modo que compartirn el mismo back-end, compartirn
tambin cierta funcionalidad y lgica.
El hecho de tener un ncleo compartido entre las plataformas y dejar fuera
de ese ncleo solamente lo que inevitablemente es especfico de cada
plataforma (por ejemplo, el diseo de la interfaz de usuario) nos va a
permitir facilitar y agilizar el desarrollo y mantenimiento de ambas
aplicaciones.
No es difcil de imaginar que dos aplicaciones escritas con el mismo
lenguaje de programacin, que comparten parcialmente una misma API y
que funcionalmente hacen ms o menos lo mismo, aunque sobre
dispositivos distintos, tendrn muchos puntos en comn y mucho cdigo,
sin similar, directamente igual.
http://www.techdencias.net/blog/2013/03/12/capitulo-1-de-estrategias-patrones-y-buenas-practicas/

Organizando el cdigo compartido

Tomando como referencia este diagrama de la arquitectura propuesta para una

aplicacin multiplataforma, llama la atencin la nota * donde se hace mencin a las
clases portables o a los proyectos compartidos.

Compartir funcionalidad a travs de

librerias portables

Las PCL (Portable Class Libraries) son libreras que pueden

incorporarse en proyectos para distintas plataformas.
Probablemente, de forma progresiva Microsoft va a ir
aadiendo nuevas clases portables (como recientemente ha
hecho con httpclient) por lo que cada vez vamos a disponer de
ms funcionalidad que de forma directa ser comn entre
plataformas.
La nica y obligatoria premisa es que todo el cdigo del
proyecto debe ser compatible con las plataformas
simultneamente y en todo momento.

Limitaciones de las PCL's

Al momento de crear
una biblioteca portable
se debe elegir sobre qu
plataformas se quiere
que funcione y es quen
es mediante esta
seleccin que se limita la
cantidad de
caractersticas del
framework .NET a las
que se puede acceder.

La biblioteca portable siempre tomar

la menor cantidad de caractersticas
posibles para funcionar en todas las
plataformas elegidas.

http://thatcsharpguy.com/post/que-son-portable-class-library/

Arquitectura con PCL's

PCL - ventajas y desventajas

Ventajas

Permiten compartir
cdigo entre varios
proyectos.
La refactorizacin de
operaciones siempre
actualiza todas las
referencias afectadas.
El cdigo se comparte
mediante DLL's.

Desventajas

No es posible usar
directivas de
compilacin.
Solo es posible usar
un subconjunto del
framework de .Net,
determinado por las
plataformas objetivo.

Cuntos proyectos deben

manejarse?

Dado que al crear un proyecto Xamarin.Forms, el proyecto donde se encuentra el

cdigo de UI compartido es una clase portable, se supondra que lo recomendable es
agregar al menos otro proyecto portable adicional para contener la lgica de la
aplicacin.

Proyectos compartidos (shared

projects)

Este tipo de proyectos (tambin conocidos como

Shared Asset Projects), se usan para organizar el
cdigo, y usando directivas de compilacin #if, se van
administrando los segmentos de cdigo especficos
para cada plataforma.
Funcionan como referencias a archivos de cdigo, por
lo que al compilar, el proyecto compartido es
"copiado" a cada proyecto que tiene su referencia, y
compilado como si fuese parte de l.
Los proyectos compartidos NO pueden referenciar a
ningun tipo de proyecto (incluyendo proyectos
compartidos.)

Directivas de compilacin

Una tcnica que nos permite crear clases que podrn

ser comunes, es el uso de directivas de compilacin.
En ocasiones nos podemos encontrar con que todo el
cdigo de una clase sea igual en ambas plataformas
excepto en unas pocas instrucciones.
Si podemos aislar estas pocas instrucciones podemos
indicar, mediante directivas de compilacin, qu
cdigo debe ser compilado segn si el archivo fsico
(o el enlace directo a ste) est ubicado en un
proyecto.

Ejemplo de uso de directivas

Con las directivas #if #elif #else y #endif podemos indicar el cdigo a compilar en funcin
de la plataforma en la que se encuentre. Esta no es la mejor tcnica, por un lado nos
obliga a tener la clase en un proyecto no PCL, y por otro es poco mantenible.

Arquitectura con proyectos

compartidos

https://docs.xamarin.com/guides/crossplatform/application_fundamentals/building_cross_platform_applications/sharing_code_options/

Proyectos compartidos - ventajas y

desventajas

Ventajas

Permiten compartir cdigo

entre varios proyectos.
El cdigo compartido
puede bifurcarse basado
en la plataforma usando
directivas de compilacin
#if
Los proyectos pueden
incluir referencias a de
una plataforma especfica
que el cdigo compartido
puede usar.

Desventajas

Un proyecto compartido
NO genera un
ensamblado.
Durante la compilacin,
son tratados como parte
del proyecto que los
referenca y son
compilados en esa DLL.
Las refactorizaciones de
cdigo dentro de
directivas inactivas, no
actualizarn ese cdigo.

El arte de disear aplicaciones

En varias de las figuras usadas anteriormente, hay

partes con nombres que hacen referencia a capas en
las que el cdigo es organizado (Data layer, data
access layer, service access layer, business layer).
En otras figuras se mencionan trminos como Models
y ViewModels.
Es claro que es bueno organizar una aplicacin
usando una arquitectura en capas, pero la pregunta
es obligada: cmo se definirn las capas a usar?

Arquitectura basada en capas

El estilo de arquitectura basada en capas se identifica por las

siguientes caractersticas:

Describe la descomposicin de servicios de forma que la mayora

de la interaccin ocurre solamente entre capas vecinas.
Las capas de una aplicacin pueden residir en la misma mquina
fsica (misma capa) o puede estar distribuido sobre diferentes
computadoras (n-capas).
Los componentes de cada capa se comunican con otros
componentes en otras capas a travs de interfaces muy bien
definidas.
Este modelo ha sido descrito como una pirmide invertida de reuso donde cada capa agrega responsabilidad y abstraccin a la
capa directamente sobre ella.

Qu tan complejo se quiere/necesita?

El foco es separar la UI de la
funcionalidad

Un patrn arquitectnico expresa un esquema

de organizacin estructural esencial para un
sistema de software, pero en este caso
conviene hacer nfasis en separar la interfaz
de usuario.
Qu hay en el "men"?

MVC, HMV, MVA, MVP,...

Por cuestiones de exploracin, optaremos por
MVVM

Separar la interfaz de usuario de la

lgica de la aplicacin - MVVM

MVVM es un patrn de diseo que permite

separar la definicin y desarrollo de la UI, del
desarrollo de la lgica y acceso a datos de la
aplicacin.
MVVM facilita y agiliza el desarrollo al mismo
tiempo que permite construir aplicaciones
desacopladas y "testeables".

MVVM - elementos

El modelo (Model) representa el modelo de datos que va a consumir

nuestra aplicacin. Es la capa que se comunica directamente con el
back-end; en l se ubica el cdigo que se responsabiliza de obtener
los datos y exponerlos adecuadamente a sus consumidores.
La vista (View) representa la interfaz de usuario (UI) de la aplicacin,
lo que suele denominarse tambin front-end. Las aplicaciones suelen
componerse de distintas pginas que son mostradas al usuario y
entre las cuales se puede navegar. En MVVM llamamos vistas
(Views) a cada una de estas pginas.
Finalmente, los ViewModel (modelo de la vista) son las clases
responsables de proveer a su correspondiente vista los datos que
debe mostrar segn el estado actual de la aplicacin, y en las que se
define el comportamiento de la aplicacin en respuesta a acciones
del usuario.

MVVM

Por lo general, el cdigo del Model y el del ViewModel no van a tener dependencias de
la plataforma o dispositivo sobre el que se est implementando la aplicacin. Sin
embargo, el cdigo que describe y disea las vistas s que va a tener cierta dependencia
de la plataforma para la que se est desarrollando.

hkhkhk

Caso de estudio

Para realizar un ejemplo se usar lo siguiente:

Solucin Xamarin.Forms Portable

Proyecto PCL de UI compartida

Proyecto PCL para la funcionalidad

Enfoque MVVM

Plataforma objetivo: Android (es la nica que me funciona),

por lo que se desactivaran los proyectos iOS y Win.

Se toma como base el ejemplo que aparece en el artculo "

MVVM in Xamarin Forms". El enfoque me parece interesante
pues no se monta en un framework preconstruido.

App MVVM
Adaptado de
http://www.johankarlsson.net/2014/07/mvvm-in-xamarin-forms.html

MainPageViewModel

Person

App

MainPage

MainActivity

PersonRepository

MVMLib

MVVMTest (PCL)

Test.Droid

Descripciones de las clases

Person: un modelo simple de persona con nombre y

fecha/hora de actualizacin
PersonRepository: repositorio de personas, en versin
memoria, aunque supongo que la intensin es
expanderlo a archivos o una BD.
MainPageViewModel: el puente entre los datos y la
vista, con el agregado de ligarse el botn con un
evento Save, implementando la interfaz
INotifyPropertyChange.
MainPage: vista de la app, con un campot texto, un
label para la actualizacin de fech/hora y un botn
para actualizar.

Nota sobre el uso de interfaces

En una interfaz nicamente se declara la funcionalidad que se

debe desarrollar en las clases que quieran implementar esa
funcionalidad.
En cierto modo, lo que estamos haciendo al definir una interfaz
es abstraer lo que debe hacer (que se define en la interfaz) de
cmo debe hacerlo (que se define en la clase que implementa
esa interfaz).
Retomando el tema de comparticin de cdigo, todo nuestro
cdigo que haga referencia a lo que debe hacer podr ser
comn a ambas plataformas.
Al contrario, el cdigo donde se defina cmo debe hacerlo
deber permanecer en el proyecto especfico de cada
plataforma.

Sin y con interfaces

Una libreria MVM

Creando una ClassLibrary, se tienen como referencias bsicas .Net y

Xamarin.Forms. Este soporte es suficiente para implementar el cdigo
del modelo, el repositorio y el ViewModel.

Un proyecto para las vistas

En el otro proyecto
(que se crea al imicio
como un blank app
Xamarin.Forms) se
coloca la Vista y el
punto de arranque.
Solo falta compilar y
ejecutar...

Y todo iba bien hasta que...

version 51 means Java 7 and version 50 means Java 6. So the warning says that your current
workstation uses an older compiler (java 6) than the recommended version (java 7)
https://forums.xamarin.com/discussion/22102/javac-compiler-warning-when-using-google-play-service-component

Versin 51 significa Java 7 y versin 50 significa Java 6, as que el error indica que actualmente
se estaba trabajando con un compilador mas viejo (Java 6) que la versin recomendada (Java 7).
NOTA: Se recomienda instalar la versin de 32x, aunque si es posible trabajar con una de 64x.
https://vicenteguzman.mx/2015/03/19/error-major-version-51-is-newer-than-50-xamarin-studio/

Validando versin de Java

https://www.java.com/es/download/help/version_manual.xml#winstart

Si tengo la 7 pero solo el JRE supongo Y

luego?

Tengo 1.7 pero en opciones apunta a 1.6

Al darle en Change, sucede que no

tengo el JDK 1.7 :S

Pero...
Parece que al 7 ya no le dan soporte!!!

http://www.oracle.com/technetwork/es/java/javase/downloads/jdk7-downloads-1880260.html
As que vamos por el JDK 8 (de 32 bits)....
http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

Lo raro es que cuando termina la instalacin y se compila en el VS, ya funciona pero no se

cambi la configuracin

Y al fin...

Comentarios

Es una excelente noticia contar con Xamarin y en concreto

con la funcionalidad de Forms, lo cual simplifica el
desarrollo.
El tema del upgrade destapo varios detalles, que al menos
ya quedaron documentados y solventados.
"Divide y vencers": esto aplica a la organizacin del
cdigo, pero no solo haciendo libreras a mansalva, sino
aplicando patrones de arquitectura y de diseo que
mejoren la estructura del cdigo.
Me queda la duda de los escenarios en los que hay que
manipular los proyectos especficos de cada plataforma
(p.ej. .Droid)

Referencias

Building Cross Platform Applications *

Getting Started with Xamarin.Forms *

Desarrollo de Apps Cross-Platform con Xamarin.Forms *

TUTORIAL: Desarrollo de Aplicacin para Android con

Xamarin *
Libreras Portables: Comparte cdigo entre mltiples
plataformas *
A COMPREHENSIVE GUIDE TO CREATING A
XAMARIN.FORMS APP WITH MVVMCROSS *

Referencias (2)

Compilar aplicaciones con interfaz de usuario nativa

mediante Xamarin en Visual Studio *
Captulo 1. De estrategias, patrones y buenas prcticas
(Serie W8 & WP8 Cross-Platform) *

El patrn MVVM *

MVVM Cross *

What is NW.js? *

Sharing code options *

Shared projects *

Referencias (3)

Arquitectura de software y sus beneficios *

Patrones de arquitectura *

Xamarin Forms samples *

MVVM in Xamarin Forms *