![Page 1: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/1.jpg)
Computer Graphics ICS488
Fall 2005OpenGL Programming Lab
(Julian) Yu-Chung ChenEmail: [email protected]
![Page 2: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/2.jpg)
• 1st week, Aug-25 Thursday CG1 Lab
• How to get started
• What do I need to know to do program assignment 1
![Page 3: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/3.jpg)
• What is OpenGL?
• What OpenGL can and cannot do
• OpenGL and related libraries
• HW/SW implementation
• GLUT
• Programming environment setup
• Platforms, makefile
![Page 4: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/4.jpg)
What’s OpenGL?
• Interface to the graphics hardware
• Hardware independent standard
• Portable design
• Architecture Review Board
• Keep evolving...
• 2.0 GLSL - OpenGL Shading language
![Page 5: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/5.jpg)
What OpenGL can do?
• Control graphics hardware
• Build objects with geometric primitives: points, lines and polygons
• 100+ API(commands)
• Give commands(prefixed ‘gl’)
![Page 6: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/6.jpg)
What OpenGL cannot do?
• No commands for window, user I/O
• No high-level commands
• No models, scene graphs
![Page 7: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/7.jpg)
Implementations
• Hardware
• Graphics card with drivers and libraries
• nVidia, ATI, 3DLabs...
• Software
• Mesa3D (`similar’ to OpenGL - licensing reasons)
• Performance drops dramatically
![Page 8: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/8.jpg)
GL Utility Toolkit
• GLUT
• window definition, control
• system-level I/O
• GLUT is cross-platform
• Make your life easier
![Page 9: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/9.jpg)
GLUT code skeletonSee the shell code
![Page 10: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/10.jpg)
GLUT
• Define & implement callback functions
• Register callback functions to GLUT framework
• Start GLUT main event loop
![Page 11: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/11.jpg)
• glutInit();
• glutInitDisplayMode();
• glutInitWindowSize();
• glutCreateWindow();
• glutDisplayFunc();
• glutKeyboardFunc();
• glutMainLoop();
![Page 12: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/12.jpg)
• New student
• Find your CS account name outside SEO927 (I just got mine!)
• Required libraries
• Ask sysadm install a copy
• Build your own copy
• System setup(remote display?)
CS Department Systems
![Page 13: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/13.jpg)
Install GLUT
• http://www.opengl.org/resources/libraries/glut.html
• ./mkmkfiles.imake; make
• Want shared library? See linux/README
![Page 14: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/14.jpg)
Setup remote display
• X-Window server(with GLX)/client
• Server side:
• xhost + <client_ip>
• Client side:
• DISPLAY=<server_ip>:0
• SSH ForwardX11
• ssh -X <username>@server
Text
![Page 15: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/15.jpg)
Platform dependent issues
• GNU/Linux
• Microsoft Windows
• MacOSX
![Page 16: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/16.jpg)
GNU/Linux
• Use ‘Makefile’
• See Makefile example
• ‘make’ book resources
![Page 17: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/17.jpg)
How to write a Makefile
• Variables
• Make rules and targets
• Remember `tab’ before commands
http://www.gnu.org/software/make/
![Page 18: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/18.jpg)
MS-Windows
• http://www.evl.uic.edu/aej/488/visualc.html
• Make sure your project has a ‘Makfile’(gmake) and can be used directly in CS machines!
![Page 19: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/19.jpg)
MacOSX
• Include three ‘frameworks’: Cocoa, OpenGL and GLUT in Xcode
• Make sure your project has a ‘Makfile’(gmake) and can be used directly in CS machines!
![Page 20: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/20.jpg)
Let’s Get Back to the Shell Program
![Page 21: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/21.jpg)
APIs
![Page 22: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/22.jpg)
OpenGL Command Syntax
• Ex: glVertex3fv()
• 3 -> Number of arguments: 2, 3, or 4
• f -> Data types(i, f, d, b, s, ub, us, ui)
• v -> Formats: ‘v’ for vector format. no ‘v’ means scalar format
![Page 23: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/23.jpg)
OpenGL Primitives
graphics from ref.2
![Page 24: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/24.jpg)
• glClear();
• glColor3f();
• glBegin(); glEnd();
• glVertex2f();
![Page 25: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/25.jpg)
Get more OpenGL example codes
• http://www.mesa3d.org/
• Mesa demos
![Page 26: Computer Graphics I - evl · Computer Graphics I CS488 Fall 2005 OpenGL Programming Lab (Julian) Yu-Chung Chen Email: ychen@cs.uic.edu ... OpenGL and GLUT in Xcode •Make sure your](https://reader030.vdocuments.site/reader030/viewer/2022040115/5e82778fafb10172422d9b7a/html5/thumbnails/26.jpg)
Resources
1. ‘bluebook’: http://www.rush3d.com/reference/opengl-bluebook-1.0/
2. ‘redbook’: http://www.rush3d.com/reference/opengl-redbook-1.1/
3. ‘redbook’ sample programs: http://www.opengl.org/resources/code/basics/redbook/index.html
4. How to write a Makefile: http://vertigo.hsrl.rutgers.edu/ug/make_help.html