CS 201 Advanced Object-Oriented Programming Lab 3, Asteroids Part 1 Due: February 17/18, 11:30 PM

Transcription

1 CS 201 Advanced Object-Oriented Programming Lab 3, Asteroids Part 1 Due: February 17/18, 11:30 PM Objectives to gain experience using inheritance Introduction to the Assignment This is the first of a 2-part lab to create a program to play the video game Asteroids, a classic Atari game first introduced in In writing this program you will gain experience using inheritance. In particular, you will write some classes that extend others, as well as creating a superclass to capture similarities between some classes in your program. For Part 1 of the Asteroids assignment, you will create a ship that you can control with the keyboard. At this point, there will be no asteroids to shoot. We will add those next week. Here are some snapshots from this program: Here is the starting screen. The ship is in the center and pointing up. The user can use the up arrow key to accelerate and the down arrow key to decelerate. The left and right arrow keys are used to rotate the spaceship. The Program Design This project will have 3 classes, 1 of which I provide to you in its entirety. These classes are: Animation - the class that provides the framework for animation. I provide this class. 1

2 AsteroidsGame - this class extends Animation. You will put the functionality that is specific to Asteroids in this class. Ship - a class to manipulate the spaceship that the user controls You can download Animation.java from the course website. This class is completely written for you. YOU SHOULD NOT CHANGE IT! The API for this class is attached at the end of this document. You will also be using some classes and interfaces that Java provides that you are not yet familiar with. These are described briefly below. KeyListener. KeyListener is an interface that allows you to write methods that react to the user typing on a keyboard. Your AsteroidsGame class will implement KeyListener and define the keypressed method to handle the key input the user uses to move and rotate the ship. Polygon. Polygon is a class that defines a closed shape consisting of multiple straight lines joined at corners. Your ship will have an instance variable whose type is Polygon. Graphics2D. This is a subclass of the Graphics class we have previously used that provides a few extra methods that are very useful for this lab: public void translate (x, y) public void rotate (double theta) public void draw (Shape s) Writing the Program Create a new Eclipse project called Asteroids. You should download Animation.java from the course website and import it into your project. YOU SHOULD NOT CHANGE THIS CLASS. To import Animation.java into your project, do the following. Create a new project for Asteroids. Open the project and select the src folder. Open the File menu and select Import. In the window that comes up, open General and select File System. Click Next. Then click the Browse button and select the folder that contains the Animation.java file that you downloaded. Select Animation.java in the right column and click Finish. Step 0: Experiment with Translate and Rotate If you observe how Asteroids works, you will notice that the ship both moves and rotates. To draw a ship, you might think that you would need to calculate where the corners of the ship 2

3 are to determine where they should appear on the screen. This would involve doing some trigonometry. (I heard that groan!) Fortunately, using the Graphics2D class, it is much simpler. Instead of rotating the shape, you essentially rotate the axes you are drawing on, something like the drawing shown at the right. (The axes are displayed just so you can understand what is happening. They do not normally appear.) Moving the ship works in a similar way. You move the axes rather than the ship. The advantage of doing this is that you always draw your shapes the same way, independent of where they appear on the screen or how they are oriented. In particular, you should draw your shapes with their center at (0, 0). For example, if the shape is 20 pixels wide and 40 pixels tall, its 3 corners are (-10, 20), (0, -20), and (10, 20), like in the image at the right. To draw the ship with its center at (x, y) and rotated 45 degrees to the right as in the rotated figure below, we would say: g2d.translate (x, y); // Move the axes so the origin is at (x, y) g2d.rotate (Math.PI/4); // Rotate the axes 45 degrees clockwise g2d.draw (shipshape); // Draw the ship The argument to rotate is given in radians. A complete rotation (360 degrees) is 2π radians. shipshape is the Polygon instance variable inside the Ship class. It defines the 3 corners of the ship. After you draw the shape, you should reverse the transformation by calling rotate and translate in the reverse order and with negated values from the original calls. In this case, you would add these lines after the lines above: // Undo the rotation g2d.rotate (-Math.PI/4); // Undo the translation g2d.translate (-x, -y); Do the lab preparation worksheet if you have not already to gain a better understanding of how translation and rotation work before beginning Asteroids. Step 1: Draw a spaceship (0, 0) Now, you are ready to begin the Asteroids project. Create a class AsteroidsGame that extends Animation, which extends JComponent. In this lab, the drawing we will be doing is similar to the drawing that you did for the IdCard lab. In particular, you should define a main method that creates a JFrame and a paintcomponent method to paint the various shapes on the display. So, begin by creating a blank window of an appropriate size with a black background. You should place the code to do this in the AsteroidsGame class that you create. You should notice that you have a compiler error in your AsteroidsGame class, saying The type AsteroidsGame must implement the inherited abstract method Animation.nextFrame(). In the next step, there will be instructions about what should go in this method. For now, you should declare the method, but keep its body empty. Run your program. You should see a window with a black background. Next, create a Ship class with an instance variable of type Polygon, which you will use to hold the triangular ship shape. The Ship constructor should take parameters that identify the coordinates where the middle of the ship should start. Save these in instance variables so that 3

