IAT 355 Lecture 4 Computer Graphics: Rocket. May 9, 2014IAT 3552 Outline Programming concepts –Programming Computer Graphics –Transformations –Methods.

IAT 355

Lecture 4 Computer Graphics: Rocket

May 9, 2014 IAT 355 2

Outline

g Programming concepts– Programming Computer Graphics– Transformations– Methods– Classes

May 9, 2014 IAT 355 3

Drawing a rocket

background(0);fill(255);triangle(10, 0, 0, 20, 20, 20);rectMode(CORNERS);rect(5, 20, 8, 23);rect(12, 20, 15, 23);

May 9, 2014 IAT 355 4

Now I want to draw several rockets

g Want several rockets in different locations on the screen

g I could copy and paste the code– Need to adjust all the numbers for the

new location

g Or… define a method

May 9, 2014 IAT 355 5

First method for drawing a rocket

void drawRocket() { fill(255); triangle(10, 0, 0, 20, 20, 20); rectMode(CORNERS); rect(5, 20, 8, 23); rect(12, 20, 15, 23);}

Gotcha! Once you start using methods, all code must be in methods (can’t just directly call

drawRocket() at the top of the file)

May 9, 2014 IAT 355 6

Didn’t seem to help much…

g Still just draws a rocket at one fixed location

g Need arguments that allow me to tell the program where I want the rocket!– Must figure out the relationship between the

position and the location of the rest of the parts

g Argument variables are available within the method, but not outside (method scope)

May 9, 2014 IAT 355 7

DrawRocket() with arguments

void drawRocket(int x, int y, float rot) { final int halfHeight = 10; final int halfWidth = 10; triangle(0, -halfHeight, -halfWidth, halfHeight, halfWidth,

halfHeight); rectMode(CORNERS); rect(-halfWidth + 5, halfHeight, -halfWidth + 8,

halfHeight + 3); rect(halfWidth - 8, halfHeight, halfWidth - 5,

halfHeight + 3);}

We’re purposely ignoring the arguments for now

May 9, 2014 IAT 355 8

Now I’d like to specify rotation g Currently I specify the nose position and it draws a

rocket that faces straight up

g To rotate the rocket, I’d need to figure out the new position of the vertices– Too hard!

g Instead of rotating the rocket, rotate the paper– As long as I’m rotating the paper, I may as well slide it around

as well

g To prepare for translating and rotating, first draw the rocket centered around the origin (0,0)

May 9, 2014 IAT 355 9

Add translation and rotation

void drawRocket(int x, int y, float rot) { final int halfHeight = 10; final int halfWidth = 10;

translate(x, y); rotate(rot);

triangle(0, -halfHeight, -halfWidth, halfHeight, halfWidth, halfHeight);

rectMode(CORNERS); rect(-halfWidth + 5, halfHeight, -halfWidth + 8, halfHeight + 3); rect(halfWidth - 8, halfHeight, halfWidth - 5, halfHeight + 3);}

Let’s try drawing several rockets

May 9, 2014 IAT 355 10

Works fine for one call…

g But when we call it twice, it doesn’t seem to work– Looks like first call messes up subsequent calls

g What happening is that, when you move the paper (translate, rotate) the paper stays moved

g Subsequent paper moves (additional translates and rotates) build on top of the previous ones

g What we want is to move the paper, draw, and move it back

g We need pushMatrix() and popMatrix()– pushMatrix() remembers the previous paper position (previous

transformation matrix)– popMatrix() restores the paper to the remembered position (restores the

transformation matrix)

May 9, 2014 IAT 355 11

Using pushMatrix() and popMatrix()

void drawRocket(int x, int y, float rot) { final int halfHeight = 10; final int halfWidth = 10;

pushMatrix();

translate(x, y); rotate(rot);

triangle(0, -halfHeight, -halfWidth, halfHeight, halfWidth, halfHeight);

rectMode(CORNERS); rect(-halfWidth + 5, halfHeight, -halfWidth + 8, halfHeight +

3); rect(halfWidth - 8, halfHeight, halfWidth - 5, halfHeight + 3);

popMatrix();}

May 9, 2014 IAT 355 12

Classes

May 9, 2014 IAT 355 13

Classes

g Java (Processing) is an object-oriented language

g This means that parts of your program that you treat as conceptual things, become things (objects) in the program code

g Objects are built from classes– Classes are the blueprint, objects are built from the blueprint– Objects are called instances of classes

g Our rocket sure seems like a thing – let’s turn it into a class

May 9, 2014 IAT 355 14

Parts of a class

g Classes define fields, constructors and methods

g Fields are the variables that will appear inside every instance of the class– Each instance has its own values

g Constructors are special methods that define how to build instances (generally, how to set the initial values of fields)

g Methods are how you do things to instances

May 9, 2014 IAT 355 15

Defining the rocket class

class Rocket {

// fieldsfloat rotation = 0;

float xPos; float yPos; final int halfWidth = 10; final int halfHeight= 10;

// constructorRocket( int initialX, int initialY, float initialRot ) {

xPos = initialX; yPos = initialY;rotation = initialRot;

}}

May 9, 2014 IAT 355 16

Using the class to create instances

g Classes define a typeg You can now declare variables of this type and initialize

them using the constructorg Like arrays, the keyword new is used to tell Java to create a

new object (hmm, so arrays must be objects…)

Rocket r1, r2 ;void setup() {

r1 = new Rocket(75, 10, 0);r2 = new Rocket(50, 50, PI/2);

}

g Nice, but my rockets don’t do anything (need methods!)

May 9, 2014 IAT 355 17

Adding a draw routine to our Rocket

void draw() {pushMatrix();translate(xPos, yPos);rotate(rotation);

triangle(0, -halfHeight, -halfWidth, halfHeight, halfWidth, halfHeight);

rectMode(CORNERS); rect(-halfWidth + 5, halfHeight, -halfWidth + 8,

halfHeight + 3); rect(halfWidth - 8, halfHeight, halfWidth - 5,

halfHeight + 3);popMatrix();

}

Don’t need arguments because we use the fieldsBut we could define additional arguments if we wanted to

No Arguments!

May 9, 2014 IAT 355 18

Calling methods on objects

g You call methods on instances

g Think of the method as something your asking the object to do

g For example, we can now ask the rockets to draw themselvesr1.draw();

g In general, to call a method, take the name of the variable holding the object + “.” + the method namemyObjectInstance.myMethod();

May 9, 2014 IAT 355 19

What else do we want to do to the Rocket?

g We may want to change the rotationrotateClockwise();rotateCounterclockwise();

g We may want to give the rocket a boostfireThrusters();

Review

g Graphics:triangle() draw a trianglepushMatrix() copy the top of the matrix

stacktranslate() change XYZ locationrotate() rotate about origin… draw in translated & rotated coordinates

popMatrix() recover the previous matrix May 9, 2014 IAT 355 20

Review

g Object Oriented Programming– Class -- a type you define– Instance -- one variable of a class– Fields -- variables within a class– Methods -- functions that act within a

class– Constructor -- create an instance of a

class

May 9, 2014 IAT 355 21

Review

g Graphics/ OO Example– Rocket

• Translated & rotated to its new location• Data of location stored within its class• Each rocket has its own location

– And its own data!

May 9, 2014 IAT 355 22