En este post dejo una forma de como utilizar imágenes en un JTable ademas de implementar MouseListener para realizar diferentes acciones para cada celda.
Herramientas
– Netbeans 7.3
– imagenes JPG
Nivel: Intermedio
Duración: 15 minutos
Proyecto Netbeans
1. Partiremos de un proyecto netbeans con la siguiente estructura:
JTableImage - Source Packages -- com.bolivia.app ----- ImageRenderer.java ----- Interfaz.java ----- MyTableModel.java -- com.bolivia.res ----- default.jpg
Interfaz: Es un JFrame que a su vez contiene un JButton (JButton1) y un JTable (JTable1)
MyTableModel: Es una clase que se extiende de DefaultTableModel y nos sirve para sobreescribir un método propio de este (isCellEditable) que nos des-habilitara la edición de contenido de cada celda.
ImageRenderer: Es una clase que nos permitirá trabajar con imágenes en las celdas de un JTable
default.jpg: Es una imagen *.JPG que se mostrara en las celdas del JTable cuando estas no tengan asignado un archivo imagen, en este ejemplo no es más que una imagen en blanco de dimensiones 256×256 pixeles.
2. A continuación las clases del proyecto
MyTableModel.java
package com.bolivia.app; import javax.swing.table.DefaultTableModel; /** * @web https://www.jc-mouse.net/ * @author Mouse */ public class MyTableModel extends DefaultTableModel { @Override public boolean isCellEditable(int row, int column) { return false; } }
ImageRenderer.java
package com.bolivia.app; import java.awt.Component; import java.io.File; import java.util.HashMap; import java.util.Iterator; import java.util.Map; import javax.swing.ImageIcon; import javax.swing.JLabel; import javax.swing.JTable; import javax.swing.table.DefaultTableCellRenderer; /** * @web https://www.jc-mouse.net/ * @author Mouse */ public class ImageRenderer extends DefaultTableCellRenderer{ private JLabel lb = new JLabel(); //imagen que se muestra cuando la celda esta vacia private ImageIcon icon = new ImageIcon( getClass().getResource("/com/bolivia/res/default.jpg") ); //para contener las imagenes que se vayan cargando private Map iconos = new HashMap() ; @Override public Component getTableCellRendererComponent(JTable table, Object value, boolean isSelected, boolean hasFocus, int row, int column) { lb.setText((String) value); File fichero; // if( value !=null ) { fichero = new File( value.toString() ); //comprueba que fichero exista if( fichero.exists() ) { //busca la imagen en el MAP if( ya_existe( value.toString() ) ) { //si ya existe, extrae la imagen del MAP lb.setIcon( getIcono( value.toString() ) ); } else //No existe { //Agrega la imagen al map iconos.put(value.toString(), bToIcon(fichero) ); //extrae y muestra lb.setIcon( getIcono( value.toString() ) ); } } else //si no existe, muestra imagen por default { lb.setIcon(icon); } } else { lb.setIcon(icon); } return lb; } /** * Comprueba que una imagen ya exista en memoria * @param String key identificador */ private boolean ya_existe( String key ) { Iterator it = iconos.entrySet().iterator(); while (it.hasNext()) { Map.Entry e = (Map.Entry)it.next(); if( e.getKey().equals(key) ) return true; } return false; } /** * Extrae una imagen del MAP dado su KEY * @param String key identificador unico * @return ImageIcon */ private ImageIcon getIcono( String key ) { ImageIcon imageIcon = icon; Iterator it = iconos.entrySet().iterator(); while (it.hasNext()) { Map.Entry e = (Map.Entry)it.next(); if( e.getKey().equals(key) ) { imageIcon = (ImageIcon) e.getValue(); break; } } return imageIcon; } /** * Dado la ruta de un archivo de imagen, carga este en un ImageIcon y retorna * @param File fichero */ private ImageIcon bToIcon( File fichero ) { ImageIcon imageIcon = new ImageIcon( fichero.getAbsolutePath() ); return imageIcon; } }//--> fin clase
Interfaz.java
Primeramente declaramos una nueva instancia a MyTableModel:
private MyTableModel modelo = new MyTableModel();
A continuación añadimos al constructor de clase lo siguiente:
01 public Interfaz() { 02 initComponents(); 03 04 //------------------------------------------------------------------------- 05 String[] nombreColumnas = {"Imagen","Imagen","Imagen"}; 06 Object[][] datosFila = { }; //vacio 07 modelo.setDataVector(datosFila, nombreColumnas); 08 this.jTable1.setModel(modelo); 09 //se añade el ImageRenderer a cada columna del JTable 10 jTable1.getColumnModel().getColumn(0).setCellRenderer( new com.bolivia.app.ImageRenderer() ); 11 jTable1.getColumnModel().getColumn(1).setCellRenderer( new com.bolivia.app.ImageRenderer() ); 12 jTable1.getColumnModel().getColumn(2).setCellRenderer( new com.bolivia.app.ImageRenderer() ); 13 jTable1.setRowHeight(256);//altura de celda 14 //Evento MouseListener 15 jTable1.addMouseListener(new java.awt.event.MouseAdapter() { 16 17 /** 18 * Cuando se haga clic en una celda que contenga una imagen, esta abrira un JDialog mostrando 19 * la imagen completa 20 */ 21 @Override 22 public void mouseClicked(java.awt.event.MouseEvent evt) { 23 int row = jTable1.rowAtPoint(evt.getPoint()); 24 int col = jTable1.columnAtPoint(evt.getPoint()); 25 if ( row >= 0 && col >= 0 ) 26 { 27 //si celda contiene imagen 28 if( modelo.getValueAt(row, col) != null ) 29 { 30 //obtiene la ruta que corresponde a la celda donde se hizo el clic 31 File fichero = new File( modelo.getValueAt(row, col).toString() ); 32 //se carga la imagen en un jlabel 33 JLabel picLabel = new JLabel(new ImageIcon( fichero.getAbsolutePath() )); 34 //se muestra la imagen en el jdialog 35 JOptionPane.showMessageDialog(null, picLabel, "Vista Previa", JOptionPane.PLAIN_MESSAGE, null); 36 } 37 } 38 } 39 }); 40 //------------------------------------------------------------------------- 41 }
En este ejemplo estamos utilizando tres columnas por lo que debemos añadir a cada columna un ImageRenderer, si quisiéramos añadir más columnas, igualmente añadimos a cada columna nueva un ImageRenderer.
El JTable ademas implementa un MouseListener y el metodo mouseClicked para detectar cuando el usuario haga un clic sobre una celda, al realizar esta acción, se abrira un JDialog que mostrara la imagen completa
Finalmente, el código para el JButton1, este botón nos servirá para abrir un JFileChooser para añadir imágenes al JTable, las imágenes se añadirán una después de otra, cuando ya no hallan celdas disponibles, se añadirá una nueva fila.
01 private void jButton1ActionPerformed(java.awt.event.ActionEvent evt) { 02 03 JFileChooser fileChooser = new JFileChooser(); 04 FileNameExtensionFilter filter = new FileNameExtensionFilter("Archivo de Imagen","jpg","png"); 05 fileChooser.setFileFilter(filter); 06 fileChooser.setCurrentDirectory( new File(System.getProperty("user.home")) ); 07 //fileChooser.setCurrentDirectory( new File( "E:\\temporal\\" ) ); 08 int result = fileChooser.showOpenDialog(this); 09 if (result == JFileChooser.APPROVE_OPTION) { 10 File selectedFile = fileChooser.getSelectedFile(); 11 // 12 int f = modelo.getRowCount();//cantidad de filas 13 int c = modelo.getColumnCount();//cantidad de columnas 14 boolean ok = true; 15 //recorre todo el TableModel buscando una celda vacia para agregar la imagen 16 for( int i=0; i<f;i++ ) 17 { 18 if( ok ) 19 { 20 for( int j=0; j<c; j++ ) 21 { 22 if( modelo.getValueAt(i, j) == null ) 23 { 24 this.modelo.setValueAt( selectedFile.getAbsolutePath() , i, j ); 25 this.jTable1.repaint(); 26 ok=false; 27 break; 28 } 29 } 30 } 31 else 32 { 33 break; 34 } 35 } 36 37 //Si el TableModel esta lleno, agrega una nueva fila y en la primer posicion añade la imagen 38 if( ok ) //añade nueva fila 39 { 40 modelo.setRowCount( modelo.getRowCount() + 1 ); 41 this.modelo.setValueAt( selectedFile.getAbsolutePath() , modelo.getRowCount()-1, 0 ); 42 this.jTable1.repaint(); 43 } 44 45 } 46 }
Ejecutamos y listo
Yapa un videito de como queda todo
Descargate el proyecto completo en este «enlace michi«
Segunda parte del tutorial [Crea tu blog con el patrón MVC y php]. En esta 2da parte toca ver lo que es la creación del[...]
¿Qué es SCRUM? SCRUM es un modelo de referencia que define un conjunto de prácticas y roles, y que puede tomarse como pu[...]
Kotlin es un lenguaje de programación relativamente nuevo que ha ido ganando terreno en el desarrollo de aplicaciones pa[...]
JavaFX un producto de Sun Microsystems/Oracle Corporation que salio a la luz para competir con tecnologías como Flash o[...]
En este tutorial crearemos una aplicación que bloqueara toda la pantalla de la PC y no nos dejara realizar ninguna tarea[...]
Cuando creamos reportes en iReport que son un poco complicadas o reportes personalizados, osea, tratando de evitar el cl[...]
