Lab 6, CSC 102

This lab introduces the Processing library that will be used for the graphical interface of the course project.

Given Files

Retrieve the files provided for this lab by issuing a git pull in the cpe102labs directory.

Setup

In order to use the Processing library on the CSL machines, you will need to add the .jar file to your CLASSPATH. Running the following script (just once; reopen the terminal afterward) should work. For those working on their own machines, you can add the .jar file from processing.org or from my copy.

/home/akeen/public/processing_setup

Quick Overview

Open the provided Java file and read through the code. This code is written in a very simple style to conform to the requirements of and to illustrate some features of the Processing library. You will adapt this code to the project in an assignment.

Use of the Processing library begins with the definition of a class that extends PApplet and that includes a main method like the following to create an applet using the specified class.

   public static void main(String[] args)
   {
      PApplet.main("ProcessingIntro");
   }

This class overrides two important methods: setup and draw. The setup method is run once when the, in Processing terminology, "sketch" is created. The draw method is called repeatedly (by Processing) and will contain the control logic of the "sketch".

Step 1

Define a two-dimensional array to represent the "world". This grid should be 20x15. For this lab, you will use this grid to store background tiles, obstacle tiles, and a goal tile. You may use integer values to represent these different types of tiles (or you might explore the use of enums). For instance, you might store 1 at a grid location for an obstacle.

Initialize the grid with some obstacles and one goal. You can start by initializing each entry to a background and then place the obstacles (consider loops for contiguous obstacles) and the goal.

Step 2

Define a point class (or copy one that you have already written) and declare a variable to store the location of the wyvern.

Step 3

Modify the program to draw sprites for the background, obstacles, and goal. You can search the web for suitable (and class appropriate) sprites or draw your own. This lab assumes sprites that are 32x32 pixels in size. You will need to modify the given code to load these images and then to draw the images as dictated by the values in the grid defined earlier.

An example might look as follows.

Step 4

Now modify the code so that the wyvern is controlled by the WASD keys. The wyvern should move one complete cell to the left, right, up, or down, but should not travel off the grid or over an obstacle.

You will handle keyboard input by overriding the keyPressed method. The following sample code should get you started.

   public void keyPressed()
   {
      switch (key)
      {
         case 'a':
            // do something
            break;
         case 'w':
            ...
      }
   }

Step 5

Finally, modify the code so that when the wyvern reaches the goal a simple glyph animation is triggered (e.g., an ellipse that grows in size). Also, include logic to prevent movement after the goal is reached.

Demonstration

Once you have completed the above steps, demonstrate completion of this lab to your instructor.