Can't load Image one time using getGraphics() method

Question

Hi I'm new to java GUI Programming. I created Jframe(MainFrame) and add JPanel(OutPanel) Which has another Jpanel(InnerPanel). I try to achieve drawing Image in InnerPanel, not drawing OutPanel. I want OutPanel used to be just Container. So as you see TestA. I get Graphics from InnerPanel in OutPanel's paintComponent() which is overided method.

So finally I can draw using InnerPanel's Graphics in OutPanel's paintComponent() method. but It couldn't work well. It couldn't draw Image one time when program starts. when I hided window and shown again, the program shows image. Even though that is part of Image, not all Image.

import java.awt.Color;
import java.awt.Graphics;
import java.awt.Image;
import java.awt.image.BufferedImage;

import javax.swing.JFrame;
import javax.swing.JPanel;


public class TestA{

    private static Image image = GUI.loadImage("PlayerBoard.jpg");


    public static void main(String[] args) {
        TestA testA = new TestA();
    }


    public TestA() {

        JFrame mainFrame = new JFrame("Main Frame");
        mainFrame.setLayout(null);
        mainFrame.setSize(500, 500);
        mainFrame.setVisible(true);
        mainFrame.setBackground(Color.black);
        mainFrame.setLocation(800, 400);

        OutPanel outPanel = new OutPanel();

        mainFrame.getContentPane().add(outPanel);
        mainFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        outPanel.repaint();
    }

    private class OutPanel extends JPanel {

        JPanel innerPanel;

        public OutPanel() {

            this.setLayout(null);
            this.setLocation(0, 0);
            this.setSize(500, 50);
            this.setBackground(Color.red);

            innerPanel = new JPanel();
            this.innerPanel.setSize(400, 50);
            this.innerPanel.setVisible(true);
            this.add(innerPanel);

        }

        @Override
        protected void paintComponent(Graphics g) {
            // TODO Auto-generated method stub
            super.paintComponent(g);

            int width = 500;
            int height = 50;

            BufferedImage resized = new BufferedImage(width, height, BufferedImage.TYPE_INT_ARGB_PRE);
            Graphics gBuffer = resized.createGraphics();
            gBuffer.drawImage(TestA.image, 0, 0, width, height, this);

            Graphics gPanel = innerPanel.getGraphics();
            gPanel.drawImage(resized, 0, 0, width, height, this);
        }
    }
}

So I try diffrerent way(TestB). Only different thing is I just moved drawImage() method and getGraphics() thing to InnerPanel's paintComponent() from OutPanel's paintComponent(). Here's another Code TestB. and It works well.

Why this happens. Is it relates to context?. What is Context. and could I draw InnerPanel's Image in OutPanel?

import java.awt.Color;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Image;
import java.awt.RenderingHints;
import java.awt.image.BufferedImage;

import javax.swing.JFrame;
import javax.swing.JPanel;

import java.awt.Color;
import java.awt.Graphics;
import java.awt.Image;
import java.awt.image.BufferedImage;

import javax.swing.JFrame;
import javax.swing.JPanel;

public class TestB {

    private static Image image = GUI.loadImage("PlayerBoard.jpg");

    public static void main(String[] args) {
        TestB testB = new TestB();
    }

    public TestB() {

        JFrame mainFrame = new JFrame("Main Frame");
        mainFrame.setLayout(null);
        mainFrame.setSize(500, 500);
        mainFrame.setVisible(true);
        mainFrame.setBackground(Color.black);
        mainFrame.setLocation(800, 400);

        OutPanel outPanel = new OutPanel();

        mainFrame.add(outPanel);

        outPanel.repaint();

    }

    private class OutPanel extends JPanel {

        JPanel innerPanel;

        public OutPanel() {

            this.setLayout(null);
            this.setLocation(0, 0);
            this.setSize(500, 50);
            this.setBackground(Color.red);

            innerPanel = new InnerPanel(this);
            this.innerPanel.setSize(500, 50);
            this.innerPanel.setVisible(true);
            this.add(innerPanel);

            this.repaint();
        }
    }

    private class InnerPanel extends JPanel {

        OutPanel outPanel;

        public InnerPanel(OutPanel outPanel) {
            this.outPanel = outPanel;
        }

        @Override
        protected void paintComponent(Graphics g) {
            // TODO Auto-generated method stub
            super.paintComponent(g);

            int width = 500;
            int height = 50;

            Graphics2D g2d = (Graphics2D) g;
            g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
            g.drawImage(TestB.image, 0, 0, width, height, this);
        }
    }
}

Answer 1

The paintComponent() method of a component is responsible for painting itself only. It should never know or care about any other component.

I want OutPanel used to be just Container.

Then do just that. Create the panel and set the layout manager for the outer panel and then add the outer panel to the JFrame.

Then create your inner panel and add it to the outer panel. Make sure you override the getPreferredSize() method of the inner panel so the layout manager of the outer panel can do its job.

Read the section from the Swing tutorial on Custom Painting for more information and working examples to start with.