22
IAT 355 Lecture 4 Computer Graphics: Rocket

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

Embed Size (px)

Citation preview

Page 1: 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

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

May 9, 2014 IAT 355 2

Outline

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

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

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);

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

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

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

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)

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

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)

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

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

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

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)

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

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

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

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)

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

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();}

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

May 9, 2014 IAT 355 12

Classes

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

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

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

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

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

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;

}}

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

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!)

Page 17: IAT 355 Lecture 4 Computer Graphics: Rocket. May 9, 2014IAT 3552 Outline  Programming concepts –Programming Computer Graphics –Transformations –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!

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

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();

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

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();

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

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

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

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

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

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