CS 380 LAB I Open GL Bochang Moon

CS 380 LAB I Open. GL Bochang Moon Reference 1. [Open. GL course slides by Rasmus Stenholt] Reference 2. [http: //nehe. gamedev. net/]

Goal Introduce Open. GL programming n Help you do CS 380 homework by yourself n 2

Outline n Install Dev-C++ and Open. GL environments ¨ Run an empty window ¨ Note: Visual C++ with Open. GL is similar n n Reference: course slides “Basic Open. GL structure” Start with the Open. GL framework ¨ Draw a Open. GL primitive ¨ Address keyboard and mouse input 3

Install Dev-C++ n Download Dev-C++ beta 9 release ¨ http: //www. bloodshed. net/devcpp. html Click 4

Install Dev-C++ n Just click “Next” 5

Dev-C++ starts up n Click File/New/Project 6

Dev-C++ starts up n Click “Console Application” 7

Dev-C++ starts up n Make a new folder, save the project file 8

Dev-C++ starts up Click Execute/Compile (Ctrl + F 9) n Click Execute/Run (Ctrl + F 10) n 9

Download and install GLUT n Download GLUT files from n n http: //chortle. ccsu. edu/Bloodshed/glutming. zip Extract glutming. zip 10

Download and install GLUT n Copy GLUT files to the install folder of DEV-C++ ¨ glut. h: copy this file to C: Dev-CppincludeGL ¨ libglut 32. a: copy (or replace) this file to C: DEVCpplib ¨ glut 32. dll: copy this file to C: WindowsSystem 32 n Check whethere is “opengl 32. dll” in this folder 11

Download and install GLUT n Project setting in DEV-C++ ¨ Click Project/Project Options 12

Download and install GLUT n Project setting in DEV-C++ ¨ Click Project/Project Options 13

Download and install GLUT n Project setting in DEV-C++ ¨ Click Parameters, and Add Library or Object 14

Download and install GLUT n Project setting in DEV-C++ ¨ Add three library files in this order C: /Dev-Cpp/libopengl 32. a n C: /Dev-Cpp/lib/libglut 32. a n 15

Creating an empty window n n n n #include <GL/glut. h> #include <GL/glu. h> void display() { } int main( int argc, char* argv[] ) { glut. Init(&argc, argv); glut. Init. Display. Mode(GLUT_SINGLE | GLUT_RGBA | GLUT_DEPTH); glut. Init. Window. Size(512, 512); glut. Create. Window("CS 380 LAB"); glut. Display. Func( display ); glut. Main. Loop(); return 0; } 16

Draw your first polygon n void display() ¨ Main display function where we can do all the drawing 17

Draw your first polygon n Clear your screen void display() { ¨ gl. Clear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); ¨ gl. Flush(); ¨ } ¨ n n gl. Clear(parameters) // clear input buffers gl. Flush() // forces all pending commands to be executed 18

Draw your first polygon n n void display() { gl. Clear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); gl. Load. Identity(); // Reset our view gl. Begin(GL_TRIANGLES); // Draw a triangle gl. Vertex 3 f( 0. 0 f, 1. 0 f, 0. 0 f); gl. Vertex 3 f(-1. 0 f, 0. 0 f); gl. Vertex 3 f( 1. 0 f, -1. 0 f, 0. 0 f); gl. End(); gl. Flush(); (0, 0, 0) } 19

Draw your first polygon n In Open. GL, geometry is specified by vertices Vertices must be specified between gl. Begin(primitive type) and gl. End() function calls The primitive type represents how vertices are to be connected gl. Begin(GL_TRIANGLES); gl. Vertex 3 f( 0. 0 f, 1. 0 f, 0. 0 f); gl. Vertex 3 f(-1. 0 f, 0. 0 f); gl. Vertex 3 f( 1. 0 f, -1. 0 f, 0. 0 f); gl. End(); 20

Open. GL Primitives n Triangles ¨ There are 3 ways of making triangles with Open. GL n Individual triangles ¨ ¨ ¨ n Type is GL_TRIANGLES Each triangle requires 3 explicit vertices Sets of unconnected triangles are often called polygon soups Strips of connected triangles ¨ ¨ ¨ n GL_TRIANGLES Type is GL_TRIANGLE_STRIP The first triangle requires 3 vertices, the rest use 1 new vertex and the 2 most recently defined vertices GL_TRIANGLE_STRIP Complex objects are often built from Fans of connected triangles ¨ ¨ ¨ Type is GL_TRIANGLE_FAN Every triangle use the first, the previous, and a new vertex Useful for creating polygons or approximating circles/ellipses GL_TRIANGLE_FAN 21

Open. GL Primitives n Quadrilaterals (quads) ¨ Individual quads n n Type is GL_QUADS A quad is defined by 4 vertices Quads can be decomposed into two triangles Quads are not necessarily plane or convex ¨ ¨ GL_QUADS Be careful with the vertex sequence Strips of connected quads n n Type is GL_QUAD_STRIP Uses the most recent 2 vertices and 2 new vertices GL_QUAD_STRIP 22

