How to add jlabel image hovering?

0x29A picture 0x29A · Jul 27, 2012 · Viewed 8.2k times · Source

How would I go upon adding JLabel hovering? Like when you move your mouse over top a JLabel a and new image will overlap it. I know how to make it work with buttons, but the same technique will not work for JLabels. Will anyone guide me towards adding JLabel hovering? Please and thanks.

package src;

import java.awt.Dimension;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;

/*
 * @Author - 0x29A
 * 
 * 
 */
public class Jframe {

    public static void main(final String args[]) {

        /*
         * @Images
         */
        final ImageIcon icon = new ImageIcon("Data/button.png");
        final JLabel label = new JLabel(icon);

        final ImageIcon icon1 = new ImageIcon("Data/button1.png");
        final JLabel label1 = new JLabel(icon1);

        final ImageIcon icon2 = new ImageIcon("Data/button2.png");
        final JLabel label2 = new JLabel(icon2);

        final ImageIcon icon3 = new ImageIcon("Data/button3.png");
        final JLabel label3 = new JLabel(icon3);

        final ImageIcon icon4 = new ImageIcon("Data/button4.png");
        final JLabel label4 = new JLabel(icon4);

        final ImageIcon icon5 = new ImageIcon("Data/button5.png");
        final JLabel label5 = new JLabel(icon5);

        final ImageIcon icon6 = new ImageIcon("Data/background.png");
        final JLabel label6 = new JLabel(icon6);

        /*
         * @Image Location
         */
        label.setBounds(282, 255, 96, 96);
        label1.setBounds(384, 255, 96, 96);
        label2.setBounds(282, 153, 96, 96);
        label3.setBounds(384, 153, 198, 96);
        label4.setBounds(181, 152, 96, 96);
        label5.setBounds(181, 255, 96, 96);
        label6.setBounds(0, 0, 765, 503);

        /*
         * @Frame
         */
        final JFrame frame = new JFrame("test");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setPreferredSize(new Dimension(765, 503));
        frame.setLayout(null);
        frame.add(label);
        frame.add(label1);
        frame.add(label2);
        frame.add(label3);
        frame.add(label4);
        frame.add(label5);
        frame.add(label6);
        frame.pack();
        frame.setResizable(false);
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
    }
}

Answer

David Kroukamp picture David Kroukamp · Jul 27, 2012

Made a quick example, it uses a MouseListener and MosueAdapter to monitor mouseExited() and mouseEntered() events on the JLabel, and when either of these methods are called (i.e when the mouse is over the label or not) the picture is changed:

import java.awt.BorderLayout;
import java.awt.Container;
import java.awt.event.MouseAdapter;
import javax.swing.*;

public class LabelHoverTest extends JFrame {

    Icon pic1;
    Icon pic2;
    JLabel label;

    public LabelHoverTest(String title) {
        super(title);
        pic1 = UIManager.getIcon("OptionPane.informationIcon");
        pic2 = UIManager.getIcon("OptionPane.questionIcon");
        createAndShowUI();
    }

    public static void main(String[] args) {
        SwingUtilities.invokeLater(new Runnable() {

            @Override
            public void run() {
                new LabelHoverTest("Label Hover Test").setVisible(true);
            }
        });
    }

    private void createAndShowUI() {
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        setResizable(false);
        addComponentsToPane(getContentPane());
        setSize(300, 300);
        setLocationRelativeTo(null);
        setVisible(true);
    }

    private void addComponentsToPane(Container contentPane) {
        label = new JLabel(pic1);

        contentPane.add(label, BorderLayout.CENTER);

        label.addMouseListener(new MouseAdapter() {

            @Override
            public void mouseEntered(java.awt.event.MouseEvent evt) {
                label.setIcon(pic2);
            }

            @Override
            public void mouseExited(java.awt.event.MouseEvent evt) {
                label.setIcon(pic1);
            }
        });
    }
}