4 they can be passed to the translate method when you paint the ship. Then, call the addpoint method defined in the Polygon class to add the endpoints of the lines that make up the ship: public void addpoint(int x, int y) Remember that the values you pass in here should have (0,0) in the center of the ship as in our example above. They should not use the center values passed in to the Ship constructor; those are used in your call to translate. Finally, define a paint method in the Ship class that draws the ship. This method should be very similar to the paintcomponent method that you played with in Step 0. This method should take a Graphics object as a parameter. The first thing that it should do is cast the graphics object into a Graphics2D object using this code: Graphics2D g2d = (Graphics2D) g; Then, you can use this code to draw your shape. g2d.translate (centerx, centery); g2d.draw(shipshape); g2d.translate (-centerx, -centery); This will draw your ship with the center at (centerx, centery). Change the constructor in AsteroidsGame to construct a Ship and save it in an instance variable. Change the paintcomponent method in AsteroidsGame to call the paint method in Ship in addition to drawing the black background. Now, when you run your program there should be a ship in the middle of the window. Step 2: Make your ship move Let s add a move method to the Ship class. This is the method we will call to animate the ship, so each time it is called, the ship should move just a short distance. Since the ship is pointing up, let s write the move method so that the ship moves up. To cause it to move up, simply decrease the value of centery a small amount. Now, we will need to call this method inside the animation loop. Recall that the animation loop simply calls nextframe repeatedly. So, in the AsteroidsGame class, change the nextframe method to call the ship s move method. As the last step, you need to start the animation. To do this add a call to start() at the bottom of AsteroidGame s main method. Run your program. You should see the ship move up at a constant speed until it flies out of the window! Your first animation! Step 3: Get the ship to re-enter at the bottom of the screen What you want to do next, is cause the ship to wrap around so that if it goes off the top, it should reappear at the bottom. How can you write code to check when it has gone off the top? Where should it reappear? Write the code to do that. Step 4: Control the speed of your spaceship The user will use the up-arrow and down-arrow keys to move the ship. Up-arrow will accelerate the ship up to some maximum speed. Down-arrow will slow it down and eventually stop it. The ship cannot go in reverse. To handle the user typing on the keys, your AsteroidsGame class must implement KeyListener. This interface requires you to declare 3 methods: public void keypressed (KeyEvent event) public void keyreleased (KeyEvent event) 4

