La descripción del patrón MVC es:
- Vista (View): Representa la interfaz de usuario y todas las herramientas con las cuales el usario hace uso del programa.
- Modelo (Model): Es donde esta toda la lógica del negocio, la representación de todo el sistema incluido la interacción con una base de datos, si es que el programa asi lo requiere.
- Controlador (Controller): Este componente es el que responde a la interacción (eventos) que hace el usuario en la interfaz y realiza las peticiones al modelo para pasar estos a la vista.
El programa que realizaremos, es una aplicación trivial y sencilla, sin embargo nos ayudara a comprender mejor cual la forma de trabajo de este matrón MVC en Java, utilizaremos para esto, el IDE de Netbeans.
PROYECTO
1. Crea un nuevo proyecto en netbeans, para este ejemplo, el proyecto se llama "jc_mvc_demo". Crea una estructura de paquetes (Controller, Model, View), hacemos esto para separar cada componente, ser más organizados. Debes tener algo como esto.
Como puedes observar, mantenemos el paquete default junto al Main.java que nos crea netbeans, este main es el que nos servira como nuestro index.php de nuestra aplicación, nuestro "lanzador".
2. Empecemos creando la lógica de la aplicación, crea una nueva clase en el paquete Model, llamalo "modelo.java" y añade el siguiente codigo:
01 package model; 02 /** 03 * @web http://jc-mouse.blogspot.com/ 04 * @author Mouse 05 * En esta clase se guarda la lógica del sistema, para este sencillo ejemplo 06 * consiste en una SUMA 07 */ 08 public class modelo { 09 //Variables 10 private int valor1=28; 11 private int valor2=69; 12 private int total = sumar(); 13 14 public modelo(){} 15 16 public void set_valor1(int val){ 17 this.valor1=val; 18 } 19 20 public int get_valor1(){ 21 return this.valor1; 22 } 23 24 public void set_valor2(int val){ 25 this.valor2=val; 26 } 27 28 public int get_valor2(){ 29 return this.valor2; 30 } 31 32 public int sumar(){ 33 this.total = this.valor1 + this.valor2; 34 return this.total; 35 } 36 37 public int get_total(){ 38 return this.total; 39 } 40 41 }
Como vemos, nuestra modelo es sencillo, es nada más que la suma de dos valores enteros, con sus respectivos metodos. continuemos.
3. Diseñemos ahora la interfaz de usuario, nuestra VISTA.
Añade un JFrame al paquete VIEW, llamalo "vista.java", OJO los recuadros marcados con rojo, son los componentes que tendran interacción con el modelo, asi que para evitar confuciones, es mejor renombrarlos, coloca los nombres tal como se ven en la imagen de abajo.
3. Ahora continuamos con el CONTROLADOR de nuestra aplicación, crea una clase "controlador.java" en el paquete CONTROLLER, el codigo que debes colocar, es:
01 package controller; 02 03 import java.awt.event.ActionEvent; 04 import java.awt.event.ActionListener; 05 import model.modelo; 06 import view.vista; 07 /** 08 * @web http://jc-mouse.blogspot.com/ 09 * @author Mouse 10 */ 11 public class controlador implements ActionListener{ 12 13 private vista vista; 14 private modelo modelo; 15 16 //En el constructor inicializamos nuestros objetos y tambien 17 //añadimos el ActionListener al boton "cmdsumar" de la VISTA 18 public controlador( vista vista , modelo modelo){ 19 this.vista = vista; 20 this.modelo = modelo; 21 this.vista.cmdsumar.addActionListener(this); 22 } 23 24 //Inicia los valores del jFrame VISTA con los datos del MODELO 25 public void iniciar_vista(){ 26 vista.setTitle( "Demo MVC * jc-mouse.net" ); 27 vista.setLocationRelativeTo(null); 28 vista.vtxt1.setText( String.valueOf(modelo.get_valor1()) ); 29 vista.vtxt2.setText( String.valueOf(modelo.get_valor2()) ); 30 vista.vtxt3.setText( String.valueOf(modelo.get_total()) ); 31 } 32 33 //La accion del boton de la VISTA es capturado, asi como los valores de 34 //los jtextbox, entonces se realiza la funcion SUMAR y se actualiza 35 //el jtextbox correspondiente al resultado 36 public void actionPerformed(ActionEvent e) { 37 modelo.set_valor1( Integer.valueOf( vista.vtxt1.getText() ) ); 38 modelo.set_valor2( Integer.valueOf( vista.vtxt2.getText() ) ); 39 modelo.sumar(); 40 vista.vtxt3.setText( String.valueOf(modelo.get_total()) ); 41 } 42 43 }
4. Para terminar debemos implementar todo esto en nuestro main.java:
01 package jc_mvc_demo; 02 03 import controller.controlador; 04 import model.modelo; 05 import view.vista; 06 /** 07 * @web http://jc-mouse.blogspot.com/ 08 * @author Mouse 09 */ 10 public class Main { 11 12 public static void main(String[] args) { 13 14 //nuevas instancias de clase 15 modelo modelo = new modelo(); 16 vista vista = new vista(); 17 controlador controlador = new controlador( vista , modelo ); 18 //se inicia la vista 19 controlador.iniciar_vista(); 20 21 vista.setVisible(true); 22 23 } 24 25 }
Ejecuta el programa para terminar.
Descarga el ejemplo e investiga como cambiar la interfaz1 a la interfaz2
El proyecto completo, esta "AQUI"
Suerte :)
10 comentarios:
Muy bueno el aporte gracias
tus proyectos me han ayudado mucho, podrias hacer uno en el que utilizes collapsiblepane por favor?
Genial, muy buen aporte , gracias ;)
Muy buenos tutoriales amigo, pero tengo una duda.
¿como debería hacerlo cuando hay mas de un botón con distintas funciones?
gracias.
public void actionPerformed(ActionEvent e) {
modelo.set_valor1( Integer.valueOf( vista.vtxt1.getText() ) );
modelo.set_valor2( Integer.valueOf( vista.vtxt2.getText() ) );
if (e.getSource()==this.vista.cmdrestar) {
modelo.restar();
}
if (e.getSource()==this.vista.cmdsumar) {
modelo.sumar();
}
vista.vtxt3.setText( String.valueOf(modelo.get_total()) );
}
Graciiiiiiiiias ;)
Muy buen ejemplo, este sitio ha sido mi referencia para aprender Java.
Saludos.
Eres lo máximo vaya que tu ejemplo ayuda mucho
Att. Ricardo Ramirez de HONDURAS
Hermano es un buen ejemplo, esto del modelo MVC nos lo enseñaron hace poco en la U, y nos esta siendo de gran ayuda para realizar un sistema de una comercial agrícola, gracias por tu ayuda.
Bendiciones.
Excelente explicación y aporte.
Una consulta, tendrás el MVC con web usando NetBeans?
Publicar un comentario