Adding in Images (What am I doing Wrong?)

Question

So I've been working on this for 2 days now, and I've gotten the basics of java.swing down (I hope, at least, as I started learning it to 2 days ago.) Anyhow, I successfully loaded a background image, but I can't seem to get the foreground one to work. I'm not sure what code you'll need, so I'll post all of it. And while you take a look at it, did I set up my JPanels correctly? (specifically the allContent and fourRows ones.)

import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.io.InputStream;
import javax.imageio.ImageIO;
import javax.swing.*;
import java.util.*;
import junit.framework.Test;


public class MainFrame {


   //Variables
   private static final String IMAGE_PATH = "imageFolder/warlordsOrganizerBackground.png";
   private static final String IMAGE_PATH2 = "imageFolder/warlordsLogo.png";
   public static JFrame programFrame;
   public static JLabel warlordsBackground;
   public static JLabel warlordsLogo;
   public static JPanel allContent;
   public static JPanel fourRows;
   public static JScrollPane scrollPane;



   //Making the parts for the GUI
   public static void createGUI(){

  //programFrame Title and Layout
  programFrame = new JFrame("Warlords Organizer");
  programFrame.setLayout(new BorderLayout());

  Icon backgroundIcon = new ImageIcon(IMAGE_PATH);
  warlordsBackground = new JLabel(backgroundIcon);

  File imageFile = new File(IMAGE_PATH);
  File imageFile2 = new File(IMAGE_PATH2);

  //Warlords Logo JLabel
  Icon logoIcon = new ImageIcon(IMAGE_PATH2);
  warlordsLogo = new JLabel(logoIcon);

  //New JPanel for GridLayout 
  fourRows = new JPanel(new GridLayout(0,4));
  fourRows.setLayout(new GridLayout());

  //Makes the Initial BorderLayout (Using allContent JPanel)
  allContent = new JPanel();
  allContent.setLayout(new BorderLayout());
  allContent.add(warlordsLogo, BorderLayout.NORTH);
  allContent.setVisible(true);
  allContent.add(fourRows, BorderLayout.CENTER);

  //Add ScrollPane / MAKE SURE TO ADD TO new JScrollPane WHERE IT NEEDS TO BE / TEXT
  scrollPane = new JScrollPane(allContent);
  scrollPane.setHorizontalScrollBarPolicy(JScrollPane.HORIZONTAL_SCROLLBAR_NEVER);
  scrollPane.setVerticalScrollBarPolicy(JScrollPane.VERTICAL_SCROLLBAR_ALWAYS);
  scrollPane.setOpaque(false);
  scrollPane.getViewport().setOpaque(false);

  //JFrame programFrame Constructors
  programFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
  programFrame.setContentPane(warlordsBackground);
  programFrame.pack();
  programFrame.setVisible(true);
  programFrame.setResizable(false);


  } // public static void createGUI() Closing

  public static void main(String[] args) {
  javax.swing.SwingUtilities.invokeLater(new Runnable() {
     public void run() {
        createGUI();
     } //public void run() Closing
  });
 }

 }

And finally, my JScrollPane. I need to do something with that, so don't mind that. I set up my project files like this, if it helps any -

After I get my image working, I'll need to figure out how to get custom fonts (the BEBAS__.ttf) so if you also have some resources for that, I'd appreciate it.

Answer 1

The way I see it (assuming the images are loading properly)...

You create the background image...

warlordsBackground = new JLabel(backgroundIcon);

And a little later, you set it as the content pane of the frame...

programFrame.setContentPane(warlordsBackground);

But you add nothing to it or the frame...

Now, the minor problem you may have, is JLabel doesn't actually have a layout manager, so even if you did add anything to it, nothing would show up...

Try doing something more like...

programFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
programFrame.setContentPane(warlordsBackground);
programFrame.setLayout(new BorderLayout());
programFrame.add(scrollPane);
programFrame.pack();
programFrame.setVisible(true);
programFrame.setResizable(false);

Additional

Now, based on your code, you seem to want to make the scroll pane transparent, but everything your adding to the scroll pane isn't. fourRows and allContent are both opaque...

The two images above are without scroll pane and with scroll pane. As you can see, the second image appears beneath the scroll pane (or through it).

The problem you have is the both fourRows and allContent are opaque (not transparent), meaning that when you add them to the scroll pane, despite the fact the scroll pane and view port are transparent, fourRows and allContent are going to block it.

You need to set fourRows and allContent to be transparent ( setOpaque(false) )