How to Use Two Images in Java?

Question

I am trying to make a game with a background. I used one movable image, and it works. Here is my source code:

Class 1 (RType.java):

package sprites;

import javax.swing.JFrame;

public class RType extends JFrame {
     /**
      * 
      */
     private static final long serialVersionUID = 1L;
     public RType() {
         add(new Background());
         add(new Board());

         setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
         setSize(800, 600);
         setLocationRelativeTo(null);
         setTitle("Game");
         setResizable(true);
         setVisible(true);
     }

     public static void main(String[] args) {
         new RType();
     }
}

Class 2 (Board.java):

package sprites;

import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Toolkit;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.KeyAdapter;
import java.awt.event.KeyEvent;

import javax.swing.JPanel;
import javax.swing.Timer;

public class Board extends JPanel implements ActionListener {
     /**
      *
      */
     private static final long serialVersionUID = 1L;
     private Timer timer;
     private Sprite sprite;

     public Board() {
         addKeyListener(new TAdapter());
         setFocusable(true);
         setDoubleBuffered(true);

         sprite = new Sprite();

         timer = new Timer(5, this);
         timer.start();
     }

     public void paint(Graphics g) {
         super.paint(g);

         Graphics2D g2d = (Graphics2D) g;
         g2d.drawImage(sprite.getImage(), sprite.getX(), sprite.getY(), this);

         Toolkit.getDefaultToolkit().sync();
         g.dispose();
     }

     public void actionPerformed(ActionEvent e) {
         sprite.move();
         repaint();
     }

     private class TAdapter extends KeyAdapter {
         public void keyPressed(KeyEvent e) {
             sprite.keyPressed(e);
         }

         public void keyReleased(KeyEvent e) {
             sprite.keyReleased(e);
         }
     }
}

Class 3 (Sprite.java):

package sprites;

import java.awt.Image;
import java.awt.event.KeyEvent;

import javax.swing.ImageIcon;

public class Sprite {
     private String craft = "Sprite.jpg";

     private int dx;
     private int dy;
     private int x;
     private int y;
     private Image image;

     public Sprite() {
          ImageIcon ii = new ImageIcon(this.getClass().getResource(craft));
          image = ii.getImage();
          x = 40;
          y = 60;
     }

     public void move() {
          x += dx;
          y += dy;
     }

     public int getX() {
          return x;
     }

     public int getY() {
          return y;
     }

     public Image getImage() {
          return image;
     }

     public void keyPressed(KeyEvent e) {
          int key = e.getKeyCode();
          if(key == KeyEvent.VK_LEFT) {
               dx = -3;
          }

          if(key == KeyEvent.VK_RIGHT) {
               dx = 3;
          }

          if(key == KeyEvent.VK_UP) {
               dy = -3;
          }

          if(key == KeyEvent.VK_DOWN) {
               dy = 3;
          }
     }

     public void keyReleased(KeyEvent e) {
          int key = e.getKeyCode();
          if(key == KeyEvent.VK_LEFT) {
               dx = 0;
          }

          if(key == KeyEvent.VK_RIGHT) {
               dx = 0;
          }

          if(key == KeyEvent.VK_UP) {
               dy = 0;
          }

          if(key == KeyEvent.VK_DOWN) {
               dy = 0;
          }
     }
}

Class 4 (Background.java):

package sprites;

import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Image;

import javax.swing.ImageIcon;
import javax.swing.JPanel;

public class Background extends JPanel {
     /**
      *
      */
     private static final long serialVersionUID = 1L;

     Image nook;

     public Background() {
          ImageIcon ii = new ImageIcon(this.getClass().getResource("nook 013.jpg"));
          nook = ii.getImage();
     }

     public void paint(Graphics g) {
          Graphics2D g2d = (Grahpics2D) g;
          g2d.drawImage(nook, 10, 10, null);
     }
}

The background class seems to not be working. I have added the class into the JFrame by doing add(new Background());, but it is not working. Help?!!? The movable image class is working just fine.

Answer 1

So will the BorderLayout (I know that it's default) put the background behind the character?

No. Most layout managers a two dimensional so you can't add components on top of one another using the same parent panel. So the following will not work:

     add(new Background());
     add(new Board());

Instead you need code like:

Board board = new Board();
Background background = new Background();
background.setLayout( new BorderLayout() );
background.add(board);
add(background, BorderLayout.CENTER);

This still won't work because the board is opaque and will paint over top of the background. You can solve this problem by making the Board non-opaque.

In reality the Background/Board should be a single component. Its job would be to paint the background and then paint the Sprites.

move the sprite with the arrow keys?

Don't use a KeyListener. See Motion Using the Keyboard for the reasons and a solution that uses Key Bindings.

Also, Swing is double buffered by default, so there is no need to make the component double buffered.

Answer 2

1. You are not providing any constraint to orient your component at different location:

     add(new Background());
     add(new Board());
   

   JFrame uses BorderLayout as default. It has FIRST, LAST, CENTER etc type of constraint to orient it's component. You can use them as for example: add(new Background(), BorderLayout.CENTER);

2. Don't use paint(Graphics g) for custom painting. Override paintComponent(Graphics g) function and don't forget to call super.paintComponent(g) inside it.