3D Game Programming 2D primitive

1. 3D Game Programming2D primitive Ming-Te Chi Department of Computer Science,  National Chengchi University

2. Outline • Imaging and Raster Primitives(4rd ch7) • Alpha and blending (4rd ch6) (6th ch9)

3. Imaging and Raster Primitives

4. Electromagnetic spectrum Image from wiki

5. Three-Color Theory • Human visual system has two types of sensors • Rods: • monochromatic, night vision • Cones: • Color sensitive • Three types of cone • Only three values • (the tristimulusvalues) are sent to the brain

6. Additive / Subtractive color Y M C Subtractive Color Printer Additive Color LCD, projector

7. RGB color space Green Black (0, 0, 0) Red Blue a 8 x 8 x 8-inch cube book Tauba Auerbach

8. HSV color space • HSV • hue,  • Saturation,  • Value, HSV UI

9. Imaging and Raster Primitives • Describe OpenGL’s raster primitives: • bitmaps • image rectangles • Demonstrate how to get OpenGL to read and render pixel rectangles

10. Pixel-based primitives • Bitmaps • 2D array of bit masks for pixels • update pixel color based on current color • Images • 2D array of pixel color information • complete color information for each pixel • OpenGL does not understand image formats

11. Per Vertex Poly. Frag FB Raster CPU DL Texture Pixel Pixel Pipeline • Programmable pixel storage and transfer operations glBitmap(), glDrawPixels() Rasterization (including Pixel Zoom) Pixel Storage Modes Pixel-Transfer Operations (and Pixel Map) Per FragmentOperations FrameBuffer CPU glCopyTex*Image(); TextureMemory glReadPixels(), glCopyPixels()

12. Positioning Image Primitives glRasterPos3f( x, y, z ) • Raster position transformed like geometry • discarded if raster positionis outside of viewport • may need to fine tuneviewport for desiredresults Raster Position

13. glWindowPos2f(x, y) • Specify the raster position in window coordinates for pixel operations

14. height yorig width xorig xmove Rendering Bitmaps glBitmap( width, height, xorig, yorig, xmove, ymove, bitmap ) • render bitmap in current colorat • advance raster position by after rendering

15. Rendering Fonts using Bitmaps • OpenGL uses bitmaps for font rendering • each character is stored in a display list containing a bitmap • window system specific routines to access system fonts • glXUseXFont() • wglUseFontBitmaps()

16. Rendering Images glDrawPixels( width, height, format, type, pixels ) • render pixels with lower left of image at current raster position • numerous formats and data typesfor specifying storage in memory • best performance by using format and type that matches hardware height width

17. Reading Pixels glReadPixels( x, y, width, height, format, type, pixels ) • read pixels from specified (x,y) position in framebuffer • pixels automatically converted from framebuffer format into requested format and type • Framebuffer pixel copy glCopyPixels( x, y, width, height, type )

18. OpenGL 1.X and 2.X glCopyPixels() glDrawPixels() Frame Buffer Memory glReadpixels()

19. Modern OpenGL glTexture*() Textures glGetTexImage() glDraw*() with texture Memory Frame Buffers glBlitFramebuffer() glReadpixels()

20. RasterPosition glPixelZoom(1.0, -1.0); Pixel Zoom glPixelZoom( x, y ) • expand, shrink or reflect pixelsaround current raster position • fractional zoom supported

21. Storage and Transfer Modes • Storage modes control accessing memory • byte alignment in host memory • extracting a subimage • Transfer modes allow modify pixel values • scale and bias pixel component values • replace colors using pixel maps

22. Pixel Packing void glPixelstorei(GLenumpname, GLintparam); unpack FrameBuffer Memory pack

23. Alpha and blending

24. Alpha • An alpha channel, representing transparency information on a per-pixel basis. • Alpha = 0.0f: fully transparent • Alpha = 1.0f: fully opaque

25. Chroma-keying (Primatte)

26. Writing Model • Use A component of RGBA (or RGBa) color to store opacity • During rendering we can expand our writing model to use RGBA values blend source blending factor destination component source component Color Buffer destination blending factor

27. Blending • glBlendFunc(Glenum S, Glenum D); • Cf = (Cs*S) + (Cd*D) • glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA); Ex: Cs={Rs, Gs, Bs, As}, Cd ={Rd, Gd, Bd, Ad}, Cf = (Cs*As) + (Cd*(1-As))

28.  B F C C Compositing foreground color alpha matte background plate composite F compositing equation =0 B

29.  B F C C Compositing composite F compositing equation =1 B

30. Order Dependency • Is this image correct? • Probably not • Polygons are renderedin the order they passdown the pipeline • Blending functionsare order dependent

31. class RGBApixmap RGBApixmap pic; pic.readBMPFile(“stand.bmp”); pic.setChromaKey(232, 248, 248); // draw pic.blendtex(picX, picY, 1.0, 1.0);