0% encontró este documento útil (0 votos)
62 vistas

MVC - Intro

Este documento describe la arquitectura de Modelo Vista Controlador (MVC) y cómo implementarla en una aplicación. MVC separa una aplicación en tres componentes: el modelo, que contiene la lógica del negocio y los datos; la vista, que se encarga de la presentación; y el controlador, que maneja las interacciones entre el modelo y la vista. El documento explica las ventajas de MVC, cómo funciona cada componente, y provee un ejemplo de cómo diseñar una aplicación MVC simple para convertir medidas.
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PPTX, PDF, TXT o lee en línea desde Scribd
0% encontró este documento útil (0 votos)
62 vistas

MVC - Intro

Este documento describe la arquitectura de Modelo Vista Controlador (MVC) y cómo implementarla en una aplicación. MVC separa una aplicación en tres componentes: el modelo, que contiene la lógica del negocio y los datos; la vista, que se encarga de la presentación; y el controlador, que maneja las interacciones entre el modelo y la vista. El documento explica las ventajas de MVC, cómo funciona cada componente, y provee un ejemplo de cómo diseñar una aplicación MVC simple para convertir medidas.
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PPTX, PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 28

UNIVERSIDAD DISTRITAL

SEDE TECNOLÓGICA
Programación
Multinivel SISTEMATIZACIÓN DE DATOS

DOCENTE: ISMAEL
ANTONIO ARDILA
MVC es un patrón de arquitectura de software utilizado para
implementar sistemas de información donde se tienen interfaces de
MVC usuario. sirve para crear software con un ciclo de vida más adecuado
con el fin de facilitar la funcionalidad, el mante­nimiento, la reutilización
del código y la escalabilidad. La arquitectura MVC está basada en capas
que permiten separar el código en función de sus responsabilidades.

Su principal característica está dada por el hecho de que el modelo, las


vistas y los controladores son tratados como entidades separadas, lo
que permite que cualquier cambio que se realice en el modelo
automáticamente se refleje en cada una de las vistas.
 Define claramente la separación entre los componentes de un
programa, permitiendo la implementación de estos por aparte.
 Establece una interfaz de programación de la aplicación bien
Ventajas del definida, lo que permite reemplazar el modelo, la vista y el
controlador sin mayor dificultad.
módelo  Los componentes son programados por separado y luego son
unidos en tiempo de ejecución. Si uno de estos no funciona
correctamente, se puede reemplazar sin que los otros
componentes se vean afectados.
 Modelo: Es la representación lógica del negocio, es decir, la
información con la cual el sistema opera. Es el encargado de gestionar
el acceso a los datos permitiendo la consulta, las actualizaciones de
estos, como también, la implementación de los privilegios de acceso a
la información. El modelo envía a la vista la información que es
solicitada para que sea mostrada, por otro lado, las peticiones de
acceso o la manipulación de la información llegan al modelo a través
del controlador.
 Vista: Es la interfaz gráfica de usuario que permite visualizar la
Se divide información que contiene la lógica del negocio. Interactúa
preponderantemente con el con­trolador, pero es posible que trabaje
directamente con el modelo a través de una referencia al propio
modelo.
 Controlador: actúa como intermediario entre el modelo y la vista.
Responde a las acciones que efectúan usualmente los usuarios
(eventos) e invoca peticiones al modelo cuando se hace alguna
solicitud sobre la información (por ejemplo, mo­dificar un documento).
También puede variar el modelo en caso de ser necesario
1. El usuario realiza una petición.
2. La petición es enviada al controlador.
3. El controlador se comunica con el modelo.
Funcionamiento 4. El modelo consulta la petición con la base de datos y retorna la
información al controlador.
5. El controlador envía a la vista los datos procesados
La vista organiza la información, la visualiza y espera nuevas
interacciones del usuario para empezar nuevamente el ciclo.
3.

usuario
1. Solicita Pide Retorna
2. Llama

Funcionamiento Controlador Modelo


5. Procesa y 4. Retorna
envía

