JComponent not opaque

[Olivier Legat]

Howdy folks,

So I made an extension of a JPanel called MyCanvas and it performs just as I want. However I realized that I don't plan on adding JComponents to a MyCanvas, so I thought it would be better to extend a JComponent instead.

Unfortunately when I extend a JComponent it doesn't paint the background. I found out that (by reading this) it's recommended to use a JPanel instead.

Because I'm curious individual I looked up the Source Code of JPanel and I don't see where it paints the background, hence it should possible to paint the background using a JComponent.

It is true? Can the JComponent paint the background? Or should I stick we extending a JPanel?

public class MyCanvas extends JPanel {
	/**
	 * Protected instance variables
	 */
	protected CanvasNode canvasNode;
	protected UndoManager undoManager;
	
	private Dimension dim;
	
	// Grid / snap control vars:
	private CanvasGrid grid;
	private boolean drawGrid;
	private boolean drawGridOnTop;
	
	public MyCanvas(Dimension dim) {
		this.canvasNode = TreeManager.get().addCanvas(this);
		this.undoManager = new UndoManager();
		this.dim = dim;
		this.grid = new CanvasGrid(dim);
		this.drawGrid = true;
		this.drawGridOnTop = false;

		// Get background color:
		this.setOpaque(true);
		this.setBackground(Color.WHITE);

		this.setSize(dim);
		this.setPreferredSize(this.dim);
		setDoubleBuffered(true);
	}
	
	public void paintComponent(Graphics g) {
		/* My drawing code here */
	}
}

Thanks

[Paul Clapham]

First somebody said plainly that JComponent doesn't paint its background. And then you put together a small piece of test code which proved that was the case. Good work. So what more do you want?

You can't find anything in JPanel's source code which paints the background, because that sort of thing is done by the PanelUI object which does the rendering for whatever the current look-and-feel is.

And yes, JPanel is the standard replacement for the old AWT Canvas class.

[Rob Spoor]

I don't get why your JComponent doesn't paint the background. Consider this example:

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.event.*;

public class Test
{
    public static void main(final String[] args)
    {
        EventQueue.invokeLater(new Runnable()
        {
            public void run()
            {
                Image image = new ImageIcon(args[0]).getImage();
                JFrame frame = new JFrame();
                frame.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
                frame.setLayout(new FlowLayout());
                frame.add(new MyPanel(image));
                frame.add(new MyComponent(image));
                frame.pack();
                frame.setLocationRelativeTo(null);
                frame.setVisible(true);
            }
        });
    }
}

class MyPanel extends JPanel
{
    private Image image;

    public MyPanel(Image image)
    {
        this.image = image;
    }

    @Override
    public Dimension getPreferredSize()
    {
        return new Dimension(image.getWidth(this), image.getHeight(this));
    }

    @Override
    protected void paintComponent(Graphics g)
    {
        super.paintComponent(g);
        int w = getWidth();
        int h = getHeight();
        g.drawLine(0, 0, w, h);
        g.drawLine(0, h, w, 0);
        g.drawImage(image, 0, 0, w, h, this);
    }
}

class MyComponent extends JComponent
{
    private Image image;

    public MyComponent(Image image)
    {
        this.image = image;
    }

    @Override
    public Dimension getPreferredSize()
    {
        return new Dimension(image.getWidth(this), image.getHeight(this));
    }

    @Override
    protected void paintComponent(Graphics g)
    {
        super.paintComponent(g);
        int w = getWidth();
        int h = getHeight();
        g.drawLine(0, 0, w, h);
        g.drawLine(0, h, w, 0);
        g.drawImage(image, 0, 0, w, h, this);
    }
}

I see two images next to each other if I run this code.

[Olivier Legat]

Thank you Paul and Rob for your replies :)

Paul Clapham wrote:First somebody said plainly that JComponent doesn't paint its background. And then you put together a small piece of test code which proved that was the case. Good work. So what more do you want?

You can't find anything in JPanel's source code which paints the background, because that sort of thing is done by the PanelUI object which does the rendering for whatever the current look-and-feel is.

Well I'm a curious and stubborn individual. If someone tells me something is impossible then I want make sure I understand why that is. But what you've said about the PanelUI does explain quite well. Many thanks :)


I think you mis-understood me Rob if I mod your code as such and run it using a transparent PNG image I get a Red image and a Not-blue image.

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.event.*;

