Home/ Questions/Q 3341968
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T00:47:02+00:00

I’m doing a project where i need some custom swing components. So far I

  • 0

I’m doing a project where i need some custom swing components. So far I have made a new button with a series of images (the Java Metal look doesn’t fit with my UI at all). Ive implemented MouseListener on this new component and this is where my problem arises. My widget changes image on hover, click etc except my MouseListener picks up mouse entry into a the entire GridLayout container instead of into the image. So I have an image of about 200*100 and the surrounding container is about 400*200 and the mouseEntered method is fired when it enters that GridLayout section (even blank space parts of it) instead of over the image. How can I make it so that it is only fired when I hover over the image? Ive tried setting size and bounds and other attributes to no avail.

EDIT: Here’s a demonstration of my issue. As you can see (sort of, colors are very similar) the bottom right button is highlighted just by entering its section of the GridlLayout. I only want it highlighted when I’m over the image actual, not the GridLayout section.

alt text

I Won’t add the MouseListener methods because they just involve switching the displayed image.

public customWidget()
{
    this.setLayout(new FlowLayout());
    try {
        imageDef=ImageIO.read(new File("/home/x101/Desktop/buttonDef.png"));
        imageClick=ImageIO.read(new File("/home/x101/Desktop/buttonClick.png"));
        imageHover=ImageIO.read(new File("/home/x101/Desktop/buttonHover.png"));
        current=imageDef;
    } catch (IOException e) 
    {

        e.printStackTrace();
    }
    this.addMouseListener(this);
}

protected void paintComponent(Graphics g)
{
    super.paintComponents(g);
    g.drawImage(current, 0, 0, current.getWidth(), current.getHeight(), null);

}

EDIT: added code section

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I assume your image contains ONLY 4 ‘customWidget’ objects (in a 2×2 grid).

    Your code is working as I would expect. Your MouseListener methods are responding to MouseEvents for ‘customWidget’ (not the image drawn in ‘customWidget’), which is sized to take up 1/4 of the image, so they will respond when it enters the enlarged area. The error is actually in your Test program, because you are allowing the custom button widget to be larger than the image.

    If you want a Test program that provides an image similar to yours, you should create a larger grid (say 4×4), and then only place your buttons in every other grid node. Place an empty component into the gaps.

    • 0