Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube
JC Mouse Bolivia
Index / Java / Proyectos / jFace – Crea retratos hablados

jFace – Crea retratos hablados

Autor jc mouse viernes, enero 27, 2012

La policia, el FBI u otros organismos similares utilizaban a dibujantes para realizar el «retrato hablado» de algún maleante, con la tecnologia, esto cambio, y se hicieron programas para facilitar este proceso, entre los programas conocidos tenemos a Faces 4.0 (imagen de abajo) este programa en español y bastante facil de usar puede realizar un retrato en pocos minutos.

¿Que tiene que ver este programa con el post?

Pues en este tuto realizaremos un ejemplo sencillo de Faces 4.0 en Java-Netbeans, y tambien lo cito porque a falta de un buen artista, utilizaremos algunas imagenes propias de este programa (para evitar infracción a las derechos de autor)en nuestro proyecto.

¿Que necesitamos?

  • Conocer de Java (Básico-Intermedio)
  • IDE – Netbeans 6.9 o el que quieras
  • Algunas imagenes, no problem… Bajate estas imagenes
  • 15 minutos de tiempo, mucho no es

Comencemos.

1. Crea un nuevo proyecto en netbeans (proyecto: jface), ahora debemos crear la estructura de la aplicación, es la siguiente:

  • Crea un paquete «imagenes», dentro de este paquete, crea 8 paquetes más para cada una de las partes del rostro (bigote, cabello, cabeza, cejas, labios , mandibula, nariz, ojos), dentro de esos paquetes, debes colocar las imagenes que descargaste al principio del tutorial «Imagenes».

Ahora en el paquete por defecto «jface», crea las siguientes clases:

  • jface.java: Es un JFrame, es la interfaz principal del programa
  • jface_miembro_rostro.java: Es una clase, en esta clase se cargaran las imagenes de cada parte del rostro.
  • jface_panel.java: Es una clase que se extiende de un JPanel, nos permite dibujar el rostro en Java2d
  • jface_rostro.java: Es una clase, une todas las partes del rostro y las dibuja en Java2d

estructura de proyecto

2. Diseño de la interfaz, nada del otro mundo,agrega dos jPanel al JFrame, con las siguientes dimensiones jPanel1 600×700 y jPanel2 230×700, puedes utilizar layouts para alinearlos

diseño de interfaz

3. Vamos al código, el siguiente paso es un Copy/Paste, sin embargo si quieres aprender de verdad, te aconsejo que heches una mirada al código.

Comencemos por la clase jface_miembro_rostro.java

package jface;
import java.awt.Image;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.net.URL;
import javax.imageio.ImageIO;
/**
 * @web http://jc-mouse.blogspot.com/
 * @author Mouse
 */
public class jface_miembro_rostro {

   private BufferedImage[] imagen;
   private URL _url;   
   private int index=1;

    public jface_miembro_rostro( String miembro){
        load_images(miembro);        
    }

    //carga todas las imagenes en memoria
   private void load_images( String miembro){
        imagen = new BufferedImage[4];
        //se llena el buffer con la imagen
        for(int i=1; i<=3;i++){
            try {
                _url = new URL(getClass().getResource("/imagenes/"+ miembro +"/jface_" + i + ".png").toString());
                imagen[i] = ImageIO.read(_url);                
            } catch (IOException ex) {System.out.println(ex); }
        }
    }

   public void setImagen(int index){
    this.index = index;
   }

   public Image getImagen(){
        return imagen[this.index];
   }

}

Ahora la clase jface_rostro.java

package jface;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
/**
 * @web http://jc-mouse.blogspot.com/
 * @author Mouse
 */
public class jface_rostro {
    //Partes del rostro
    private jface_miembro_rostro cabello;
    private jface_miembro_rostro cabeza;
    private jface_miembro_rostro nariz;
    private jface_miembro_rostro ojos;
    private jface_miembro_rostro labios;
    private jface_miembro_rostro mandibula;
    private jface_miembro_rostro cejas;
    private jface_miembro_rostro bigote;

    public jface_rostro(Dimension contendor){
        cabello     = new jface_miembro_rostro("cabello");
        cabeza      = new jface_miembro_rostro("cabeza");
        nariz       = new jface_miembro_rostro("nariz" );
        ojos        = new jface_miembro_rostro("ojos");
        labios      = new jface_miembro_rostro("labios" );
        mandibula   = new jface_miembro_rostro("mandibula" );
        cejas       = new jface_miembro_rostro("cejas" );
        bigote      = new jface_miembro_rostro("bigote" );
    }

