57

I would like to use an image as a button in Java, and I tried to do this:

BufferedImage buttonIcon = ImageIO.read(new File("buttonIconPath"));
button = new JButton(new ImageIcon(buttonIcon));

But this still shows the actual button behind the image, I would only like the image to function as the button, how can I do this?

River
  • 8,585
  • 14
  • 54
  • 67
3sdmx
  • 766
  • 2
  • 6
  • 10

9 Answers9

32

Remove the border like so:

button.setBorder(BorderFactory.createEmptyBorder());

and then also the contents1:

button.setContentAreaFilled(false);

1: Taken from the solution added to the question by @3sdmx

River
  • 8,585
  • 14
  • 54
  • 67
jzd
  • 23,473
  • 9
  • 54
  • 76
  • This kinda did the trick, but there is still some sort of background from the button itself, is there a way to completly remove it? Or set it transparant? – 3sdmx Feb 04 '11 at 14:55
  • You could try setting the background to another color or transparent. Does your image have transparency or is it a solid square? – jzd Feb 04 '11 at 18:14
9

A suggestion would be to set the Image as a label and add a mouse listener to the label to detect clicks.

Example:

ImageIcon icon = ...;

JLabel button = new JLabel(icon);

button.addMouseListener(new MouseAdapter() {
  @Override
  public void mouseClicked(MouseEvent e) {
     ... handle the click ...
  }
});
SingleShot
  • 18,821
  • 13
  • 71
  • 101
thotheolh
  • 7,040
  • 7
  • 33
  • 49
1

This can be done easily in netbeans by setting the contentAreaFilled Property to False

unleashed
  • 331
  • 1
  • 5
  • 17
1
    BufferedImage buttonIcon = ImageIO.read(new File("myImage.png"));
    button = new JButton(new ImageIcon(buttonIcon));
    button.setBorderPainted(false);
    button.setFocusPainted(false);
    button.setContentAreaFilled(false);
Vladimir
  • 11
  • 1
1

just write this

button.setContentAreaFilled(false);
Adham Gamal
  • 775
  • 8
  • 13
1

buttonIcon.setBorder(new EmptyBorder(0,0,0,0));

StanislavL
  • 56,971
  • 9
  • 68
  • 98
1
button.setBorderPainted( false );
camickr
  • 321,443
  • 19
  • 166
  • 288
0

I followed below steps and i could create an 'ImageButton' successfully.

  1. Create a JButton
  2. Added an action listener
  3. Set an image icon (note i have placed the info.png icon in the src\main\resources folder and loaded using class loader). The project structure is as here. Project folder structure
  4. Set an empty Border
  5. Disabled the content area filling
  6. Disabled the focusability
  7. Added to the contentPane

PFB the code that worked for me

JButton btnNewButton = new JButton("");
btnNewButton.addActionListener(new ActionListener() {
    public void actionPerformed(ActionEvent e) {
        System.out.println("Info clicked");
    }
});

String iconfilePath = this.getClass().getClassLoader().getResource("info.png").getFile();
btnNewButton.setIcon(new ImageIcon(iconfilePath));
btnNewButton.setBounds(10, 438, 39, 31);
btnNewButton.setBorder(BorderFactory.createEmptyBorder());
btnNewButton.setContentAreaFilled(false);
btnNewButton.setFocusable(false);
contentPane.add(btnNewButton);

The output button resulted from above code is as below

enter image description here

sunil
  • 6,444
  • 1
  • 32
  • 44
0

As far i know, there is no easy way of doing it, you will need to override the "paintComponent" method of the JButton class to aint your image, if you only want to display an image and behave like a button, you can add a JPanel wich draws the image (clicky) and add a MouseListener/MouseAdapter to handle the "mousePressed" event

RRoman
  • 741
  • 9
  • 19