AlphaComposite Transparency with repaint overlaps into black

Question

So I have an image on top of another panel, and that image is transparent so you can see the panel beneath it. What I\'m trying to do is use repaint() to fade the image (whi

Answer 1

You need to restore the state of the Graphics context BEFORE the paintComponent method exists. This is very important, as the Graphics context is a shared resource, all the components that need to be updated will be given the same Graphics, so now every thing after you component is painted will share the some AlphaComposite...

A better solution would be to create temporary copy of the Graphics context, apply what ever settings you want to it and dispose of it after you have finished. This will ensure that what ever changes you make to the Graphics context won't be carried on after the method exists...

public void paintComponent(Graphics g)
{
    super.paintComponent(g);
    float alpha = 1f-(.01f*(float)opcounter);
    // Create your own copy...
    Graphics2D g2d = (Graphics2D)g.create();
    g2d.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_IN, alpha);
    g2d.drawImage(img, 0, 0, null);
    // Don't forget to dispose of it
    g2d.dispose();
}

Remember, you create it, you dispose it!

Update

Try using AlphaComposite.SRC_OVER instead...

import java.awt.AlphaComposite;
import java.awt.BorderLayout;
import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import javax.imageio.ImageIO;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.Timer;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;

public class TestFadeOut {

    public static void main(String[] args) {
        new TestFadeOut();
    }

    public TestFadeOut() {
        EventQueue.invokeLater(
                        new Runnable() {
            @Override
            public void run() {
                try {
                    UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
                } catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
                }

                JFrame frame = new JFrame("Testing");
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.setLayout(new BorderLayout());
                frame.add(new TestPane());
                frame.pack();
                frame.setLocationRelativeTo(null);
                frame.setVisible(true);
            }
        });
    }

    public class TestPane extends JPanel {

        private float alpha = 1f;
        private float diff = -0.02f;
        private BufferedImage img;

        public TestPane() {
            try {
                img = ImageIO.read(new File("C:\\Users\\swhitehead\\Documents\\My Dropbox\\Ponies\\url.png"));
                Timer timer = new Timer(40, new ActionListener() {
                    @Override
                    public void actionPerformed(ActionEvent e) {
                        alpha += diff;
                        if (alpha < 0) {
                            diff *= -1;
                            alpha = diff;
                        } else if (alpha > 1f) {
                            diff *= -1;
                            alpha = 1f + diff;
                        }
                        repaint();
                    }
                });
                timer.setRepeats(true);
                timer.setCoalesce(true);
                timer.start();
            } catch (IOException ex) {
                ex.printStackTrace();
            }
        }

        @Override
        public Dimension getPreferredSize() {
            return img == null ? super.getPreferredSize() : new Dimension(img.getWidth(), img.getHeight());
        }

        @Override
        protected void paintComponent(Graphics g) {
            super.paintComponent(g);
            if (img != null) {
                Graphics2D g2d = (Graphics2D) g.create();
                g2d.setComposite(AlphaComposite.SrcOver.derive(alpha));
                int x = getWidth() - img.getWidth();
                int y = getHeight() - img.getHeight();
                g2d.drawImage(img, x, y, this);
                g2d.dispose();
            }
        }
    }
}

Have a look at Composting Graphics for more details...