5 public void keytyped (KeyEvent event) The only one you need to define is keypressed. The other two need to be declared, but their bodies should be empty. As with other listeners, you will need to add a listener so that these methods get called. The method that you need to call is: public void addkeylistener (KeyListener l) To determine which key a user has typed, call getkeycode from the KeyEvent class: public int getkeycode() The values of interest for this lab are: KeyEvent.VK_UP KeyEvent.VK_DOWN up arrow key - used to accelerate down arrow key - used to decelerate KeyEvent.VK_LEFT left arrow key - used to rotate left (step 5) KeyEvent.VK_RIGHT right arrow key - used to rotate right (step 5) If the user types the up arrow key, you should call a method in the Ship class to increase the speed of the ship, but don t go above some maximum value. If the user types the down arrow key, decrease the ship s speed, but don t go below 0. Remember that speed is controlled by how far a ship moves on consecutive frames. So, to make the ship move faster, you will increase this distance. To go slower, decrease it. Remember to add a key listener to the AsteroidsGame in its constructor. In addition, add this line to the constructor: setfocusable(true); This is required for your game to accept any input. Now, when you run your program and type the up arrow key, the ship should move up the window, going faster each time you hit up-arrow. Also, test that the down-arrow key slows the ship down and eventually stops it. Step 5: Add controls to rotate the spaceship Next add the controls to rotate the ship. Right-arrow should rotate the ship right. Left-arrow should rotate the ship left. You will need an instance variable in your ship to remember the amount of rotation. You will also need to add the call to the Graphic2D s rotate method to cause the rotation to happen as described in the introduction to this lab. Test your right and left arrow keys. Step 6: Move a rotated ship in the direction it points Now, let s see what happens if we try to move a rotated ship. Yikes! It still goes straight up and straight down, not in the direction the ship is pointing! Unfortunately, we can t avoid doing some trig here. Essentially, we need to take the ship s speed and apply some of it vertically and some of it horizontally. Here is a method that will do that. Speed is the number of pixels that you would want to move if it was going straight up. rotation is the amount of rotation, centery is where the vertical middle of the ship is before it moves and centerx is its horizontal middle before it moves. centerx and centery here are the same values that you would pass to the translate method of Graphics2D. This method updates centerx and centery to cause the ship to move in the direction it is pointing. Try it. 5

6 " protected void calculatexy() { " " double xoffset = speed * Math.sin(rotation); " " double yoffset = -speed * Math.cos(rotation); " " centery = centery + yoffset; " " centerx = centerx + xoffset; " } Now, you may also notice that if the ship moves off the screen on the left, right or bottom, it is gone forever. You need to adjust your move method to have the ship wraparound in any direction. Extra credit ideas You should not work on extra credit until you have all the steps above working well and you have added comments and used good style. You will not receive extra credit points if you have not done a good job on the basic assignment. Get the ship to wrap properly if the user resizes the window. Add a button to allow the user to restart the game. After handling the button click, you will need to call requestfocusinwindow() in your AnimationGame class to allow arrow presses to continue to work. Allow the user to hyperspace the ship. This should cause the ship to disappear and reappear at a random location on the screen. (Don t use the space bar as the input key as we will use that next week to shoot bullets.) Grading 10 Step 1: Draw a spaceship 10 Step 2: Make your ship move 5 Step 3: Get the ship to re-enter at the bottom of the screen 10 Step 4: Control the speed of your spaceship 5 Step 5: Add controls to rotate the spaceship 10 Step 6: Move the rotated ship in the direction it points 25 Comments (including javadoc comments) 25 Style 5 each Extra credit Turning in Your Work Here are instructions that will create a jar file that you can double-click on. Use the Export..Jar command as for. Instead, click Next and click Next again on the following window. Then you should see a window that says JAR Manifest Specification at the top. The last field in that window says Main class. Click the Browse button and select AsteroidGame. Then click Finish. You should now have a jar file that you can double-click on. Please submit your jar file on Ella. 6

7 API for the Animation class Class Animation Animation provides the basic functionality to create games involving animation. Subclasses should define the nextframe method. This method is called every 30 milliseconds, giving the game an opportunity to update the display and do whatever operations it needs to during the animation. Animation public Animation() Constructs a new Animation. public void run() Runs the animation. This method should not be called directly. Instead, to start the animation, call the start() method. public void start() Starts the animation public void stop() Stops the animation. 7