Application of Computer Graphics - Harran Üniversitesi

Application of Computer Graphics - Harran Üniversitesi

Graphics Programming Input and Interaction Interaction Hofstra University 1 Interaction Early 60s, Ivan Sutherlands Project Sketchpad Basic Paradigm: User see an image, reacts with an interactive device, image changes in response to input, . . .

Interaction Hofstra University 2 Interaction OpenGL does not support interaction directly Increase portability work in a variety of environments

Windowing and input functions left out of API emphasis on rendering Use toolkits, GLUT Interaction Hofstra University 3 Physical Input Devices Pointing Device indicates position on screen Keyboard Device return character codes to a program

Interaction Hofstra University 4 Logical Input Devices Major Characteristics: What measurements the device returns to the program When the device returns those measurements Interaction

Hofstra University 5 Application Input Measure - what the device returns to the program Trigger signal send to the computer Three distinct modes defined by the relationship between the measure process and the trigger. Request Mode, Sample Mode, Event

Mode Interaction Hofstra University 6 Request Mode The measure of the device is not returned to the program until the device is triggered Interaction Hofstra University 7

Sample Mode Measure is returned immediately after the function is called in the user program (device sample). No trigger needed Useful in apps where the program guides the user Interaction Hofstra University 8

Event Mode Can handle multiple inputs When device triggered an event is generated Identifier for device placed in the event queue Event queue process is independent of the application, asynchronous A callback function associated with a specific type of event Interaction Hofstra University

9 Event-Driven Programming Callback functions implement how the application program responds to events Examples, each of the events below needs a callback function to handle it. Pointing Events Window Events Keyboard Events Display & Idle Events Interaction

Hofstra University 10 Pointing Device Almost always a mouse Move event when mouse is moved with button depressed; Passive Move Event move without pressing button Mouse Event mouse button is depressed or released glutMouseFunc (mouse);

Interaction Hofstra University 11 Pointing Device Mouse Callback void mouse(int btn, int state, int x, int y) { if (btn==GLUT_RIGHT_BUTTON && state==GLUT_DOWN) exit(0); } Depressing the right Button terminates the program Interaction

Hofstra University 12 Register callbacks int main(int argc, char** argv) { glutInit(&argc,argv); glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB); glutCreateWindow("square"); myinit (); glutReshapeFunc (myReshape); glutMouseFunc (mouse); Called whenever the glutMotionFunc(drawSquare); window is resized glutDisplayFunc(display); glutMainLoop(); } Interaction

Hofstra University 13 Window Events (Resizing Dragging) Redraw all the objects? How do we handle aspect ratio? Change size of attributes and primitives? Interaction Hofstra University

14 Square Program Example This program illustrates the use of the glut library for interfacing with a Window System The program opens a window, clears it to black,then draws a box at the location of the mouse each time the left button is clicked. The right button exits the program The program also reacts correctly when the window is moved or resized by clearing the new window to black

Interaction Hofstra University 15 Global Variables /* globals */ GLsizei wh = 500, ww = 500; /* initial window size */ GLfloat size = 3.0; /* half side length of square */ Size of window Viewport position and size Size of clipping window

Interaction Hofstra University 16 Window Event Reshape Example: change clipping wndw to match screen wndw, viewport matches new aspect ratio, whole screen wndw void myReshape(GLsizei w, GLsizei h) reshaping routine called with { glutReshapeFunc (myReshape); /* adjust clipping box */

whenever window is resized or moved glMatrixMode(GL_PROJECTION); glLoadIdentity(); glOrtho(0.0, (GLdouble)w, 0.0, (GLdouble)h, -1.0, 1.0); glMatrixMode(GL_MODELVIEW); glLoadIdentity(); /* adjust viewport and clear */ glViewport(0,0,w,h); glClearColor (0.0, 0.0, 0.0, 1.0); glClear(GL_COLOR_BUFFER_BIT); glFlush(); /* set global size for use by drawing routine */ ww = w; } wh = h; Interaction Hofstra University

