fbpx
 

Patrón de Diseño Model View Controller: MVC

Patrón de Diseño Model View Controller: MVC

1. Introducción

Esta semana vamos a hablar de MVC.

Cuando empiezas en el mundo del Desarrollo iOS, te encuentras con una montaña de información nueva.

Debes aprender un nuevo lenguaje de programación, ya sea Swift u Objective-C, dominar Xcode, conocer los fundamentos de las Aplicaciones iOS, comprender el funcionamiento de los frameworks más importantes, etc, etc…

Debes ser capaz de ir dominando todos estos aspectos si quieres avanzar como Desarrollador iOS.

Todos son importantes.

No tiene sentido ser un ninja de Swift si luego no sabes ni crear un nuevo proyecto en Xcode. No sirve para nada, conocer perfectamente el funcionamiento de las Aplicaciones iOS si luego no eres capaz de escribir ni una linea de código porque no conoces el lenguaje.

Por tanto, debes ser capaz de avanzar en cada una de estas áreas si quieres ir aumentando tus poderes como Desarrollador iOS.

Existiendo tanto por aprender, es normal que MVC sea uno de los principios fundamentales a los que se le da menos importancia.

Sin embargo, desde mi punto de vista, comprender los principios fundamentales de MVC debería ser uno los primeros conceptos en los debería centrarse alguien que comienza en Desarrollo iOS.

Este artículo va a ser algo diferente al resto de posts que suelo publicar cada Lunes.

Normalmente tratamos algún tema concreto y desarrollamos una aplicación o parte de una aplicación poniendo en práctica la teoría que hemos visto.

Esta semana no.

Esta semana veremos en profundidad el patrón de diseño Model View Controller. Creo que es algo lo suficientemente importante como para desarrollarlo en un artículo completo.

Este post intenta explicar MVC de forma que puedas entender este patrón de diseño y en consecuencia comprendas mucho mejor la arquitectura de una aplicación iOS.

2. ¿Qué vamos a ver en este artículo?

Estos son algunos de los puntos más importantes que vamos a tratar:

  • ¿Qué es un Patrón de Diseño?
  • ¿Qué es MVC?
  • ¿Por qué debes usar MVC en tus aplicaciones iOS?
  • ¿Cuales son las capas que componen MVC?
  • ¿Cómo funciona una app con MVC?
  • Consejos que debes seguir para implementar correctamente MVC
  • Otros patrones de diseño

Si crees que alguno de estos temas puede interesarte, ¡adelante!

3. Patrones de Diseño

Antes de comenzar, es importante que veamos que se entiende por Patrón de Diseño.

[caja-gris]Un Patrón de Diseño es una solución reutilizable a problemas recurrentes que nos encontramos en el diseño de software[/caja-gris]

Puede que esta definición te haya dejado igual.

Dicho de una forma más coloquial, puedes quedarte con que un Patrón de Diseño determina una forma concreta de trabajar que nos permite evitar problemas a los que tendríamos que enfrentarnos si no lo utilizáramos.

Es decir, usar MVC facilita el trabajo del Desarrollador a la hora de diseñar aplicaciones iOS.

Por tanto, mi consejo si estás empezando en el desarrollo de aplicaciones iOS es:

[caja-roja]Acostúmbrate a utilizar siempre MVC en tus aplicaciones iOS[/caja-roja]

Ahora que ya conoces en que consiste un patrón de diseño, veamos MVC.

4. ¿Qué es MVC?

MVC es probablemente el rey de los patrones de diseño en iOS.

Existen otros patrones de diseño en iOS como:

  • Delegation
  • Singleton
  • KVO

Seguramente en otros artículos hablaremos de algunos de estos patrones de diseño. En el artículo de esta semana nos centraremos en MVC.

MVC son las siglas de Model-View-Controller.

Su filosofía es muy simple:

“Debes dividir tu software en 3 capas distintas y separadas, donde cada capa tiene una única responsabilidad

¿Y cuales son estas 3 capas?

• Model

• View

• Controller