    //Cambia una parte del rostro
    //Entrada: Parte-del-rostro_imagen de tipo String
    public void cambiar_parte_del_rostro(String value){
        String[] val = value.split("_");//divide el comando en dos
        //valores, uno literal y el otro entero
        if( val[0].equals("nariz"))        
            nariz.setImagen( Integer.valueOf(val[1]));
        else if( val[0].equals("ojos"))
            ojos.setImagen( Integer.valueOf(val[1]));
        else if( val[0].equals("labios"))
            labios.setImagen( Integer.valueOf(val[1]));
        else if( val[0].equals("cabello"))
            cabello.setImagen( Integer.valueOf(val[1]));
        else if( val[0].equals("cabeza"))
            cabeza.setImagen( Integer.valueOf(val[1]));
        else if( val[0].equals("mandibula"))
            mandibula.setImagen( Integer.valueOf(val[1]));
        else if( val[0].equals("cejas"))
            cejas.setImagen( Integer.valueOf(val[1]));
        else if( val[0].equals("bigote"))
            bigote.setImagen( Integer.valueOf(val[1]));        
    }

    public void dibujar(Graphics g) {
        Graphics2D g2 = (Graphics2D)g;
        g2.drawImage(cabeza.getImagen(),0,0, null);
        g2.drawImage(mandibula.getImagen(), 0,0, null);
        g2.drawImage(nariz.getImagen(),0,0, null);
        g2.drawImage(ojos.getImagen(), 0,0, null);
        g2.drawImage(labios.getImagen(), 0,0, null);
        g2.drawImage(cabello.getImagen(), 0,0, null);
        g2.drawImage(cejas.getImagen(), 0,0, null);
        g2.drawImage(bigote.getImagen(), 0,0, null);
    }

}

 

clase jface_panel.java

package jface;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.geom.Rectangle2D;
import java.awt.image.BufferedImage;
import javax.swing.BorderFactory;
import javax.swing.JPanel;
/**
 * @web https://www.jc-mouse.net/
 * @author Mouse
 */
public class jface_panel extends JPanel {

    private BufferedImage Imagen_en_memoria;
    private Graphics2D g2d;
    public jface_rostro rostro;    

    //constructor principal
    //Input: Dimension del contenedor padre
    public jface_panel(Dimension d) {
        this.setSize(d);
        this.setPreferredSize(d);
        this.setBorder(BorderFactory.createLineBorder(Color.BLACK));
        rostro = new jface_rostro( this.getSize() );        
    }    

    @Override
    public void paintComponent(Graphics g) {        
        Graphics2D g2 = (Graphics2D)g;
        //imagen en memoria para dibujar en segundo plano
        Imagen_en_memoria = new BufferedImage(this.getWidth(), this.getHeight(), BufferedImage.TYPE_INT_RGB);
        g2d = Imagen_en_memoria.createGraphics();
        g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        g2d.setColor(Color.white);
        g2d.fill(new Rectangle2D.Double(0,0,this.getWidth(), this.getHeight()));        
        rostro.dibujar(g2d);
        g2d.setFont( new Font("Arial",Font.BOLD, 26) );
        g2d.setColor(Color.black);
        g2d.drawString("jFace - Programado por Mouse ", 20, 30);
        g2d.drawString("Visitame: https://www.jc-mouse.net/ ", 20, 60);
        //dibuja toda la imagen
        g2.drawImage(Imagen_en_memoria, 0, 0, this);
    }

}

Para terminar, debemos añadir un poco de código a la clase interfaz jface.java

Si habres el codigo de la clase, veras algo como esto:

package jface;

public class jface extends javax.swing.JFrame {

    /** Creates new form jface */
    public jface() {
        initComponents();        
    }

    /** This method is called from within the constructor to
 * initialize the form.
 * WARNING: Do NOT modify this code. The content of this method is
 * always regenerated by the Form Editor.
 */
    @SuppressWarnings("unchecked")

   /* RESTO DE CODIGO GENERADO POR NETBEANS */

Lo que haremos sera añadir un poco de código, ojo con esto, no es copiary pegar sino cheka el codigo primero, al final debes tener algo como esto:

package jface;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
/**
 * @web https://www.jc-mouse.net/
 * @author Mouse
 */
public class jface extends javax.swing.JFrame {

    private jface_panel lienzo;
    private JButton btn[][];
    ActionListener actionListener ;

    /** Creates new form jface */
    public jface() {
        initComponents();
        //Se inicia la interfaz
        setTitle( "jFace - by Mouse" );
        setLocationRelativeTo(null);
        //se crea instancia a panel y se añade a la interfaz
        lienzo =new jface_panel( this.jPanel1.getSize() );
        this.jPanel1.add(lienzo);
        //alineacion para jpanel de controles
        jPanel2.setLayout(new java.awt.GridLayout(8, 3, 5, 5));//alineacion
        //acciones de los controles "jbutton" para cambiar partes del rostro
        actionListener = new ActionListener() {
          public void actionPerformed(ActionEvent e) {
                String comando = e.getActionCommand();
                lienzo.rostro.cambiar_parte_del_rostro(comando);
                lienzo.repaint();
          }
        };
        //matriz de controles de JButton
        btn = new JButton[8][3];
        botones();
    }