17 Pointing Device Motion Callback Example: whenever mouse dragged and button down draw random color square at the mouse position Called with void drawSquare(int x, int y) glutMotionFunc(drawSquare ); { if button held down y=wh-y; glColor3ub( (char) rand()%256, (char) rand() %256, (char) rand()%256); glBegin(GL_POLYGON); glVertex2f(x+size, y+size); glVertex2f(x-size, y+size); glVertex2f(x-size, y-size); glVertex2f(x+size, y-size);

glEnd(); Interaction glFlush(); Hofstra University 18 Keyboard Events void keyboard(unsigned char key, int x, int y) { if (key=='q' || key=='Q') exit(0); } glutKeyboardFunc(keyboard); Interaction Hofstra University

19 Window Management id=glutCreateWindow(second window); glutSetWindow(id); Interaction Hofstra University 20 Menus Pop-up menus Common Steps:

Interaction Define the entries Link the menu to a mouse button Define callback function Hofstra University 21 Registering a menu callback and defining a menu identifier passed to

callback glutCreateMenu(demo_menu); glutAddMenuEntry(quit, 1); glutAddMenuEntry(increase square size, 2); glutAddMenuEntry(decrease square size, 3); glutAttachMenu(GLUT_RIGHT_BUTTON); demo_menu is the callback function for the menu The menu appears on right-button mouse click Interaction Hofstra University 22 Menus void demo_menu(int id) { if (id==1)

exit (0); if (id==2) size = 2* size; else if (size > 1) size = size/2; glutPostRedisplay( ); } Interaction Hofstra University 23 Hierarchical Menus top_menu size_menu Interaction

Hofstra University 24 Hierarchical Menus GLint sub_menu = glutCreateMenu(size_menu); glutAddMenuEntry(increase square size, 1); glutAddMenuEntry(decrease square size, 2); glutCreateMenu(top_menu); glutAddMenuEntry(quit, 1); glutAddSubMenu(Resize, sub_menu); glutAttachMenu(GLUT_RIGHT_BUTTON); top_menu and size_menu are callback functions for the top- and the sub-menus, respectively Interaction Hofstra University

25 Animation: Using idle callback and double buffering Example Rotating Cube Program We want to create animation We continuously keep changing the value of Interaction Hofstra University 28 Spin the square: globals

#define PI 3.141592 GLdouble theta = 0; // rotation angle GLsizei wnd_w = 500; // display window width GLsizei wnd_h = 500; // display window height GLfloat spin_speed = PI/180; // incerement for angle in rad Interaction Hofstra University 29 Spin square: prototypes

void help(); //print instructions void myinit(); // OpenGL init void display(); // display callback void myreshape(GLsizei, GLsizei); // reshape callback void update_angle(); // idle callback void control_speed(GLubyte, GLint, GLint); // keybrd callback Interaction Hofstra University 30

Spin square: reshape callback /* keep the viewport aspect ratio 1, so square does not get distorted */ void myreshape(GLsizei w, GLsizei h) { wnd_w = w; wnd_h = h; if (h < w) w=h; // adjust viewport (to preserve aspect ratio 1), and clear. glViewport(0, 0, w, w); glutPostRedisplay(); } Interaction Hofstra University 31 Spin square: keyboard

callback // keyboard callback increase speed, decrease speed or quit void control_speed(GLubyte key, GLint x, GLint y) { switch (key) { case('q'): case('Q'): exit (0); break; case('s'): case('S'): spin_speed *=2; break; case('d'): case( 'D'): spin_speed /= 2; } glutPostRedisplay( ); } Interaction Hofstra University 32

Spin square: idle callback // idle callback void update_angle(void) { theta += spin_speed; if (theta>2*PI) theta-= 2*PI; glutPostRedisplay(); } glutIdleFunc(update_angle); Interaction Hofstra University 33 Double Buffering

A complex display may not be drawn in a single refresh cycle Double Buffering solves the problem Assume two frame buffers: front buffer and back buffer Swap these from the application program invoking a display callback Interaction Hofstra University 34 Spin square: double buffering

void display() { glClear(GL_COLOR_BUFFER_BIT); glBegin(GL_POLYGON); glColor3f(1.0, 0.0, 0.0); glVertex2d(cos(theta), sin(theta)); glColor3f(0.0, 0.1, 0.0); glVertex2d(-sin(theta), cos(theta)); glColor3f(1.0, 0.0, 1.0); glVertex2d(-cos(theta), -sin(theta)); glColor3f(1.0, 1.0, 0.0); glVertex2d(sin(theta), -cos(theta)); glEnd(); glutSwapBuffers(); } Interaction Hofstra University

36 Spin square: register callbacks int main(int argc, char **argv) { glutInit(&argc, argv); glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGB); glutInitWindowSize(wnd_w,wnd_h); glutInitWindowPosition(0,0); glutCreateWindow("spinning square, speed control with menu"); myinit(); glutDisplayFunc(display); glutReshapeFunc(myreshape); glutIdleFunc(update_angle); glutKeyboardFunc(control_speed); glutMainLoop(); return 0; } Interaction

Hofstra University 37 Good Interactive Programs Smooth display Interactive devices Variety of methods to input data Easy-to-use interface Feedback to user (help) Human consideration (HCI)

Interaction Hofstra University 38

Recently Viewed Presentations

  • Culture and Geography Test Version 1 ____1. The

    Culture and Geography Test Version 1 ____1. The

    ____1. The clothing, language, food, music, jobs, religion, literature, and technology that a group of people share is an expression of their. A. government.
  • Fever-Tree Preliminary Results

    Fever-Tree Preliminary Results

    Robust balance sheet with net cash of £11.6m at year end. ... Sub-heading included here to strip out the on-going cash flows from those in the prior period relating to exceptional costs and the pre-IPO structure £m: Reported FY15; FY14;...
  • Early Complex Societies

    Early Complex Societies

    Evolution of Homo Sapiens. What discovery have researchers made about the link between humans and large apes? (L1) Researchers (archaeologists, paleontologists, evolutionary biologists) have shown similarity between humans & large apes (i.e. only 1.6 % difference between humans & chimp...
  • Get to The Root of It

    Get to The Root of It

    Root Word. Meaning. Origin. Hosp. Guest. Latin. Onym. Name. Greek. Host. Stranger. ... Homonym—a word that is spelled and pronounced like another word but is different in meaning. ... The man released the hostage from the bank once the police...
  • Tips for Effective Rubric Design

    Tips for Effective Rubric Design

    Tips For Effective Rubric Design How to: design a rubric that does its job write precise criteria and descriptors make your rubric student-friendly * Checklists do not reflect developmental—indicates only presence or lack of a trait * An overall judgment....
  • Descentralización Del Sector Salud

    Descentralización Del Sector Salud

    Curso de Rectoría y Gobierno de los sistemas de salud Guatemala 3 - 7 julio 2006 PERÚ: Una mirada a los procesos de cambio y reforma en curso


    STONE MOUNTAIN PARK POLICE DEPARTMENT 2027 OLD HUGH HOWELL ROAD P.O.BOX 689 STONE MOUNTAIN, GEORGIA 30086 770-498-5675 ... Saturday, July 16, 2005 at the West Gate of Stone Mountain Park. Investigators believe that robbery may have been the motive.
  • Chapter 2

    Chapter 2

    Chapter 5 A Closer Look at Instruction Set Architectures * * * Instructions can be fixed length or variable length. To enrich the instruction set for a fixed length instruction set, expanding opcodes can be used. The addressing mode of...