La capa Model es donde almacenamos los datos de nuestra aplicación. Las clases que gestionen la persistencia de datos, los objetos modelo, los parsers… deberían ser clases de tipo Modelo.

La capa View es la cara de nuestra app. Es la encargada de definir la interfaz de nuestra aplicación. Sus clases deben ser reusables, es decir, no deberían depender de ningún tipo de lógica. Un ejemplo claro de una clase de tipo View sería UILabel.

La capa Controller es la intermediaria entre el Model y la View. Su principal misión es mantener sincronizadas ambas capas. Un ejemplo claro de una clase de tipo Controller sería UIViewController.

Existe mucha gente que considera a los UIViewControllers parte de la capa View, debido a que se encuentran fuertemente emparejados con su view.

Cuando estas 3 capas trabajan juntas, lo que conseguimos es esto:

 

mvc-esquema

 

Como puedes ver en el esquema, las capas Model y View no se comunican directamente, sino que utilizan la capa Controller como intermediario.

Vamos a ver más en detalle cada una de las capas.

5. Model (Modelo)

Hemos dicho que la clase Modelo encapsula los datos de nuestra aplicación.

Un objeto modelo puede representar un personaje en un videojuego o un contacto en una aplicación de agenda telefónica. Un objeto modelo puede mantener relaciones 1-1 o relaciones 1-N con otros objetos modelo. Muchas veces los objetos modelo suelen almacenarse en disco, utilizando para ello algún sistema de persistencia. Si no tienes claro el concepto de persistencia, te recomiendo que eches un vistazo a este tutorial. Lo ideal es que los objetos modelo no tengan conexión con los objetos view que presentan los datos, de esta forma, pueden reutilizarse siempre que lo necesitemos.

Si desarrollamos una aplicación iOS, estos podrían ser diferentes componentes de nuestra app que pertenecerían a la capa del Modelo:

  • Capa de Comunicaciones: Se trata del código que utilizaremos para gestionar las comunicaciones de nuestra app. Podríamos utilizar librerías externas como AFNetworking o Alamofire o directamente trabajar con las clases nativas de Cocoa Touch. Lo ideal sería gestionar todas las conexiones de red de nuestra aplicación a través de una única clase, aunque sabemos que la mayoría de las veces eso no suele ser así.
  • Sistema de Persistencia: Se trata del código que usamos para persistir nuestros datos. Aquí podremos utilizar Core Data, NSUserDefaults o trabajar directamente con una base de datos SQLite. Si quieres ampliar tus conocimientos sobre persistencia en iOS, te recomiendo de nuevo este tutorial: http://www.efectoapple.com/tutorial-introduccion-core-data-parte-1/
  • Capa de Conversión de Datos: Aquí incluiremos el código de parseo que convertirá las respuestas del servidor en objetos de nuestro modelo.

Mientras que los objetos del modelo de nuestra app y capa de parseo serán específicos de la aplicación que estamos desarrollando, hay que tener en cuenta que debemos intentar que nuestra capa de comunicaciones sea lo más reutilizable posible.

6. View (Vista)

Un objeto View es cualquier objeto de la aplicación que los usuarios pueden ver. Un objeto view sabe como debe mostrarse en pantalla y puede responder a acciones del usuario. La responsabilidad principal de un objeto view es mostrar los datos del modelo y ofrecer la posibilidad de modificar dichos datos. A pesar de esto, los objetos view deben desacoplarse de los objetos modelo en una aplicación con MVC.

Si estuviéramos trabajando en el desarrollo de una aplicación iOS, aquí tienes algunos componentes que pertenecerían a la capa View:

  • Cualquier subclase de UIView. Esto comprende cualquier elemento que utilices para crear la interfaz de tu aplicación.
  • Animaciones y transiciones entre view controllers.
  • Cualquier clase que sea parte de UIKit/AppKit, Core Animation y Core Graphics.

Puedes hacerte las siguientes preguntas si quieres comprobar si tu capa View está correctamente diseñada:

  • ¿Entra en contacto directo con la capa Model?
  • ¿Contiene algún tipo de lógica de negocio?
  • ¿Realiza alguna función que no esté relacionada con la interfaz de usuario?

