problem in adding image to JFrame

Question

Hi,

I'm having problems in adding a picture into JFrame, something is missing probebly or written wrong. here are the classes:

main class:

public class Tester

    {
        public static void main(String args[])
        {
            BorderLayoutFrame borderLayoutFrame = new BorderLayoutFrame();
            borderLayoutFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
            borderLayoutFrame.setSize(600,600);
            borderLayoutFrame.setVisible(true);
        }
    }

public class BorderLayoutFrame extends JFrame implements ActionListener 
 {
     private JButton buttons[]; // array of buttons to hide portions
     private final String names[] = { "North", "South", "East", "West", "Center" };
     private BorderLayout layout; // borderlayout object
     private PicPanel picture = new PicPanel();

     // set up GUI and event handling

     public BorderLayoutFrame()
     {
         super( "Philosofic Problem" );
         layout = new BorderLayout( 5, 5 ); // 5 pixel gaps
         setLayout( layout ); // set frame layout
         buttons = new JButton[ names.length ]; // set size of array

         // create JButtons and register listeners for them

         for ( int count = 0; count < names.length; count++ ) 
         {
             buttons[ count ] = new JButton( names[ count ] );
             buttons[ count ].addActionListener( this );
         }
         add( buttons[ 0 ], BorderLayout.NORTH ); // add button to north
         add( buttons[ 1 ], BorderLayout.SOUTH ); // add button to south
         add( buttons[ 2 ], BorderLayout.EAST ); // add button to east
         add( buttons[ 3 ], BorderLayout.WEST ); // add button to west
         add( picture, BorderLayout.CENTER ); // add button to center
    }

    // handle button events

    public void actionPerformed( ActionEvent event )
    {

    } 

  }

I'v tried to add the image into the center of layout.

here is the image class:

public class PicPanel extends JPanel
{
    Image img;
    private int width = 0;
    private int height = 0;

    public PicPanel()
    {
        super();
        img = Toolkit.getDefaultToolkit().getImage("table.jpg");
    }
    public void paintComponent(Graphics g)
    {
         super.paintComponents(g);
         if ((width <= 0) || (height <= 0))
         {
             width = img.getWidth(this);
             height = img.getHeight(this);
         }
         g.drawImage(img,0,0,width,height,this);
    }
}

Please your help, what is the problem? thanks

BTW: i'm using eclipse, which directory the image suppose to be in?

Answer 1

In Eclipse, if you are using the path "table.jpg" then you need that image to be at the top level of the project.

For a bit more info on the Eclipse project structure see this Stack Overflow question.

You may want to try using an ImageIcon to display the image instead of drawing it on the panel.

The following code will create an ImageIcon that you can just add to the JPanel.

ImageIcon pic = new ImageIcon(getClass().getResource("myimage.jpeg");

This uses a fancy way to load the pic so that it will work when put into a Jar file.

Answer 2

There's several issues with the code you've posted:

• You should use getContentPane().add() instead of simply add() in your BorderLayoutFrame class.

• You should really use SwingUtilities.invokeLater() to launch your JFrame from the tester class. Something like this:

  SwingUtilities.invokeLater(new Runnable() { @Override public void run() { System.setProperty("DEBUG_UI", "true");

      BorderLayoutFrame blf = new BorderLayoutFrame();
      blf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      blf.setSize(600,600);
      blf.setVisible(true);
  }
  

  });

• Don't use Toolkit to load images! In the following code, if "Table.jpg" is in the same package as PicPanel, the image will correctly load.

  public PicPanel() { super(); try { rUrl = getClass().getResource("Table.jpg"); if (rUrl != null) { img = ImageIO.read(rUrl); } } catch (IOException ex) { Logger.getLogger(PicPanel.class.getName()).log(Level.SEVERE, null, ex); } }

• In PicPanel.PaintComponent() you call super.paintComponents() is the 's' a typeo?

• In PicPanel.PaintComponent(), you don't need all the width/height stuff, just do this:

  g.drawImage(img, 0, 0, getWidth(), getHeight(), this);

And avoid the call to super.paintComponent all together because you're painting an image, why do you want the panel to paint at all?

My final implementation of your stuff:

public class Main {

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        SwingUtilities.invokeLater(new Runnable() {
            @Override
            public void run() {
                System.setProperty("DEBUG_UI", "true");

                BorderLayoutFrame blf = new BorderLayoutFrame();
                blf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                blf.setSize(600,600);
                blf.setVisible(true);
            }
        });
    }

}

class BorderLayoutFrame extends JFrame implements ActionListener
{
    private final BorderLayout layout;
    private final JButton[] buttons;
    private final String names[] = {"North", "South", "East", "West", "Center"};

    public BorderLayoutFrame() {
        super( "Philosofic Problem" );
        layout = new BorderLayout( 5, 5 );
        getContentPane().setLayout( layout );
        buttons = new JButton[ names.length ];

        for (int i=0; i<names.length; i++)
        {
            buttons[i] = new JButton(names[i]);
            buttons[i].addActionListener(this);
        }

        getContentPane().add(buttons[0], BorderLayout.NORTH);
        getContentPane().add(buttons[1], BorderLayout.SOUTH);
        getContentPane().add(buttons[2], BorderLayout.EAST);
        getContentPane().add(buttons[3], BorderLayout.WEST);
        getContentPane().add(new PicPanel(), BorderLayout.CENTER);
    }

    public void actionPerformed(ActionEvent e) {
        // ignore
    }

}

class PicPanel extends JPanel
{
    private URL rUrl;
    private BufferedImage img;



    public PicPanel() {
        super();
        try {
            rUrl = getClass().getResource("UtilBtn.png");
            if (rUrl != null) {
                img = ImageIO.read(rUrl);
            }
        } catch (IOException ex) {
            Logger.getLogger(PicPanel.class.getName()).log(Level.SEVERE, null, ex);
        }
    }

    @Override
    protected void paintComponent(Graphics g) {
        //super.paintComponent(g);

        g.drawImage(img, 0, 0, getWidth(), getHeight(), this);
    }

}