Vista
Ventajas Desventajas
Existe una clara separación de
Mayor complejidad al iniciar el
la interfaz de usuario (vista) de
desarrollo de la aplicación
la lógica del negocio (modelo)

Las vistas mantienen siempre Se tiene que trabajar con una


la información actualizadas estructura predefinida

Al modificar algunas de las La distribución por componentes


vistas no se modifica la lógica obliga a mantener un mayor
del negocio número de archivos

Es más fácil comprobar el La implementación es


funcionamiento del sistema demasiada costosa.

Cada componente es
independiente de los demás
componentes

Se reutilizan de los
componentes

Facilidad para el
mantenimiento de la aplicación
La mayoría de los sistemas de información utilizan un sistema de
bases de datos para gestionar los datos que debe utilizar una
aplicación, esta acción concierne al modelo.
La representación de datos y el modelo de negocio representan la
integración entre la vista y el correspondiente controlador de
eventos para el acceso a la información, esto permite la separación
de la interfaz de usuario, la debida programación y el ingreso a los
datos
MVC y BD
Un ejemplo real del patrón MVC sería el almacenamiento de la
información de los clientes de una empresa. La vista es la interfaz
gráfica, donde el usuario podrá adicionar, consultar, modificar y
eliminar los diversos clientes.
El modelo tendrá todo el código necesario para implementar las
operaciones de consulta, edición, inserción y eliminación de los
clientes; el controlador se encargaría de interactuar con la vista, la
base de datos y el modelo.
La estructura de una aplicación Modelo-Vista-Controlador desde un
entorno de de­sarrollo deberá contener las siguientes carpetas:
controlador (clases que se encarga­rán de la comunicación con la
interfaz de usuario y el modelo);
modelo (clases para obtener la lógica del negocio);
Estructura de vista (interface gráfica de usuario para interactuar con el sistema)

una aplicación
MVC
 La Vista de la aplicación MVC, será la interfaz de usuario donde
este podrá interactuar con el sistema.

Estructura de
una aplicación
MVC (Vista)
 Serán las clases con la lógica del negocio, es decir, la codificación
de cada uno de los procesos en Java.

Estructura de
una aplicación
MVC (Modelo)
 Es una clase que se encargaran de la comunicación entre la vista y
el modelo.

