views:

24435

answers:

3

I am developing a simple platform game using Java using BlueJ as the IDE. Right now I have player/enemy sprites, platforms and other items in the game drawn using polygons and simple shapes. Eventually I hope to replace them with actual images.

For now I would like to know what is the simplest solution to setting an image (either URL or from local source) as the 'background' of my game window/canvas?

I would appreciate it if it isn't something long or complex as my programming skills aren't very good and I want to keep my program as simple as possible. Kindly provide example codes with comments to elaborate on their function, and also if it's in its own class, how to call on relevant methods used by it on other classes.

Thank you very much.

+3  A: 

The answer will vary slightly depending on whether the application or applet is using AWT or Swing.

(Basically, classes that start with J such as JApplet and JFrame are Swing, and Applet and Frame are AWT.)

In either case, the basic steps would be:

  1. Draw or load an image into a Image object.
  2. Draw the background image in the painting event of the Component you want to draw the background in.

Step 1. Loading the image can be either by using the Toolkit class or by the ImageIO class.

The Toolkit.createImage method can be used to load an Image from a location specified in a String:

Image img = Toolkit.getDefaultToolkit().createImage("background.jpg");

Similarly, ImageIO can be used:

Image img = ImageIO.read(new File("background.jpg");

Step 2. The painting method for the Component that should get the background will need to be overridden and paint the Image onto the component.

For AWT, the method to override is the paint method, and use the drawImage method of the Graphics object that is handed into the paint method:

public void paint(Graphics g)
{
    // Draw the previously loaded image to Component.
    g.drawImage(img, 0, 0, null);

    // Draw sprites, and other things.
    // ....
}

For Swing, the method to override is the paintComponent method of the JComponent, and draw the Image as with what was done in AWT.

public void paintComponent(Graphics g)
{
    // Draw the previously loaded image to Component.
    g.drawImage(img, 0, 0, null);

    // Draw sprites, and other things.
    // ....
}

Simple Component Example

Here's a Panel which loads an image file when instantiated, and draws that image on itself:

class BackgroundPanel extends Panel
{
    // The Image to store the background image in.
    Image img;
    public BackgroundPanel()
    {
        // Loads the background image and stores in img object.
        img = Toolkit.getDefaultToolkit().createImage("background.jpg");
    }

    public void paint(Graphics g)
    {
        // Draws the img to the BackgroundPanel.
        g.drawImage(img, 0, 0, null);
    }
}

For more information on painting:

coobird
Thank you for your answer. I have some questions-1. Where should the image concerned be located? Can you give an example sourcepath of the image as I'm unsure how it should be laid out.
Dew
2. Say if I create a class called 'Background' using the above code, what method do I need to call upon, in my 'Game' class (which controls the view, size of the game window) from the Background class to make the background image appear? Please give an example.
Dew
Here's the code I currently use to set the background colour of my game window- view = new WorldView(world, width, height); view.setBackground(new Color(230, 245, 255));
Dew
Those are questions that concern more with design rather than actual painting of a background image. You may either want to post another question with relevant information, or seek more of a dialogue-type help from one of the forums out there.
coobird
Alright, thank you very much for your help.
Dew
A: 

Firstly create a new class that extends the WorldView class. I called my new class Background. So in this new class import all the java packages you will need in order to override the paintBackground method. this should be: import city.soi.platform.*; import java.awt.Graphics2D; import java.awt.Image; import java.awt.image.ImageObserver; import javax.swing.ImageIcon; import java.awt.geom.AffineTransform;

Next after the class name make sure that it says extends WorldView. Something like this: public class Background extends WorldView Then declare the variables game of type Game and an image variable of type Image something like this: private Game game; private Image image;

Then in the constructor of this class make sure the game of type Game is in the signature of the constructor and that in the call to super you will have to initialise the WorldView, initialise the game and initialise the image variables something like this: super(game.getCurrentLevel().getWorld(), game.getWidth(), game.getHeight()); this.game = game; bg = (new ImageIcon("lol.png")).getImage();

Then you just override the paintBackground method in exactly the same way as you did when overriding the paint method in the Player class. Just like this: public void paintBackground(Graphics2D g) { float x = getX(); float y = getY(); AffineTransform transform = AffineTransform.getTranslateInstance(x,y); g.drawImage(bg, transform, game.getView()); }

Now finally you have to declare a class level reference to the new class you just made in the Game class and initialise this in the Game constructor something like this: private Background image;

And in the Game constructor: image = new Background(this);

Lastly all you have to do is add the background to the frame! That's the thing im sure we were all missing. To do that you have to do something like this after the variable frame as been declared: frame.add(image);

Make sure you add this code just before frame.pack(); Also make sure you use a background image that isn't too big!

Now thats it! Ive noticed that the game engines can handle jpg and png image formats but could also support others. Even though this helps include a background image in your game, it is not perfect! Because once you go to the next level all your platforms and sprites are invisible lol and all you can see is your background image and any JLabels/Jbuttons you have included in the game.

A: 

good job..i`ll try it...thx

Kevin R. Octavian
This should be added as a comment, not another answer.
Richard