1 / 48

COS 397 Computer Graphics Practical Session №1

COS 397 Computer Graphics Practical Session №1. Introduction to OpenGL, GLFW and CG. Outline. Task 1 : CodeBlock , GLFW & OpenGL testing Task 2 : Full Screen mode Task 3 : Graphical Application Structure Task 4: Alternative Structure of Graphical Application

tamal
Download Presentation

COS 397 Computer Graphics Practical Session №1

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. COS 397 Computer Graphics Practical Session №1 Introduction to OpenGL, GLFW and CG

  2. Outline • Task 1:CodeBlock, GLFW&OpenGL testing • Task 2: Full Screen mode • Task 3: Graphical Application Structure • Task 4: Alternative Structure of Graphical Application • Task 5:OpneGLprimitives – points, lines, • triangles, squares, polygons • Task 6: Cube vertices • Task 7: Cube edges • Task 8: Cube Size Parameterization • Task 9: Concentric Cubes • Task 10:Cube Center Parameterization

  3. Learning Outcomes • Introduction to OpenGL (1.x) in level to design and implement simple 3Danimations • Implementation of simple CG algorithms

  4. Software • Required software • OpenGL, GLU, GLFW, GCC • Code::Blocks • Information about OpenGL 1.xhttp://www.opengl.org/registry/http://www.glprogramming.com/red/ • Alternative software • MESA, FreeGLUT, GLUT, Notepad, C compiler

  5. Task №1 CodeBlock, GLFW&OpenGL Testing • Let’s Begin: • Code::Blocks • GNU GCC Compiler • GLFW 2.7.7 32-bit

  6. Task №1 • Create New project • File → New → Project → GLFW Project

  7. Settings • Choose project name and browse for location • Browse to select the folder where is GLFW library stored

  8. Hint • Code::Blocks should explicitly “know” where is GLFW 2.7 library

  9. Result • Automatically generated GLFW project • Build and Run

  10. Project Result

  11. Task №2 Full Screen mode • GLFW functions • GLFW Reference Manualhttp://www.glfw.org/GLFWUsersGuide277.pdfsections 3.1.1, 3.1.2 и 3.2.1 • Changes in glfwOpenWindow() • ParameterGLFW_FULLSCREEN

  12. Task № 3:Graphical Application Structure • Minimal Skeleton of GLFWcode #include <GL/glfw.h> int main() { glfwInit(); glfwOpenWindow(512,512,0,0,0,0,0,0,GLFW_WINDOW); while(…) { //Using OpenGL, GLU, GLFW functions } glfwTerminate(); return 0; }

  13. Graphical Application Structure • Structure of GLFW Application • GLFW Initialization • OpenGLwindow opening • Animation frame (scene) generation • Termination

  14. Graphical Application Structure • Animation frame (scene) generation • Buffers Cleaning • Projection Type Setting • View Point Setting • Drawing a frame in the hidden buffer • Swapping the hidden buffer with the visible one • Task • Identify these elements in generated source code in Task 1

  15. Alternative Structure of Minimal GLFW Application Proposed in GLFW Reference Manual

  16. Task №4 Alternative Structure of Graphical Application • Define the following functions: • bool running() – to test whether to continue running • void init() – to initialize the graphical window, to set perspective, to set point of view and etc. • void finit() – to close the graphical window and to terminate the process

  17. Alternative Structure of Minimal GLFW Application • #include <GL/glfw.h> • bool running() { // definition } • void init() { // definition } • void finit() { // definition } • int main() • { • init(); // Initialization • while( running() ) // Testing • { • glClear( GL_COLOR_BUFFER_BIT ); • glRotatef( 0.1, 0.4, -0.2, 0.7); // We will keep this rotation, because It will be necessary for other tasks // single frame drawing // <Write your code here ….> • glfwSwapBuffers(); • } • finit(); // Termination • return 0; • }

  18. Task 5: OpenGL primitives – points, lines, triangles, squares, polygons • glBegin(GLenummode); • …. // list of vertices and colors • glEnd(); • Parameters • Mode - Specifies the primitive or primitives that will be created from vertices presented between glBegin and the subsequent glEnd. Ten symbolic constants are accepted: • GL_POINTS, • GL_LINES, • GL_LINE_STRIP, • GL_LINE_LOOP, • GL_TRIANGLES, • GL_TRIANGLE_STRIP, • GL_TRIANGLE_FAN, • GL_QUADS, • GL_QUAD_STRIP, and • GL_POLYGON. • More readings: http://www.opengl.org/sdk/docs/man2/xhtml/glBegin.xml

  19. Vertices • 2D • void glVertex2i(GLint x, GLint y); • void glVertex2f(GLfloat x, GLfloat y); • 3D • void glVertex3i(GLint x, GLint y, GLint z); • void glVertex3f(GLfloat x, GLfloat y, GLfloat z);

  20. I hope that you have no eye problem and will be able to see the result on the screen without magnifier 

  21. Color • //integer values in range [0;255] • void glColor3i(GLint red, GLint green, GLint blue); • //floating point values in range [0.0; 1.0] • void glColor3f(GLfloat red, GLfloat green, GLfloat blue);

  22. 2D Points (1,1) (-1,1) glBegin(GL_POINTS); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glEnd(); (-1,-1) (1,-1)

  23. 2D Lines (1,1) (-1,1) glBegin(GL_LINES); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glEnd(); (-1,-1) (1,-1)

  24. Line Strip (1,1) (-1,1) glBegin(GL_LINE_STRIP); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glEnd(); (-1,-1) (1,-1)

  25. 2D Line Loop (1,1) (-1,1) glBegin(GL_LINE_LOOP); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glEnd(); (-1,-1) (1,-1)

  26. 2D Polygon OpenGL only supports convex polygons (and really only triangles) (1,1) (-1,1) glBegin(GL_POLYGON); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glEnd(); (-1,-1) (1,-1)

  27. 2D Quads (1,1) (-1,1) glBegin(GL_QUADS); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glEnd(); (-1,-1) (1,-1)

  28. 2D Quads glBegin(GL_QUADS); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glEnd(); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.);

  29. 2D Quads Lines should never pass through a vertex. (1,1) (-1,1) (-1,1) glBegin(GL_QUADS); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glEnd(); (-1,-1) (1,-1)

  30. 2D Triangles (1,1) (-1,1) glBegin(GL_TRIANGLES); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glEnd(); (-1,-1) (1,-1)

  31. 2D Triangles Lines should never pass through a vertex. (1,1) (-1,1) glBegin(GL_TRIANGLES); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.6,1.); glVertex2f(-.2,.6); glVertex2f(.6,1.); glVertex2f(-.2,.6); glVertex2f(.2,.6); glVertex2f(.6,1.); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); … glEnd(); (-1,-1) (1,-1)

  32. 2D Triangle Strip (1,1) (-1,1) glBegin(GL_TRIANGLE_STRIP); glVertex2f(-.6,1.); glVertex2f(-.6,.6); glVertex2f(-.2,.6); glVertex2f(-.2,-.6); glVertex2f(-.6,-.6); glVertex2f(-.6,-1.); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glVertex2f(.2,-.6); glVertex2f(.2,.6); glVertex2f(.6,.6); glVertex2f(.6,1.); glEnd(); (-1,-1) (1,-1)

  33. 2D Triangle Strip (1,1) (-1,1) glBegin(GL_TRIANGLE_STRIP); glVertex2f(-.6,1.); glVertex2f(.6,1.); glVertex2f(-.2,.6); glVertex2f(.2,.6); glVertex2f(-.2,-.6); glVertex2f(.2,-.6); glVertex2f(.6,-1.); glVertex2f(.6,-.6); glEnd(); … First two vertices prime the pump,then every new vertex creates a triangleconnecting it to the previous two vertices (-1,-1) (1,-1)

  34. 2D Triangle Fan (1,1) (-1,1) glBegin(GL_TRIANGLE_FAN); glVertex2f(-.2,.6); glVertex2f(-.6,.6); glVertex2f(-.6,1.); glVertex2f(.6,1.); glVertex2f(.2,.6); glVertex2f(.2,-.6); glVertex2f(-.2,-.6); glEnd(); … First two vertices prime the pump,then every new vertex creates a triangleconnecting it to the previous vertex andthe first vertex (-1,-1) (1,-1)

  35. Assigning Color glColor3f(0,0,1); glBegin(GL_POLYGON); glVertex2f(-1,1); glVertex2f(-1,-1); glVertex2f(1,-1); glEnd(); glBegin(GL_POLYGON); glColor3f(0,1,0); glVertex2f(-1,1); glColor3f(0,0,1); glVertex2f(-1,-1); glColor3f(1,0,0); glVertex2f(1,-1); glEnd(); glColor3f(1,0,0); glBegin(GL_POLYGON); glVertex2f(-1,1); glVertex2f(-1,-1); glVertex2f(1,-1); glEnd(); glColor3f(0,0,0); glBegin(GL_LINE_LOOP); glVertex2f(-1,1); glVertex2f(-1,-1); glVertex2f(1,-1); glEnd();

  36. Task 6:Cube vertices • Paying with 3D coordinates: • Draw 8 vertices of a cube • Center point (0,0,0) • Cube size = 2

  37. Result

  38. Task 7:Cube edges • Make some changes in Task 6 such that: • Draw cube edges • Each edge is drawn as separate line

  39. Result

  40. Task 7:Cube edges – v2 • Make some changes in Task 7 such that: • Draws a connected group of line segments from the first vertex to the last, then back to the first.

  41. Task 8: Cube Size Parameterization • Write function to • Draw a cube with sizeа • In loop make a cube size to change randomly in predefined ranges

  42. Task 9:Concentric Cubes • Draw Concentric Cubes • Use a loop to draw 10 cubes with the same center point and different sizes

  43. Result

  44. Task 10:Cube Center Parameterization • Add new parameter to the function for drawing a cube • Coordinates of the center point • Test this function by drawing 3 cubes next to each other

  45. Result

  46. Task 10:Cube Center Parameterization - v2 • Draw • Big size cube and next to each of its sides 10 smaller cubes with decreasing sizes

  47. Result

  48. Questions?

More Related