Thread: Background image trouble on GUI.

Hey guys, I have a little trouble concerning this GUI below. What I tried to do is to add a background to a JFrame by creating a panel whom I set as the "background" and then adding the other panels to this one. The problem is that once the program is run It does not display all the buttons until you scroll over them and it does not display the JLabels at all. Do you perhaps have a suggestion about what i could do to solve this problem?

here is the code.

     import java.awt.*;
   import javax.swing.*;
   import java.io.*;
 
   public class HomeScreen  extends JPanel
   {
   //public variables
      JFrame home;
      ImageIcon icon;    
 
      public HomeScreen()
      throws IOException
      {
         initframe();
         components();		
      }
 
      void initframe()
      throws IOException
      {
         home = new JFrame();
         home.setSize(600,400);		
         home.setTitle("Welcome to ENG-IT-AF");
         home.setVisible(true);
         home.setResizable(true);
         home.setLocationRelativeTo(null);
         home.setDefaultCloseOperation(javax.swing.WindowConstants.DISPOSE_ON_CLOSE);
 
      }
 
      void components()
      throws IOException
      {
 
 
      	//panels & setting the background
			JPanel backg = new JPanel();
			LayoutManager layout = new OverlayLayout(backg);
			backg.setLayout(layout);
			home.add(backg);
 
			JPanel backimage = new JPanel();
         ImageIcon image = new ImageIcon("ENTER AN IMAGE HERE");
         backimage.add(new JLabel(image));
			backg.add(backimage);
 
         JPanel pcomp = new JPanel();
         pcomp.setLayout(new GridLayout(2,2,5,5));
			home.add(backg);
			backg.add(pcomp);
 
      	//images and rescaling
         ImageIcon icon1 = new ImageIcon("ENTER ANY IMAGE HERE");
         Image image1 = icon1.getImage().getScaledInstance(200, 100, Image.SCALE_SMOOTH);
         icon1.setImage(image1);
 
         ImageIcon icon2 = new ImageIcon("ENTER ANY IMAGE HERE");
         Image image2 = icon2.getImage().getScaledInstance(200, 100, Image.SCALE_SMOOTH);
         icon2.setImage(image2);
 
      	// labels 
         JLabel lab1 = new JLabel("                              ARE YOU SOUTH AFRICAN?");
         lab1.setBounds(0,0,200,40);
         pcomp.add(lab1);
 
         JLabel lab2 = new JLabel("                              ARE YOU ENGLISH?");
         lab2.setBounds(0,0,200,40);
         pcomp.add(lab2);
      	//buttons
         JButton b1 = new JButton(icon1);
         b1.setBounds(0,0,500,300);
         pcomp.add(b1);
 
         JButton b2 = new JButton(icon2);
         b2.setBounds(0,0,300,300);
         pcomp.add(b2);
      }
      public static void main(String[] args)
      throws IOException
      {
         new HomeScreen();
      }
   }

any help would be greatly appreciated thanks.

Instead of doing it by adding your background as a component behind the other components (which is messy), why don't you just override paintComponent and paint the background image in there?

Originally Posted by Pydra

Do you perhaps have a suggestion about what i could do to solve this problem?

It's hard to know where to begin - it's a mess. You're setting the frame visible before you add any components to it, you don't call pack() on it to lay out the components, you're adding the overlay panels in the wrong order, panels are opaque by default, so you need to make the top one transparent, setting bounds or sizes on GridLayout components is pointless because it sizes them to fit the grid - you should use the hgap andvgap constructor arguments (read the API docs!), and a panel border if needed... etc. I got bored at that point.

Even if you reworked that code into something reasonable, Kevin's suggestion is just so much cleaner and simpler.

I think you'll find some time spent on the Swing Tutorial rewarding.