Razmazio : JAVA Side Scroller Game Programming part1

TUTORIAL NO 14

Razmazio : JAVA Side Scroller Game Programming part1

In this tutorial you will learn: 1. Timer class 2. Animations using timer 3. Side Scroller game 4. Game Programming 5. Changing screens in the game 6. Swing Animations 7. Event handling 8. JAVA awt 9. JAVA swing 10. Adapters Today I am going to teach you how to make a simple yet fun game in JAVA. This tutorial will be divided into two parts so that thing remain simple and everyone could easily understand. In this game we will try to copy the basics features of SUPER MARIO. Like character walking jumping etc. In this tutorial we will be working in JAVA SWING. We will setup JPanel and JFrame class. I will not focus on making the menu and all that because we have covered it in our catch the eggs game tutorial. Basic step: Download and install ECLIPSE and set up a JAVA PROJECT. Then create a new class and name it Razmazio. Then follow the steps 1.IMPORT STATEMENTS First of all write these import statements in your .java file
  1. import java.awt.*;
  2. import javax.swing.*;
  3. import javax.swing.Timer;
  4. import java.awt.event.*;
  5. import java.util.*;
We require event import for keyboard, awt and swing imports for visual design and animation. We will be using separate class for JPanel and a public class for JFrame. First thing is setting up the panel and after that we will setup a class in which we will setup the frame. Then we will do composition i.e make and object of the panel class and add it to frame. 2. SETTING UP THE GAMEPANEL CLASS
  1. class GamePanel extends JPanel implements ActionListener {
  2.  
  3.         // Creating images for single objects
  4.         protected Image rz_background = new ImageIcon("backgrounds\\bkg5.png").getImage(); // Background Image
  5.         protected Image rz_still_right = new ImageIcon("razmazio\\rz_still_right.png").getImage(); // Standing still
  6.         protected Image rz_still_left = new ImageIcon("razmazio\\rz_still_left.png").getImage(); // Walking left
  7.         protected Image rz_walk_left2 = new ImageIcon("razmazio\\rz_walk_left2.png").getImage(); //
  8.         protected Image rz_walk_right2 = new ImageIcon("razmazio\\rz_walk_right2.png").getImage(); // Walking right
  9.         protected Image rz_jump_right = new ImageIcon("razmazio\\rz_right_jump.png").getImage(); // Jumping
  10.         protected Image rz_jump_left = new ImageIcon("razmazio\\rz_left_jump.png").getImage(); //
  11.         protected Image pipe = new ImageIcon("razmazio\\pipe1.png").getImage(); // pipe
  12.  
  13.         Image obj = rz_still_right; // Temporary Image reference
  14.  
  15.         final private int BKMIN_X = 1000, BKMAX_X = 10000; // Min and Max of
  16.                                                                                                                 // background
  17.         public int bk_x = 695; // background x and y coordinates
  18.         public int bk_y = 535;
  19.         public int rz_x = 600; // character x and y coordinates
  20.         public int rz_y = 615;
  21.  
  22.         static int direction = 0; // 0=still 1=up , 2=right , 3=left , 4=down
  23.  
  24.         static boolean moveableRight = true; // variable for collision detection
  25.         static boolean moveableLeft = true;
  26.         static boolean moveableDown = false;
  27.         boolean jumpright = true;
  28.  
  29.         static boolean jump = false; // For jump
  30.         private Timer time;
  31.  
  32.         int run = 0;
First of all we need to import all the images from our folders we need the background image, pipe image and character images for standing still right and left as well as character running images to make a running animation. After including the images we make a temporary image reference so that we can switch the animation quickly when running. After that we make and set coordinates of background and character. We set the values according to our background and frame size because we want the character to be in the middle and we will just move the background to make it look like running animation. After that we will set up a Boolean to detect jump and timer class object to slow down our animation. In the end we make a counter run to alternate the two images according to the counter value. 3.GAMEPANEL CONSTRUCTOR:
  1. GamePanel() {
  2.         setLayout(null);
  3.         time = new Timer(30, this); // starting a timer and passing the
  4.                                                                         // actionlistener for the running animation
  5.         time.start(); // starting
  6.  
  7.         addKeyListener(new KeyAdapter() // Movement of razmazio
  8.         {
  9.         public void keyPressed(KeyEvent kp) {
  10.  
  11.         if (kp.getKeyCode() == KeyEvent.VK_RIGHT
  12.                                                 & moveableRight == true) {
  13.                 direction = 2; // right
  14.                 }
  15.                 if ((kp.getKeyCode() == KeyEvent.VK_LEFT)
  16.                                                 & moveableLeft == true) {
  17.                 direction = 3; // left
  18.                 }
  19.                 if (kp.getKeyCode() == KeyEvent.VK_SPACE) {
  20.                         if (jump == false & rz_y == 615) // if character standing of
  21.                                                                                                                 // platform
  22.                         {
  23.                                 jump = true;
  24.                                 moveableDown = true;
  25.                                 if (direction == 2)
  26.                                         jumpright = true;
  27.                                         if (direction == 3)
  28.                                                 jumpright = false;
  29.                                         }
  30.                                 }
  31.                         } // end keyPressed
  32.  
  33. public void keyReleased(KeyEvent kr) {
  34.         if (direction == 2)
  35.                 obj = rz_still_right; // if direction is right
  36.         if (direction == 3)
  37.                 obj = rz_still_left; // if direction is left
  38.  
  39.                 direction = 0; // set still image
  40.                 }
  41.                 });// end anonymous class and KeyListener
  42.         }// end constructor
In the constructor we first set the center panel layout after that set the timer to 30ms and pass this for this class actionlistener. In the actionlistener we will check for conditions to switch the animation after every 30ms. After that we make an anonymous class for keylistener and check which key is pressed, then set the boolean values for left and right accordingly. If space is pressed we will provide the functionality of jump and we first check whether the character is already in a jump or not if it’s not then we turn the Boolean to true and set the character image by checking the current direction of the character. In the end we simply provide the functionality when no key is pressed then set the character standing still image. 4. Writing Action performed
  1. public void actionPerformed(ActionEvent e) {
  2.                 if (direction == 2)
  3.                         right();
  4.                 if (direction == 3)
  5.                         left();
  6. }
In this function we fill simply call the right or left function (which sets the values of left and right according the the int run counter that we declared above). 5. Writing the paintComponent:
  1. public void paintComponent(Graphics g) {
  2.  
  3.                 super.paintComponent(g);
  4.                 Graphics2D g2d = (Graphics2D) g;
  5.  
  6.                 // setting background points and cash in the game
  7.                 setBackground(g2d);
  8.                 setPipes(g2d);
  9.  
  10.                 // checking jump collision and enemy death
  11.                 Jump();
  12.  
  13.                 if (rz_y == 615 & direction != 3 & direction != 2) // to turn razmazio
  14.                                                                                                                         // in normal still
  15.                                                                                                                         // state after jump
  16.                 {
  17.                         if (obj == rz_jump_left)
  18.                                 obj = rz_still_left;
  19.                         if (obj == rz_jump_right)
  20.                                 obj = rz_still_right;
  21.                 }
  22.                 g2d.drawImage(obj, rz_x, rz_y, this); // Drawing the character image
  23.  
  24.                 repaint();
  25.         } // end paintComponent
In the paint component we simply set the background and pipes and check whether the character is in jump or not. After that we simply set the character animation using the temp obj object of the image class according to the direction variable. 6.Writing the set Animation functions:
  1. void Jump() // Jump mechanism
  2.         {
  3.  
  4.                 if (moveableDown == true) {
  5.                         if (jump == true & rz_y >= 450) // For upward motion during jump
  6.                         {
  7.                                 if (jumpright == true)
  8.                                         obj = rz_jump_right;
  9.                                 else
  10.                                         obj = rz_jump_left;
  11.  
  12.                                 rz_y--;
  13.                                 if (rz_y <= 450)
  14.                                         jump = false;
  15.                         }
  16.                         if (jump == false & rz_y < 615) // For downward motion during jump
  17.                         {
  18.                                 if (jumpright == true)
  19.                                         obj = rz_jump_right;
  20.                                 else
  21.                                         obj = rz_jump_left;
  22.                                 rz_y++;
  23.                         }
  24.                 }
  25.  
  26.         }// end up
First of all for jump we check whether the character can move down or not if it can then we simply check if we can jump after that we set the jump image according to the direction we are facing and decrease the y coordinate to take a jump from platform. In the second if we set conditions for coming back down. For that we first set the image and increase the y coordinate till the platform is reached.
  1.         void left() {
  2.                 if (moveableLeft == true & bk_x > BKMIN_X) {
  3.                         bk_x -= 8; // decrease xcoord while moving left
  4.  
  5.                         if (run % 3 == 0 | run % 5 == 0)
  6.                                 obj = rz_still_left; // set image
  7.                         else
  8.                                 obj = rz_walk_left2;
  9.                         run++;
  10.                 }// end if
  11.         }// end left
Here we simply check for left Boolean and greater than minimum x coordinate then decrement the x coordinate for left movement. After that we set the animation according the run counter value if divisible by 3 or 5 then we set it for still image and if not then running image.
  1.         void right() {
  2.                 if (moveableRight == true & bk_x < BKMAX_X - 800) {
  3.                         bk_x += 8; // increasing xcoord while moving right
  4.  
  5.                         if (run % 3 == 0 | run % 5 == 0)
  6.                                 obj = rz_still_right;
  7.                         else
  8.                                 obj = rz_walk_right2;
  9.                         run++;
  10.                 }// end if
  11.         }// end right
Here we do exactly the same thing as above just increase the x coordinate and set the image according the run counter which is incremented every time it is called. 7.WRITING THE PUBLIC FRAME CLASS:
  1. public class Razmazio extends JFrame {
  2.         GamePanel gp = new GamePanel();
  3.  
  4.         Razmazio() {
  5.                 add(gp);
  6.                 setSize(1024, 750);
  7.                 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
  8.                 setVisible(true);
  9.  
  10.         }
  11.  
  12.         public static void main(String[] args) {
  13.                 Razmazio rz = new Razmazio();
  14.         }// end main
  15. }// end frame class
In the frame class we do the exact same thing like we always do making a panel object setting the frame size visibility etc and adding the panel in the frame. Now we have a simple side scroller in which we can move left , right and jump. We will work more on it in the next tutorial. OUTPUT: output

Comments

I'm just getting an error when I try to run this first part: run: Exception in thread "main" java.lang.RuntimeException: Uncompilable source code - Illegal static declaration in inner class GamePanel.Razmazio modifier 'static' is only allowed in constant variable declarations at GamePanel$Razmazio.main(Razmazio.java:186) Java Result: 1 BUILD SUCCESSFUL (total time: 2 seconds)

Moaz bro facing a problem your code is running but after running only an empty Frame is displaying not whole game

Add new comment