MVC

Modelo - Vista - Controlador

Diseño de Sistemas

© NMC
Modelo-Vista-Controlador
 MVC es un patrón de diseño orientado a objetos.
 Es un patrón de arquitectura de las aplicaciones software
 Separa la lógica de negocio de la interfaz de usuario
• Facilita la evolución por separado de ambos aspectos
• Incrementa reutilización y flexibilidad

Fue desarrollado en el Centro de Investigaciones Xerox Palo Alto a

finales de los años setenta.
Historia
 Descrito por primera vez en 1979 para Smalltalk
• http://heim.ifi.uio.no/~trygver/themes/mvc/mvc-index.html
 Utilizado en múltiples frameworks
• Java Swing
• Java Enterprise Edition (J2EE)
• XForms (Formato XML estándar del W3C para la especificación de un modelo
de proceso de datos XML e interfaces de usuario como formularios web)
• GTK+ (escrito en C, toolkit creado por Gnome para construir aplicaciones
gráficas, inicialmente para el sistema X Window)
• ASP.NET MVC Framework (Microsoft)
• Google Web Toolkit (GWT, para crear aplicaciones Ajax con Java)
• Apache Struts (framework para aplicaciones web J2EE)
• Ruby on Rails (framework para aplicaciones web con Ruby)
• Etc., etc., etc.
MVC
El Modelo
 Es la lógica de negocio de nuestro software, comúnmente hace
referencia, pero no está limitado a, la base de datos, entidades,
repositorios y consultas.
 Todo lo referente a manipulación de datos en el nivel más bajo, se
encuentra en el modelo, lo que llamamos el CRUD de nuestro sistema
, además de la validación de los mismos
La Vista
 Es la interfaz de usuario, todo lo referente a la presentación de
nuestra aplicación estará de forma organizada en múltiples vistas, en
las cuales no habrá ningún tipo de lógica compleja.
 Las vistas deben estar limitadas a mostrar información únicamente,
con lógica sencilla como: impresión de variables, condicionales y
ciclos para repetir un elemento; toda esta información debe ser
procesada y validada previamente por el controlador y el modelo, de
tal forma que se reduzca al mínimo la programación en la vista.
 En ellas también se asignan formatos especiales a los datos
mostrados, como formato de monedas, fechas, entre otros; ya que
estos datos vienen del modelo guardados en un formato estándar,
queda de parte de la vista mostrarlos de forma amigable al usuario.
El Controlador
 Es el intermediario entre la vista y el modelo, el controlador se
encarga de atender y procesar las acciones que realice el usuario a
través de la interfaz, enviando dicha información al modelo (de ser
necesario) y regresando una respuesta a la vista.
 Los controladores deben mantenerse también con un mínimo de
lógica y ser lo más modulares posible.
 En el controlador también existe una capa de validación, la cual debe
digerir los datos y organizarlos de tal forma que al momento de ser
enviados al modelo, se realice la validación final para ejecutar la
operación deseada por el usuario.
El patrón MVC
 Modelo-Vista-Controlador
 Un modelo

 Varias vistas
 Varios controladores

 Las vistas y los controladores suelen estar muy relacionados

• Los controladores tratan los eventos que se producen en la interfaz
gráfica (vista)

 Esta separación de aspectos de una aplicación da mucha

flexibilidad al desarrollador
MVC Flujo de Control

1. El usuario realiza una acción en la interfaz

2. El controlador trata el evento de entrada
 Previamente se ha registrado
3. El controlador notifica al modelo la acción del usuario, lo
que puede implicar un cambio del estado del modelo (si
no es una mera consulta)
4. Se genera una nueva vista. La vista toma los datos del
modelo
 El modelo no tiene conocimiento directo de la vista
5. La interfaz de usuario espera otra interacción del usuario,
que comenzará otro nuevo ciclo
MVC Flujo de Control
MVC – N Capas
¿Por qué utilizar en MVC
en el web?
Es una solución que va muy bien con los sitios web.
Cada hit en una página es la interacción de un
usuario (entrada) con el sistema (el servidor web
procesando los scripts PHP). Asumiendo que se
necesita mantener persistencia y que se necesita
presentar la información en una variedad de
maneras, el patrón MVC es una buena solución.
MVC en aplicaciones web
Vista:
 la página HTML
Controlador:
 código que obtiene datos dinámicamente y genera el
contenido HTML
Modelo:
 la información almacenada en una base de datos o en
XML
 junto con las reglas de negocio que transforman esa
información (teniendo en cuenta las acciones de los
usuarios)
MVC - Web
Arquitectura MVC-web
MVC en Java Swing
Modelo:
 El modelo lo realiza el desarrollador
Vista:
 Conjunto de objetos de clases que heredan de
java.awt.Component
Controlador:
 El controlador es el thread de tratamiento de eventos, que
captura y propaga los eventos a la vista y al modelo
 Clases de tratamiento de los eventos (a veces como clases
anónimas) que implementan interfaces de tipo EventListener
(ActionListener, MouseListener, WindowListener, etc.)
Ejemplo :Calculadora de Soles a Dolares

Una clase sencilla que da operaciones para calcular la

conversión entre soles y dólares

 En el constructor se indica el cambio

 Métodos
• Calcular dolares de una cantidad en soles
• Calcular soles de una cantidad en dolares
Modelo
Modelo
Modelo
Vista
- Definimos una interfaz con las operaciones que el control puede
necesitar para manipularla
Vista
• Una ventana (JFrame) con
• Un campo de texto (JTextField) para indicarla entrada
• Una etiqueta (JLabel) para indicar el resultado de la conversión
• Dos botones (JButton) para las dos operaciones
Vista
Vista
Control
Control
Observaciones
• El modelo

• ¿Tiene algo de código que dependa de la vista o del

controlador?

• El control
• Manipula el modelo y gestiona la vista

• La vista

• Tiene que implementar una interfaz predefinida para la

aplicación
• Tiene que configurar a quién le llegan los eventos que se
produzcan sobre sus elementos
Vista - Textual
Vista - Textual
Vista - Textual
MVC

• ¿Qué hay que cambiar en el modelo y el control para

utilizar la vista textual en vez de la gráfica?

• ¿Qué hay que cambiar en el programa principal?

Resumen

Modelo - Vista - Controlador, es un patrón de arquitectura

del software en el que los distintos elementos que lo
componen son organizados y divididos de tal manera que
funcionen con una mínima dependencia entre si, facilitando
el mantenimiento y mejorando la legibilidad del código.