    //Crea la matriz de controlos y añade propiedades
    private void botones()
    {
        String action="";
        for ( int i=0; i < 8; i++ )//filas
        {
            for ( int j=0; j < 3; j++ )//columnas
            {
                btn[i][j] = new JButton();
                btn[i][j].setSize( new Dimension(70,80) );
                btn[i][j].setPreferredSize( new Dimension(70,80) );
                btn[i][j].setText("");
                btn[i][j].setBackground(Color.white);
                switch (i){//Nombres de los eventos
                    case 0: action = "ojos"; break;
                    case 1: action = "labios"; break;
                    case 2: action = "nariz"; break;
                    case 3: action = "cabello"; break;
                    case 4: action = "cabeza"; break;
                    case 5: action = "mandibula"; break;
                    case 6: action = "cejas"; break;
                    case 7: action = "bigote"; break;
                }
                btn[i][j].setToolTipText(action);
                btn[i][j].setActionCommand(action + "_" + (j+1) );//se crea comando
                btn[i][j].setIcon(new javax.swing.ImageIcon(getClass().getResource("/imagenes/"+action+"/jface_"+(j+1)+"_t.png")));
                btn[i][j].addActionListener(actionListener);
                jPanel2.add(btn[i][j]);//se añade al JPanel contenedor
            }
        }
    }

    /** This method is called from within the constructor to
 * initialize the form.
 * WARNING: Do NOT modify this code. The content of this method is
 * always regenerated by the Form Editor.
 */
    @SuppressWarnings("unchecked")

Añadimos algunas librerias y variables, modificamos tambien el constructor de la clase y creamos un metodo privado para crear un array de controles (JButton).

Eso es todo, si terminaste y no tienen ningun error, compila y ejecuta el proyecto, todo el codigo esta comentado si quieres estudiar el codigo no creo que debas tener problemas, sino, preguuuuuuuntame.

proyecto final

Porque no observas el video y ves como quedo 🙂

Enlace de descarga para los más flojos: Codigo Java-Netbeans

Tags

Si te ha gustado podrías compartirlo o dejar un comentario. ¡Muchas gracias!
Autor: JC Mouse

Yo soy yo :) JC Mouse, Soy orgullosamente boliviano soy fundador y CEO de la web jc-Mouse.net uno de las pocas web en emprendimiento y tecnología en Bolivia.

Toda la información que encuentres en este sitio es y sera completamente gratis siempre, puedes copiar, descargar y re-publicar si así lo deseas en otros blogs o sitios web, solo te pido a cambio que dejes una referencia a esta web. Esto nos ayuda a crecer y seguir aportando. Bye

Enjoy! :)

También Te Podría Interesar

Números narcisistas o de Armstrong

Números narcisistas o de Armstrong

Los números narcisistas o números de Armstrong son aquellos números enteros positivos  cuya suma de las n-ésimas potenci...

Proyecto de base de datos Firebird VB

Proyecto de base de datos Firebird VB

En este proyecto realizaremos una aplicación de base de datos Firebird con el lenguaje de programación de Visual Basic d...

Rompecabezas con forma irregular

Rompecabezas con forma irregular

En este post vemos una manera de como crear un juego de rompecabezas en java sin el uso de java2d, ademas, las piezas de...

Contraseñas con emojis en java

Contraseñas con emojis en java

Semanas atrás leí un articulo en el que se pensaba implementar los emojis como contraseñas en los dispositivos con andro...

Client REST usando GSON y Volley

Client REST usando GSON y Volley

En este post crearemos un cliente android para consumir un recurso de un REST API utilizando las librerías GSON y Volley...

Obtener Metadatos de una base de datos

Obtener Metadatos de una base de datos

La clase de java DatabaseMetaData nos permite obtener información exhaustiva sobre una base de datos, para ser más exact...

3 comentarios en “jFace – Crea retratos hablados”

  1. Ian Augusto dice:

    Saludos…me parece muy bueno e interesante algunos post que publicas…gracias por las ideas y la ayuda que brindas.

  2. EpanG-System dice:

    Amigo mouse som fascinantes todos los proyectos que desarrollas , temgo una curiosidad en tus proye tos que descargo encuentro un archivo que se llama importante y me gustaria saber .como haces ese dibujo de bart simpsom 🙂

    1. Mouse dice:

      eso se llama ascii art

Los comentarios estan cerrados

Comparte lo que sabes

Categorias

Últimas entradas

Quasar es un proyecto Open Source basado en el Framework Vue que nos permite desarrollar proyectos de todo tipo, por eje...

Continuando el post de «Introducción a Retrofit» donde realizamos una breve preparación a lo que es el uso de la librerí...

Editar un documento PDF no es tan sencillo como editar un archivo de texto por ejemplo, para editar archivos PDFs necesi...

¿Alguna vez tuviste la necesidad de hacer una captura de pantalla de una página web? Si es así, seguramente buscaste y d...

Herramientas

Generador de Enlaces a Whatsapp