public class Nombre_Clase_Controlador implements (Interface para escuchar eventos){


NombreClaseVista instanciaVista;
Estructura de NombreClaseModelo instaciaModelo;
public Constructor_Clase_Constructor() {

una aplicación *** Asignar espacio de memoria a las instancias


*** Hacer visible la Vista

MVC }
*** Accion para escuchar los eventos

(Controlador)
public void actionPerformed(ActionEvent e) {
Implementar el código a procesar para enviar la
información de la Vista al modelo, luego tomar los datos
del Modelo y retornarlos a la vista.

}
Diseñar una aplicación Modelo-Vista-Controlador que permita
convertir una medida en metros a centímetros.

1. Crear la aplicación MVC en NetBeans IDE: dentro del entorno


de desarrollo de NetBeans IDE en la opción Archivo (File)
seleccione Proyecto Nuevo (Project New)->Java ->Java
Application y en este caso, escriba como nombre de proyecto
Ejemplo 1 PrimerProgramaJavaMVC.
2. Crear la estructura MVC: seleccione la carpeta Paquetes de
fuentes del proyecto, dé clic derecho y elija Nuevo (New) ->
Paquete de Java (Java Package) para crear los siguientes
paquetes: Controlador, Modelo y Vista
3. Crear la Vista: seleccione el paquete Vista, dé clic derecho, elija
Nuevo (New) -> Java Class ... y como Nombre de Clase (Class
Name) escriba: Cajas_de_Mensaje.
Reemplace el código generado por el siguiente:.
package Vista;
import javax.swing.JOptionPane;
public class Cajas_de_Mensaje
{
private String titulo;
public Cajas_de_Mensaje()
{
titulo="";
}
public String getTitulo()
{
return titulo;
}

Ejemplo 1 {
public void setTitulo(String titulo)

this.titulo = titulo;
}
public double solicitarMetros(String mensaje)
{
return Double.parseDouble(JOptionPane.showinputDialog(null,mensaje,titulo,1));
}
public void mostrarCentimetros(String mensaje)
{
JOptionPane.showMessageDialog(null,mensaje,titulo,1);
}
}
Se crea dentro del Paquete Vista la clase Cajas_de_Mensaje que permita Visualizar varias cajas de
dialogo haciendo uso de la clase JOptionPane de esta manera se podrán generar los siguientes
mensajes:
* Un cuadro de diálogo de entrada (showlnputDialog) para digitar la medida en metros y un
cuadro de dialogo de mensaje (showMessageDialog) para mostrar la medida en centímetros. Por
otro lado, se utilizará el método setTitulo() para mostrar un título en los diferentes cuadros de
dialogo

4. Crear el Modelo: seleccionando el paquete Modelos, dé clic derecho, elija (New) -> Java
Class ... y como Nombre de Clase (Class Name) escriba: Convertidor.
Ejemplo 1 Reemplace el código generado por el siguiente:
package Modelo;
public class Convertidor
{
private double valor;
public Convertidor(double valor)
{
this.valor=valor;
}
public Convertidor ()
{
this.valor=0.0;
}

Ejemplo 1 public double getValor()


{
return valor;
}
public void setValor(double valor)
{
this.valor = valor;
}
public double convertiracentimetros()
{
return this.valor*100;
}
}
Dentro del paquete Modelo se crea la clase Convertidor que permitirá obtener el valor de la
medida digitada en metros y por intermedio de la función convertirá centímetros() se retornará el
valor de la medida en centímetros.

5. Crear el Controlador: seleccionando el paquete Controlador, dé clic derecho, elija (New) ->
Java Class ... y como Nombre de Clase (Class Name) escriba: controladores.
Reemplace el código generado por el siguiente:

Ejemplo 1
package Controlador;
import Modelo.Convertidor;
import Vista.Cajas_de_Mensaje;
public class Controladores{
Convertidor objetomodelo;
Cajas_de_Mensaje objetovista;
public Controladores() {
objetomodelo=new Convertidor();

Ejemplo 1
objetovista=new Cajas_de_Mensaje();
}
public void iniciar()
{
objetovista.setTitulo("Convertir Metros a Centímetros");
objetomodelo.setValor(objetovista.solicitarMetros("Digite la medida en metros:"));
objetovista.mostrarCentimetros("La medida en Centímetros es:“+objetomodelo.convertiracentimetros() );
}
}
Dentro del paquete Controlador se define la clase Controladores que permitirá crear las instancias
objeto vista y objeto modelo de las clases Cajas_de_Mensaje y Con­vertidor, respectivamente.
Utilizando del método iniciar() se le coloca el título a los cuadros de diálogo, se obtiene el valor de
la medida en metros y se visualiza el valor de la medida en centímetros.

6. Crear Programa Ejecutor: en el paquete PrimerProgramajavaMVC, dé doble clic sobre el


archivo primerprogramajavamvc.java.
Reemplace el código generado por el siguiente:

Ejemplo 1
package primerprogramajavamvc;
import Controlador.Controladores;
public class PrimerProgramaJavaMVC
{
public static void main(String[] args)

Ejemplo 1 {
Controladores objetoControlador= new Controladores();
objetoControlador.iniciar();
}
}
se modifica el archivo primerprogramajavamvc,java que se encuentra dentro del paquete
PrimerProgramaJavaMVC En dicho archivo se crea la instancia objeto­Controlador de tipo
Controladores. Con esta instancia se llama al método iniciar() que permitirá visualizar el cuadro de
diálogo de entrada para capturar el valor de la medida en metros.

Ejemplo 1
7. Ejecutar la aplicación MVC: seleccione el archivo PrimerProgramaJavaMVC,java, dé clic derecho, elija la opción Ejecutar

archivo (Run file) o pulse las teclas Shiji+F6, de esta forma podrá visualizar la salida de la aplicación tal como se muestra en la
siguiente figura

Ejemplo 1 Si se digita el valor de medida 105.8, se pulsa el botón Aceptar, se obtendrá la respuesta como se ve en la siguiente figura.
Ejemplo 2: Implementar programa utilizando el patrón de diseño Modelo-Vista-Controlador que permita capturar 2 números e
imprimir su producto.

a) Crear la Vista: estando en el proyecto PrimerProgramaJavaMVC, y situándose en el paquete Vista, de nuevo de clic derecho,
seleccione Nuevo (New) -> Java Class… y como Nombre de Clase (Class Name) escriba: Mensajes. Reemplace el código
generado por el siguiente:

package Vista;
import javax.swing.JOptionPane;
public class Mensajes {
private String titulo;
public Mensajes()
{
titulo="";
}
public String getTitulo() {

Ejemplo 2 }
return titulo;

public void setTitulo(String titulo) {


this.titulo = titulo;
}
public double solicitarPrimerNumero(String mensaje)
{
return Double.parseDouble(JOptionPane.showInputDialog(null,mensaje,titulo,1));
}
public double solicitarSegundoNumero(String mensaje)
{
return Double.parseDouble(JOptionPane.showInputDialog(null,mensaje,titulo,1));
}
public void mostrarOperacion(String mensaje)
{
JOptionPane.showMessageDialog(null,mensaje,titulo,1);
}
}
b) Crear el Modelo: situándose en el paquete Modelo, de clic derecho, seleccione Nuevo (New) -> Java Class… y como Nombre
de Clase (Class Name) escriba: Operacion. Reemplace el código generado por el siguiente:

