Anteriormente había compartido una pequeña guía de como trabajar con botones en java, ya sea creando un botón solo con texto, o un botón con imagen; si quieres ponerte al tanto, te invito a leer el anterior articulo. Aunque este tema este en una variedad de blogs, foros, etc; es algo que no he explicado o compartido en este blog.
Me dije a mi mismo, «Mi mismo, es la hora que muestres como cambiar la imagen ya configurada en un botón, por una nueva imagen». Interesante? Puede ser, y lo es! Lo único que hace falta es el contexto, es decir, la razón de ser para algo tan trivial.
El ejemplo mas claro para usar este pequeño evento de cambio, es el odontograma; un croquis o resumen de la dentadura del paciente. Es usado por odontologos para llevar el histórico de la dentadura de los pacientes, es por esto que el cambio de imágenes en un botón, puede ser bastante útil en este caso. El pequeño ejemplo que voy a compartir lo hice para despejar la duda de unos cuantos visitantes que han comentado en el blog, y espero que sea de gran utilidad a los futuros. Ahora si, con ustedes, el código!
Clase Principal Cambiar Imagen En Botón
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | package cambiarimagen; public class CambiarImagen{ public static void main(String[] args) { vista vi = new vista(); //creacion del objeto para el manejo de la vista en el controlador controla con = new controla(vi); //creacion del objeto del controlador, se pasa el anterior objeto al constructor con.eventos(); //invocacion para el uso de los eventos de la vista } } |
package cambiarimagen; public class CambiarImagen{ public static void main(String[] args) { vista vi = new vista(); //creacion del objeto para el manejo de la vista en el controlador controla con = new controla(vi); //creacion del objeto del controlador, se pasa el anterior objeto al constructor con.eventos(); //invocacion para el uso de los eventos de la vista } }
Clase Vista Cambiar Imagen En Botón
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | package cambiarimagen; public class vista extends javax.swing.JFrame { public vista() { initComponents(); } @SuppressWarnings("unchecked") // <editor-fold defaultstate="collapsed" desc="Generated Code"> private void initComponents() { jb1 = new javax.swing.JButton(); setDefaultCloseOperation(javax.swing.WindowConstants.EXIT_ON_CLOSE); jb1.setIcon(new javax.swing.ImageIcon(getClass().getResource("/img/diente.png"))); // NOI18N jb1.setFocusPainted(false); jb1.setFocusable(false); jb1.setHorizontalTextPosition(javax.swing.SwingConstants.CENTER); jb1.setPreferredSize(new java.awt.Dimension(73, 81)); javax.swing.GroupLayout layout = new javax.swing.GroupLayout(getContentPane()); getContentPane().setLayout(layout); layout.setHorizontalGroup( layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING) .addGroup(layout.createSequentialGroup() .addGap(107, 107, 107) .addComponent(jb1, javax.swing.GroupLayout.PREFERRED_SIZE, 73, javax.swing.GroupLayout.PREFERRED_SIZE) .addContainerGap(220, Short.MAX_VALUE)) ); layout.setVerticalGroup( layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING) .addGroup(layout.createSequentialGroup() .addGap(113, 113, 113) .addComponent(jb1, javax.swing.GroupLayout.PREFERRED_SIZE, 73, javax.swing.GroupLayout.PREFERRED_SIZE) .addContainerGap(114, Short.MAX_VALUE)) ); pack(); }// </editor-fold> // Variables declaration - do not modify public javax.swing.JButton jb1; // End of variables declaration } |
package cambiarimagen; public class vista extends javax.swing.JFrame { public vista() { initComponents(); } @SuppressWarnings("unchecked") // <editor-fold defaultstate="collapsed" desc="Generated Code"> private void initComponents() { jb1 = new javax.swing.JButton(); setDefaultCloseOperation(javax.swing.WindowConstants.EXIT_ON_CLOSE); jb1.setIcon(new javax.swing.ImageIcon(getClass().getResource("/img/diente.png"))); // NOI18N jb1.setFocusPainted(false); jb1.setFocusable(false); jb1.setHorizontalTextPosition(javax.swing.SwingConstants.CENTER); jb1.setPreferredSize(new java.awt.Dimension(73, 81)); javax.swing.GroupLayout layout = new javax.swing.GroupLayout(getContentPane()); getContentPane().setLayout(layout); layout.setHorizontalGroup( layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING) .addGroup(layout.createSequentialGroup() .addGap(107, 107, 107) .addComponent(jb1, javax.swing.GroupLayout.PREFERRED_SIZE, 73, javax.swing.GroupLayout.PREFERRED_SIZE) .addContainerGap(220, Short.MAX_VALUE)) ); layout.setVerticalGroup( layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING) .addGroup(layout.createSequentialGroup() .addGap(113, 113, 113) .addComponent(jb1, javax.swing.GroupLayout.PREFERRED_SIZE, 73, javax.swing.GroupLayout.PREFERRED_SIZE) .addContainerGap(114, Short.MAX_VALUE)) ); pack(); }// </editor-fold> // Variables declaration - do not modify public javax.swing.JButton jb1; // End of variables declaration }
Clase Controlador Cambiar Imagen En Botón
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | package cambiarimagen; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import javax.swing.ImageIcon; public class controla implements ActionListener { private vista v; public controla(vista t){ this.v = t; this.v.setVisible(true); } public void eventos(){ this.v.jb1.addActionListener(this); } @Override public void actionPerformed(ActionEvent e) { if(e.getSource()==this.v.jb1){ ImageIcon imagen = new ImageIcon("src/img/dienteVerde.png"); this.v.jb1.setIcon(imagen); } } } |
package cambiarimagen; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import javax.swing.ImageIcon; public class controla implements ActionListener { private vista v; public controla(vista t){ this.v = t; this.v.setVisible(true); } public void eventos(){ this.v.jb1.addActionListener(this); } @Override public void actionPerformed(ActionEvent e) { if(e.getSource()==this.v.jb1){ ImageIcon imagen = new ImageIcon("src/img/dienteVerde.png"); this.v.jb1.setIcon(imagen); } } }
A tener en cuenta!
Es bueno que recortes las imágenes a la medida, en este caso, son de 73×73 pixeles. Obviamente el tamaño debe ser un poco menor para que se vea estéticamente aceptable. Ademas del tamaño, le he dejado un fondo transparente, para que solo se visualice la imagen con el color.
Descargar Ejemplo Cambiar Imagen A Botón En Java
Si deseas tener el ejemplo, puedes descargar el código fuente para que puedas jugar con el código 😉 Solo pido una pequeña acción social, ya sea un +1, like, twit; lo que tu quieras 😀
excelente informacion me es de gran ayuda
Que está posando
Con todo esto
Me siento acorralado