Open. GL Primitives n Polygons ¨ Type is GL_POLYGON ¨ Polygons need 3 or more vertices n I. e. can be used for any polygon ¨ Polygons are divided into triangles by the graphics card GL_POLYGON 23

Open. GL Primitives n Points ¨ ¨ ¨ Type is GL_POINTS Points are 0 -D Points represent the simplest drawable primitive 1 vertex is used per point Points are rendered as small, unconnected dots on the screen Theoretically points have no area GL_POINTS 24

Open. GL Primitives n Lines ¨ Type is GL_LINES ¨ Lines are 1 -D ¨ Each line needs 2 vertices ¨ Lines have no area n Open series of lines ¨ Type n GL_LINES GL_LINE_STRIP is GL_LINE_STRIP Closed series of lines ¨ Type is GL_LINE_LOOP 25

Open. GL functions n Open. GL functions all follow the same naming conventions ¨ Function names have gl, glu, or glut as prefix depending on their package of origin ¨ The name of the function follows the prefix ¨ The parameter type of the function is placed as a postfix 26

Open. GL functions gl. Vertex 3 fv( v ) Number of components 2 3 4 - (x, y) (x, y, z, w) Data Type b ub s us i ui f d - byte unsigned byte short unsigned short int unsigned int float double Vector omit “v” for scalar form gl. Vertex 2 f( x, y ) 27

Tutorial n Draw this rectangle 28

Tutorial n n n n Drawing a red rectangle gl. Begin(GL_QUADS); gl. Vertex 3 f( -0. 5 f, 0. 0 f); gl. Vertex 3 f(-0. 5 f, 0. 0 f); gl. Vertex 3 f( 0. 5 f, -0. 5 f, 0. 0 f); gl. End(); 29

Adding colours n gl. Color 3 f(red, green, blue) n Drawing a red rectangle n n n n gl. Begin(GL_QUADS); gl. Color 3 f(1. 0 f, 0. 0 f); gl. Vertex 3 f( -0. 5 f, 0. 0 f); gl. Vertex 3 f(-0. 5 f, 0. 0 f); gl. Vertex 3 f( 0. 5 f, -0. 5 f, 0. 0 f); gl. End(); 30

Colours in Open. GL n Colours are modelled using the red-greenblue (RGB) system 31

Colours in Open. GL n There are several ways of representing colour in Open. GL Directly as RGB-tuples ¨ Extended RGBA-tuples ¨ Indexed mode ¨ n The RGBA mode has an extra component, alpha, which does not affect the colour directly ¨ Alpha is used when blending colours n n E. g. transparency effects The indexed mode uses a fixed table of colours to look up colours 32

Colours in Open. GL Colours are specified by the gl. Color*() family of functions n Example: gl. Color 3 f() n ¨ Specifies a colour by three floating point values in the range [0. 0; 1. 0] ¨ The parameters represent R, G, and B, respectively 33

Keyboard input n n n int main( int argc, char* argv[] ) { glut. Init(&argc, argv); glut. Init. Display. Mode(GLUT_SINGLE | GLUT_RGBA | GLUT_DEPTH); glut. Init. Window. Size( width, height ); glut. Create. Window("CS 380"); glut. Display. Func( display ); glut. Mouse. Func( mouse ); glut. Keyboard. Func( keyboard ); glut. Reshape. Func( reshape ); glut. Main. Loop(); return 0; } 34

Keyboard input n n void keyboard(unsigned char key, int x, int y) { if (key == 'r') { // todo } n glut. Post. Redisplay(); n n } 35

Tutorial n Change the color of your rectangle ¨ Press ‘r’: change it to a red rectangle ¨ Press ‘g’: change it to a green rectangle ¨ Press ‘b’: change it to a blue rectangle 36

Tutorial n n n void display() { … gl. Color 3 f(r, g, b); … } void keyboard(unsigned char key, int x, int y){ if (key == 'r') { r = 1. 0, g = 0. 0, b = 0. 0; } else if (key == 'g') { r = 0. 0, g = 1. 0, b = 0. 0; } else if (key == 'b') { r = 0. 0, g = 0. 0, b = 1. 0; } glut. Post. Redisplay(); } 37

Mouse input n n n int main( int argc, char* argv[] ) { glut. Init(&argc, argv); glut. Init. Display. Mode(GLUT_SINGLE | GLUT_RGBA | GLUT_DEPTH); glut. Init. Window. Size( width, height ); glut. Create. Window("CS 380"); glut. Display. Func( display ); glut. Mouse. Func( mouse ); glut. Keyboard. Func( keyboard ); glut. Reshape. Func( reshape ); glut. Main. Loop(); return 0; } 38

Mouse input n n void mouse( int button, int state, int mx, int my ) button GLUT_LEFT_BUTTON ¨ GLUT_MIDDLE_BUTTON ¨ GLUT_RIGHT_BUTTON ¨ n state GLUT_DOWN ¨ GLUT_UP ¨ n mx, my ¨ positions 39

Mouse input n n n void mouse( int button, int state, int mx, int my ) { if((button == GLUT_LEFT_BUTTON) && (state == GLUT_DOWN) ) { r = 1. 0, g = 1. 0, b = 1. 0; display(); } } 40

Next time n Transformation in Open. GL 41