JButton icon transparent artefacts

Question

some may think I'm making a double post because I already asked a question on this subject here : JButton alpha background change with mouseover

But I have some problems, not concerning button with alpha background using transparency color but with button using transparent icons (.png). I already tried lot's of things but I still have artefacts and I really don't understand why.

Here is my code :

 public class PanelPosition extends JPanel
{
    private JButton leftArrow, rightArrow;

    public PanelPosition (int width, int height)
    {
        this.setPreferredSize(new Dimension(width,height));
        this.setBackground(new Color(0,0,0,0));

        JLabel position = new JLabel("support", JLabel.CENTER);
        position.setForeground(Color.white);

        leftArrow = new JButton(new AlphaImageIcon(new ImageIcon("pictures\\left arrow.png"),1));
        rightArrow = new JButton(new AlphaImageIcon(new ImageIcon("pictures\\right arrow.png"),1));

        leftArrow.setBackground(new Color (0,0,0,0));
        rightArrow.setBackground(new Color (0,0,0,0));

        leftArrow.setPreferredSize(new Dimension(leftArrow.getIcon().getIconWidth(), leftArrow.getIcon().getIconHeight()));
        rightArrow.setPreferredSize(new Dimension(rightArrow.getIcon().getIconWidth(), rightArrow.getIcon().getIconHeight()));

        leftArrow.setOpaque(false);
        leftArrow.setFocusPainted(false);
        leftArrow.setBorderPainted(false);
        leftArrow.setContentAreaFilled(false);
        leftArrow.addMouseListener(new MouseAdapter()
        {
             @Override
            public void mouseEntered(MouseEvent evt)
            {
                leftArrow.setIcon(new AlphaImageIcon(new ImageIcon("pictures\\left arrow.png"), (float)0.7));
            }
            @Override
            public void mouseExited(MouseEvent evt)
            {
               leftArrow.setIcon(new AlphaImageIcon(new ImageIcon("pictures\\left arrow.png"), (float)0.3));
            }
        });

        rightArrow.setOpaque(false);
        rightArrow.setFocusPainted(false);
        rightArrow.setBorderPainted(false);
        rightArrow.setContentAreaFilled(false);
        rightArrow.addMouseListener(new MouseAdapter()
        {
             @Override
            public void mouseEntered(MouseEvent evt)
            {
                rightArrow.setIcon(new AlphaImageIcon(new ImageIcon("pictures\\right arrow.png"), (float)0.7));
            }
            @Override
            public void mouseExited(MouseEvent evt)
            {
               rightArrow.setIcon(new AlphaImageIcon(new ImageIcon("pictures\\right arrow.png"), (float)0.3));
            }
        });

        add(leftArrow);
        add(position);
        add(rightArrow);

    }

}

And for those that the AlphaImageIcon raise questions, I found this class here and I simply take it : https://github.com/griffon/griffon-javatips-plugin/blob/master/src/main/com/wordpress/tipsforjava/swing/AlphaImageIcon.java

Thank's for help and sorry.

Answer 1

some may think I'm making a double post

Yes, slightly different question, but same problem.

But I have some problems, not concerning button with alpha background using transparency color but with button using transparent icons

Yes, the problem is still with alpha background. You are using an alpha background on your panel:

this.setBackground(new Color(0,0,0,0));

Get rid of the above statement or use the AlphaContainer when you add that panel to your frame.

leftArrow.setBackground(new Color (0,0,0,0));
rightArrow.setBackground(new Color (0,0,0,0));

Also, get rid of the above two statements because they do nothing since later you use:

leftArrow.setOpaque(false);
rightArrow.setOpaque(false);

which means don't paint the background. So painting the background any color will have not effect. Reread my answer and follow the blog link in your last question!

Again the summary from my blog link is that anytime you use alpha on any component you will have a painting problem unless you use one of the two solutions (there may be others) that I suggested.

Also, not sure why you have 3 states for your button. Once you move the mouse over the button it will never go back to the fully opaque state. If you are just trying to make a rollover effect then you should probably just be using:

leftArrow.setRolloverIcon(...);

instead of trying to manage the MouseListener by yourself. Then you will have two states, one the rollover and the other for the default state. Using this approach you would also only be reading the icons once, not every time the mouse enters/exits the button.