Si has respondido “” a alguna de estas preguntas, es probable que puedas refactorizar tus clases.

Debes intentar que las clases de la capa View sean lo más reutilizables posible. Si eres capaz de lograrlo, podrás distribuirlas de forma independiente a tu aplicación. Tienes cientos de ejemplos de desarrolladores que ofrecen las interfaces de sus apps o parte de ellas para que el resto las podamos utilizar en nuestros proyectos aquí mismo.

7. Controller (Controlador)

Un objeto Controller actúa como intermediario entre uno o más objetos View y uno o más objetos Model. Los objetos controller son, por tanto, un intermediario a través del cual los objetos view reciben los cambios del modelo y viceversa. Los objetos controller también pueden realizar tareas de configuración y coordinación de una aplicación, administrando el ciclo de vida de otros objetos.

En el caso de una aplicación real, lo normal es que formen parte de esta capa, las clases que realicen funciones de este tipo:

  • ¿Cual es la siguiente pantalla que debo mostrarle al usuario?
  • ¿Qué operaciones debo realizar si la aplicación pasa a segundo plano?
  • ¿Cada cuanto tiempo debo actualizar la app?
  • ¿Debo recuperar los datos de mi sistema de persistencia o directamente del servidor?

Debes pensar en la capa Controller como el cerebro de tu aplicación. Ella es quien decide lo que sucederá a continuación.

8. Funcionamiento de una aplicación con MVC

El funcionamiento interno de una aplicación iOS diseñada con MVC podría ser este:

  • Un usuario actúa sobre la interfaz de nuestra app, pulsando uno de los botones.
  • La View de nuestra app comunica al Controller que el usuario ha realizado la acción de pulsar el botón.
  • El Controller ejecuta la lógica asociada a esa acción.
  • Si esa lógica está asociada a modificaciones de los datos de la aplicación, el Controller actualiza el Model.
  • Como el Controller ha modificado el modelo, es probable que haya que actualizar la View que muestra esos datos al usuario, por lo que el Controller actualiza también la View para mostrar los nuevos datos.

También puede suceder el proceso contrario. Es decir, que los cambios comiencen por el Model.

Imagina que abres la aplicación de Facebook. Esta aplicación recibe a través de la conexión de red las últimas publicaciones de tu muro. Es decir, el modelo de la aplicación acaba de recibir nuevos datos. Por tanto el modelo lo que hace es notificar al controlador los cambios que ha recibido y el controlador actualiza la vista para mostrarle al usuario las últimas publicaciones disponibles.

Este sería un pequeño resumen de como funcionan las aplicaciones iOS a través de MVC.

9. No caigas en la trampa del Massive View Controller

Cuando comienzas a implementar MVC en tus aplicaciones aparece una posibilidad que puede echar a perder toda la arquitectura de tu app.

Se trata de comenzar a incrementar las funcionalidades de tus view controllers, haciendo que empiecen a acumular responsabilidades que no pertenecen a su capa.

Empiezas diciendo:

“No pasa nada porque incluya esta llamada a servidor directamente en este view controller…”

Dos días después piensas:

“Si incluyo directamente el parseo de la respuesta tampoco creo que pase nada…”

Al poco tiempo, has conseguido que los view controllers de tu app tengan cientos de lineas, realicen funciones que no son de su responsabilidad, sean totalmente inmanejables y hayas creado un código que sea imposible de mantener y evolucionar. Si sigue este camino, la arquitectura que habrás utilizado será Massive View Controller en lugar de Model-View-Controller.

Este es el motivo principal por el que un gran número de desarrolladores critican MVC y prefieren no utilizarlo en sus aplicaciones. Sin embargo, si utilizas correctamente MVC no deberías de tener este tipo de problemas.