public class Test
{
        public static void main(final String[] args)
        {
                EventQueue.invokeLater(new Runnable()
                        {
                                public void run()
                                {
                                        Image image = new ImageIcon(args[0]).getImage();
                                        JFrame frame = new JFrame();
                                        frame.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
                                        frame.setLayout(new FlowLayout());
                                        JPanel p = new MyPanel(image);
                                        p.setBackground(Color.red);
                                        frame.add(p);
                                        JComponent c =new MyComponent(image);
                                        c.setBackground(Color.blue);
                                        frame.add(c);
                                        frame.pack();
                                        frame.setLocationRelativeTo(null);
                                        frame.setVisible(true);
                                }
                        });
        }
}

class MyPanel extends JPanel
{
        private Image image;

        public MyPanel(Image image)
        {
                this.image = image;
        }

    @Override
            public Dimension getPreferredSize()
        {
                return new Dimension(image.getWidth(this), image.getHeight(this));
        }

    @Override
            protected void paintComponent(Graphics g)
        {
                super.paintComponent(g);
                int w = getWidth();
                int h = getHeight();
                g.drawLine(0, 0, w, h);
                g.drawLine(0, h, w, 0);
                g.drawImage(image, 0, 0, w, h, this);
        }
}

class MyComponent extends JComponent
{
        private Image image;

        public MyComponent(Image image)
        {
                this.image = image;
        }

    @Override
            public Dimension getPreferredSize()
        {
                return new Dimension(image.getWidth(this), image.getHeight(this));
        }

    @Override
            protected void paintComponent(Graphics g)
        {
                super.paintComponent(g);
                int w = getWidth();
                int h = getHeight();
                g.drawLine(0, 0, w, h);
                g.drawLine(0, h, w, 0);
                g.drawImage(image, 0, 0, w, h, this);
        }
}

[Rob Spoor]

I've checked the Swing code a bit, and the cause is the lack of a UI class. JPanel has BasicPanelUI as its UI, whereas JComponent has none.
JComponent.paintComponent calls update(Graphics, Component) on it's UI (if there is one). The default of that is this:

    public void update(Graphics g, JComponent c) {
        if (c.isOpaque()) {
            g.setColor(c.getBackground());
            g.fillRect(0, 0, c.getWidth(),c.getHeight());
        }
        paint(g, c);
    }

You can get the same behaviour by changing the JComponent subclass' paintComponent to this:

    @Override
    protected void paintComponent(Graphics g)
    {
        super.paintComponent(g);
        int w = getWidth();
        int h = getHeight();
        if (isOpaque())
        {
            Color oldColor = g.getColor();
            g.setColor(getBackground());
            g.fillRect(0, 0, w, h);
            g.setColor(oldColor);
        }
        g.drawLine(0, 0, w, h);
        g.drawLine(0, h, w, 0);
        g.drawImage(image, 0, 0, w, h, this);
    }

That's one approach. There is one even better - use the pluggable look&feel (plaf) mechanism properly:

// JCanvas is your own canvas implementation
public class JCanvas extends JComponent
{
    /**
     * The UID class ID.
     */
    private static final String uiClassID = "CanvasUI";

    /**
     * Creates a new canvas.
     */
    public JCanvas()
    {
        updateUI();
    }

    /**
     * Sets the L&F object that renders this component.
     *
     * @param ui The {@link CanvasUI} L&F object.
     */
    public void setUI(CanvasUI ui)
    {
        super.setUI(ui);
    }

    /**
     * Returns the {@link CanvasUI} that is providing the current look and feel.
     *
     * @return The {@link CanvasUI} object that renders this component.
     */
    public CanvasUI getUI()
    {
        return (CanvasUI)ui;
    }

    @Override
    public void updateUI()
    {
        if (UIManager.get(getUIClassID()) != null)
        {
            setUI((CanvasUI)UIManager.getUI(this));
        }
        else
        {
            setUI(new BasicCanvasUI());
        }
    }

    @Override
    public String getUIClassID()
    {
        return uiClassID;
    }
}

public abstract class CanvasUI extends ComponentUI
{
}

public class BasicCanvasUI extends CanvasUI
{
    public static ComponentUI createUI(JComponent c)
    {
        return new BasicCanvasUI();
    }

    @Override
    public void installUI(JComponent c)
    {
        super.installUI(c);
        JCanvas canvas = (JCanvas)c;
        canvas.setOpaque(true);
    }
}

This is the basic approach for creating JComponent sub classes. I myself have created a few successfully this way; that's also why the JCanvas class has comments - those are copied (and slightly modified) from one of my own component classes.

[Rob Spoor]

I've used this URL for instructions on that last part. It has a nice example that shows you the tricks.

[Olivier Legat]

Aaaah... brilliant Rob, that's precisely what I was looking for, spot on You're a genius.

Cheers mateys

[Rob Spoor]

You're welcome