package Modelo;
public class Operacion {
private double primero,segundo;
public Operacion(double primero, double segundo)
{
this.primero=primero;
this.segundo=segundo;
}
public Operacion()
{
this.primero=0.0;
this.segundo=0.0;

Ejemplo 2 }
public double getPrimero() {
return primero;
}
public void setPrimero(double primero) {
this.primero = primero;
}
public double getSegundo() {
return segundo;
}
public void setSegundo(double segundo) {
this.segundo = segundo;
}
public double multiplicacion()
{
return primero * segundo;
}
}
c) Crear el Controlador: situándose en el paquete Controlador, de clic derecho, seleccione Nuevo (New) -> Java Class… y como
Nombre de Clase (Class Name) escriba: ControladorOperacion. Reemplace el código generado por el siguiente:

package Controlador;
import Modelo.Operacion;
import Vista.Mensajes;
public class ControladorOperacion{
Operacion objetomodelo;
Mensajes objetovista;
public ControladorOperacion()
{
objetomodelo=new Operacion();

Ejemplo 2 }
objetovista=new Mensajes();

public void iniciar()


{
objetovista.setTitulo("Producto de dos números");
objetomodelo.setPrimero(objetovista.solicitarPrimerNumero("Digite primer número:"));
objetomodelo.setSegundo(objetovista.solicitarSegundoNumero("Digite segundo número:"));
objetovista.mostrarOperacion("El producto es:"+objetomodelo.multiplicacion());
}
}
d) Crear programa ejecutor: en el paquete primerprogramajavamvc, cree un archivo llamado PrimerProgramaJavaMVC,java y
reemplace el código existente por el siguiente:

package primerprogramajavamvc;
import Controlador.Controladores;
public class PrimerProgramaJavaMVC {
public static void main(String[] args) {
ControladorOperacion objetoControlador= new ControladorOperacion();
objetoControlador.iniciar();
}
Ejemplo 2 }
e) Ejecutar la aplicación MVC: sitúese sobre el archivo OperacionMVC,java, de clic derecho, seleccione la opción Ejecutar
archivo (Run file) o pulse las teclas Shift+F6, de esta forma podrá visualizar la salida de la aplicación tal como se muestra en la
siguiente figura:

Si se digita 20

Al pulsar el botón Aceptar, se


obtendrá la siguiente figura:
Ejemplo 2
Si se digita 15

Al pulsar el botón Aceptar, se obtendrá la siguiente figura:


Dudas ?

También podría gustarte