Aquí tienes algunos consejos para que no caigas en la trampa del Massive View Controller:

  • Tu view controller debe ser responsable de responder a acciones que el usuario realiza en la view de tu aplicación
  • Tu view controller debe ser responsable de actualizar el modelo de tu aplicación
  • No debes incluir cosas como UITableDataSource o UITableViewDelegate dentro de tu view controller
  • Lo mejor es que no realices operaciones de comunicación con servidor directamente en tu view controller
  • Está totalmente prohibido añadir métodos de parseo de datos dentro de tu view controller

10. ¿Es MVC el único patrón de diseño que puedo utilizar?

La respuesta a esta pregunta es evidente y seguro que ya la imaginas.

MVC no es el único patrón de diseño que puedes utilizar en tus aplicaciones iOS.

Existen muchos otros como MVP, MVVM, Viper… que trataremos con detalle en otro artículo.

Si eres alguien curioso, es probable que busques información sobre estos conceptos, sin embargo, si estás comenzando en el Desarrollo iOS te recomiendo que comiences con MVC.

Lo mejor es que lo pruebes por ti mismo.

Intenta ajustar el código de tus aplicaciones a las “reglas” que hemos visto en este artículo. Si de verdad intentas respetar este patrón de diseño en tus proyectos, verás como cada vez consigues un código mas útil, reutilizable, optimizado y fácil de mantener.

Está bien que veas otras formas de hacer las cosas, pero yo esperaría hasta dominar MVC para abrir esa puerta.

11. Conclusiones Finales

Hemos visto desde lo más básico, como la definición de un Patrón de Diseño, hasta consejos para que puedas implementar correctamente MVC en tus aplicaciones.

Si estás comenzando en el Desarrollo de Aplicaciones iOS, es muy importante que mientras desarrollas tus proyectos tengas siempre en tu cabeza MVC. Te acostumbrarás a trabajar de una forma determinada que te evitará muchos dolores de cabeza en el futuro.

12. ¿Donde ir ahora?

Puedes acceder a la Biblioteca de Tutoriales de EfectoApple desde aquí.

Si este artículo te ha parecido útil, me harías un gran favor compartiéndolo en tus redes sociales.

Como siempre, para cualquier duda, tienes los comentarios a tu disposición.

Recuerda, cada lunes un nuevo Tutorial sobre Desarrollo iOS.

Esto ha sido todo, gracias por leer EfectoApple.

Etiquetas:
4 Comentarios
  • david
    Publicado a las 03:43h, 06 octubre Responder

    muy buen articulo, me gusto mucho.
    en verdad felicidades por compartir el conocimiento.
    he leído varios de tus tutoriales y la informacion es muy clara de verdad muchas gracias.

    como petición podrías tener un tutorial con el desarrollo de un app con el patrón MVC para concluir por favor.
    ya que el punto que dice
    No debes incluir cosas como UITableDataSource o UITableViewDelegate dentro de tu view controller. me dejo con preguntas entonces ¿dónde lo pongo? o ¿como los uso?

    • Luis R
      Publicado a las 09:56h, 25 octubre Responder

      Hola David.

      Gracias por tu comentario.

      Tienes toda la razón, se necesita un Ejemplo Práctico sobre MVC. Ver como desarrollar alguna parte de una App siguiendo este Patrón.

      Lo anoto para un futuro Tutorial.

      Gracias.

  • Misael Landero
    Publicado a las 17:26h, 11 mayo Responder

    Hola excelentes totorales, me acabo de iniciar en el mundo de la programación en Swift y tus artículos son una Joya, muchas gracias.

  • Cristobal Gómez
    Publicado a las 18:59h, 24 abril Responder

    Hola que tal, muy interesante el artículo. Leí que ibas a incluir un Ejemplo Práctico sobre MVC, de pronto ya lo tienes? la verdad que no lo encuentro en la plataforma de efecto apple.

    Saludos

Escribe un comentario

10AppsIpad

Descarga las 10 Aplicaciones

Introduce tu Nombre y tu Email para recibir las Apps en tu Correo

Acabo de enviarte un email. Sigue las instrucciones para descargar las Aplicaciones. Puede que tengas que revisar tu buzón de correo no deseado. Gracias.