Seguro que has oído hablar de el patrón de arquitectura MVVM.
Ampliamente usado por multitud de proyectos, el patrón de arquitectura MVVM es cada vez más usado dentro del desarrollo de software para las plataformas de Apple.
En este articulo descubrirás sus orígenes, y la forma en cómo se implementa, además, si te ha sabido a poco, te ánimo a que entres en Campus iOS Online y descubras por ti mism@ toda la potencia de este patrón de arquitectura para desarrollar software.
¿Empezamos?
MVVM
Ya hablé de este patrón de arquitectura en el episodio 14 de mi podcast: «Haciendo Apps», puedes escucharlo aquí, o bien leer el articulo en el que está basado el capitulo.
En este capitulo y en el articulo del blog, hablé sobre diferentes patrones de arquitectura, entre ellos este que nos ocupa, el MVVM.
Así que más que hablar sobre el propio patrón, en este articulo te hablaré sobre las diferentes formas de usarlo en un proyecto de iOS.
Modelo, Vista, Modelo de vista
Quizá ya conozcas MVC (Modelo, Vista, Controlador) pues es el patrón de arquitectura más extendido dentro del mundo del desarrollo iOS, sobre todo porque cuando uno empieza en esto, casi todos los ejemplos y formaciones lo usan.
De hecho Apple lo usa en prácticamente todos sus ejemplos cuando el ejemplo práctico está realizado con Swift y UIKit.
El patrón MVVM fue creado por Microsoft allá por el año 2004, en realidad es una actualización de MVP (Modelo, Vista Presentador), añade y cambia la capa del presentador, por una capa extra que es el modelo de vista.
Así, por un lado tendríamos el modelo, la vista, y esta capa que conecta los datos con la interfaz gráfica, denominada modelo de vista.
Un pequeño inconveniente
Hay un pequeño problema aquí, y es que el patrón de arquitectura MVVM fue diseñado por Microsoft, y para ser usado con una tecnología llamada «Windows Presentation Foundation».
Este Framework, WPF, une de forma casi mágica la capa de la vista con su modelo, es decir que añade unos enlaces «per sé» entre los objetos gráficos y el modelo de vista.
Lógicamente, para desarrollar software para los dispositivos de Apple, y más concretamente para usar el patrón de arquitectura MVVM, no disponemos de este Framework dentro del ecosistema de desarrollo de Apple, por lo que para crear está «unión» necesitamos utilizar herramientas adicionales.
Es decir, necesitamos que la vista esté al tanto de los cambios en nuestro modelo, y nuestro modelo necesita estar al tanto de los cambios e interacciones que el usuario o usuaria realizan en la vista.
Si bien es cierto que podemos aplicar este patrón sin utilizar esta característica, o al menos no usándola de la forma en la que este patrón de arquitectura fue concebido, dicho de otro modo, podemos separar las diferentes capas en modelo, vista, y el modelo de la vista, pero no lo estaremos haciendo de una forma reactiva, si es la vista la que tiene que informar a su modelo de forma proactiva, o si es el modelo de vista el que tiene que actualizar la vista sin que esta sea observada.
Usando el patrón de arquitectura MVVM en iOS
Así, para crear esta unión y que exista esta digamos comunicación entre la vista y el modelo de la vista, necesitamos «bindear» ambas capas, para este fin, existen varías alternativas que vamos a ver enseguida.
Podemos crear estos enlaces de forma manual creando observables y enlazando estas propiedades a los diferentes elementos gráficos, también podemos usar algún Framework de terceros como Bond, por último, podemos ir a Frameworks más avanzados como RxSwift.
Crear los enlaces de forma manual
Se pueden crear enlaces de forma manual, es un poco tostón, todo hay que decirlo, pero podemos crear una clase observable con genéricos para que tanto el modelo como la capa visual estén conectadas.
Tomo como referencia el ejemplo que Paul Hudson pone en algún sitio de su inmenso contenido formativo:
class Observable<ObservedType> {
private var _value: ObservedType?
var valueChanged: ((ObservedType?) -> ())?
init(_ value: ObservedType) {
_value = value
}
public var value: ObservedType? {
get {
return _value }
set {
_value = newValue
valueChanged?(_value)
}
}
func bindingChanged(to newValue: ObservedType) {
_value = newValue
print("Value is now \(newValue)")
}
}Si tuviera que crear los enlaces a mano, sin duda descartaría este patrón de arquitectura. Es mucho más cómo usar un framework de tercero como es Bond, o lanzarte al inmenso mundo de RxSwift.
MVVM con Bond
Bond es un Framework para crear enlaces en un patrón de arquitectura como MVVM.
Podemos «bindear» de una forma relativamente sencilla los elementos de nuestra vista con nuestro modelo de vista, de forma que bajo el paradigma de la programación reactiva, ambas capas estén vinculadas.
Podría poner algún ejemplo de uso de este Framework, pero lo mejor será que mires la documentación y el Framework mismo desde su repositorio de GitHub.
MMVM con RxSwift
RxSwift es una bestia parda.
Cuando alguien decide usar este Framework entra en un mundo de magia, un mundo de fantasía ideado por una mente perversa y hostil, bromas aparte, mi recomendación es que no uses RxSwift si únicamente quieres crear un pequeño proyecto con MVVM.
RsSwift es un fantástico Framework, inmenso y muy poderoso, pero si sólo quieres unir la capa visual con el modelo de vista, quizá sea demasiado.
Recomiendo usar RxSwift para algo mas que solo para programar de forma reactiva y conectar la capa visual con el modelo de vista, cuando implementas Rx en tu proyecto, pasa a dominarlo todo, la capa visual, la capa de conexión, la comunicación entre las diferentes piezas como interactors y repositorios, etc.
Tienes toda la info sobre RxSwift en su repositorio de Github.
Domina MVVM
He publicado un nuevo módulo en Campus iOS Online, dónde te enseñaré a utilizar el patrón de arquitectura MVVM de diferentes formas, con ejemplos prácticos, y resolución de dudas en nuestro grupo privado de Facebook.
Cada semana publicaré 3 nuevas clases, nutriendo de más contenido formativo a las más de 200 horas disponibles dentro de la plataforma.
¿Todavía no estás dentro del Campus?