lab 1: opengl tutorial cs 282. what’s the plan for today? go over our framework code. learn some...

21
Lab 1: OpenGL Tutorial CS 282

Post on 19-Dec-2015

217 views

Category:

Documents


2 download

TRANSCRIPT

Page 1: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Lab 1: OpenGL Tutorial

CS 282

Page 2: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

What’s the plan for today?

Go over our framework code.

Learn some basic OpenGL!

Reveal Lab 1

Answer questions

Page 3: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Framework Environment

C/C++ and OpenGL

Code will be given with Makefiles

You can compile in Linux, Mac, and Windows!

You must use the framework

Page 4: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

What should you know?At the very least

You’ve programmed before

You know the programming cycle

Better for you if

You are familiar with C/C++

Amazing if

You already know OpenGL

Have a degree in Computer Science

Page 5: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

FrameworkWhere do I get it?!

Resources in Class Website

This lab’s framework provides you with

An initial OpenGL window

Callback functions you will need

Page 6: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

What is OpenGL?

A powerful, open source graphics library

Widely used in both industry and academia

Capable of rendering 3D geometries with a plethora of effects

Keeps a “global” state

Transformation, projection matrices

Attributes from primitives

Page 7: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Exercise: Compiling

Compile the framework

Change window size, position, and title

Page 8: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Exercise: Drawing Things!

Since you guys are now pros, let’s draw things!

Every GL primitive starts with glBegin(…), and ends with glEnd ()

Example:

glBegin (GL_POINT);

glVertex3f( 1.0,1.0,1.0);

glEnd()

Page 9: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Exercise: Drawing Quads

Find the DrawGLScene() function

After glLoadIdentity(), create a GL primitiveusing GL_QUADS

Page 10: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Exercise: Drawing Quads

Add this code

And this code…

Page 11: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

What just happened?!

OK, that’s weird, why is the screen yellow?

We’ve basically rendered our object too close for us to really see it. So, we need to move (or translate) it further back.

Page 12: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Translation and Rotation

Rotation (unsurprisingly) rotates the primitive,BUT rotates it around the “world” axis, NOT itslocal axis

Hint: You can think of the camera as always being at the world origin(0,0,0)

Translation “moves” the primitive around to adifferent location

The order you do translations and rotations in MATTERS

Page 13: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Translation and Rotation

Rotate

Translate

Page 14: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Translation and Rotation

Rotate then Translate

Translate then Rotate

Page 15: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Translation and Rotation

WARNING!!! OpenGL will perform translations and rotations IN THE OPPOSITE ORDER YOU WRITE THEM IN CODE

i.e. writing the following in code: … glTranslate(...) glRotate(…) …Will rotate then translate the primitive

Page 16: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Translation and Rotation

Important things to keep in mind:

Translate/Rotate operates relative to the world origin

The order of translations and rotations matters

OpenGL will perform translations and rotations in the OPPOSITE order you list them in code

Page 17: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Exercise: Finish the cube

Add this line of code above your primitive in your drawing function.

Finish the rest of the cube.

Change the color of each side to something else!

glColor3f( red, green, blue );

Page 18: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Callbacks

GLUT allows us to interface between events (such as clicking, keyboard input, etc.) and OpenGL.

Page 19: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Lab 1

Implement a camera to move around in OpenGL.

Use the callback functions provided for you.

Use the cube as a way to debug your camera.

Make sure you at least create a vector, camera, and framework class.

Page 20: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Questions?

Page 21: Lab 1: OpenGL Tutorial CS 282. What’s the plan for today? Go over our framework code. Learn some basic OpenGL! Reveal Lab 1 Answer questions

Useful sites

OpenGL Reference Pages: http://www.opengl.org/sdk/docs/man/ (what we use)http://www.opengl.org/sdk/docs/man4/ (latest ver.)

NeHe Tutorials (under Legacy Tutorials):http://nehe.gamedev.net/

Note: As of Aug. 2011, the current tutorials are a little out-of-date/deprecated, but in the process of being updated. They still give a good explanation of the basics, but don’t expect to be able to run the code.