1. CH6 Texture

2. Pixel pipeline Vertex pipeline Course Map Transformation & Lighting Primitive assembly Viewport culling & clipping Texture blending Per Fragment operations Buffer operations Rasterizer setup Framebuffer We are here!

3. Before coding … 1/3 Prepare the texture images you need. Use common image format BMP JPG GIF PNG

4. Before coding … 2/3 Add FreeImage and glew library into your project. As same as glut C/C++ include: head file Link input: lib Working directory: dll FreeImage Load texture file Glew Generate Mipmap Multi-texture

5. Before coding … 3/3 Prepare a mesh with texture coordinate For simple shapes, you can assign texture coordinate by manually coding. For complex objects Use automatic texture-coordinate generation Or use modeling tools Maya, 3DS Max, Blender…

6. Overview Hard discsMain MemoryVideo Memory CPUGPU FreeImageglTexImage

7. How to use texture? 1/2 Initial Texture Generate Texture glGenTextures(number of textures, texture id array) Bind glBindTexture(GL_TEXTURE_2D, textId); Move Date into Texture glTexImage2D ( … ) Set the Options glTexEnv ( … ) glTexParameteri ( … )

8. How to use texture? 2/2 Draw Object with Texture Enable glEnable(GL_TEXTURE_2D); Bind glBindTexture(GL_TEXTURE_2D, textId); Assign texture coordinate for each vertex glTexCoord2f(u, v); glVertex3f(x, y, z); Disable and unbind them when you don’t want to use them on next object.

9. Example Program 1/5 #include "freeimage.h" #include "glew.h" #include "glut.h" #define NUM_TEXTURE 1 unsigned int texObject[NUM_TEXTURE]; void LoadTexture(char* pFilename); void display(); void reshape(GLsizei w, GLsizei h); void keyboard(unsigned char key, int x, int y);

10. Example Program 2/5 int main(int argc, char** argv){ glutInit(&argc, argv); glutInitWindowSize(400, 400); glutInitWindowPosition(0, 0); glutInitDisplayMode(GLUT_SINGLE | GLUT_RGBA | GLUT_DEPTH); glutCreateWindow("Texture"); glewInit(); FreeImage_Initialise(); glGenTextures(NUM_TEXTURE, texObject); LoadTexture("check.bmp"); FreeImage_DeInitialise(); glutDisplayFunc(display); glutReshapeFunc(reshape); glutKeyboardFunc(keyboard); glutMainLoop(); return 0; }

11. Example Program 3/5 void LoadTexture(char* pFilename){ FIBITMAP* pImage = FreeImage_Load(FreeImage_GetFileType(pFilename, 0), pFilename); FIBITMAP *p32BitsImage = FreeImage_ConvertTo32Bits(pImage); int iWidth = FreeImage_GetWidth(p32BitsImage); int iHeight = FreeImage_GetHeight(p32BitsImage); glBindTexture(GL_TEXTURE_2D, texObject[0]); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA8, iWidth, iHeight, 0, GL_BGRA, GL_UNSIGNED_BYTE, (void*)FreeImage_GetBits(p32BitsImage)); glHint(GL_PERSPECTIVE_CORRECTION_HINT, GL_NICEST); FreeImage_Unload(p32BitsImage); FreeImage_Unload(pImage); }

12. Example Program 4/5 void display(){ glClear(GL_COLOR_BUFFER_BIT); glColor3f(1.0, 1.0, 1.0); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, texObject[0]); glBegin(GL_QUADS); glTexCoord2f(0.0, 0.0); glVertex3f(-50.0, 0.0, 0.0); glTexCoord2f(100.0, 0.0); glVertex3f(-50.0, 0.0, 100.0); glTexCoord2f(100.0, 100.0); glVertex3f(50.0, 0.0, 100.0); glTexCoord2f(0.0, 100.0); glVertex3f(50.0, 0.0, 0.0); glEnd(); glFlush(); } void reshape(GLsizei w, GLsizei h){ glViewport(0, 0, w, h); glMatrixMode(GL_PROJECTION); glLoadIdentity(); gluPerspective(60.0, (GLfloat)w/(GLfloat)h, 0.5, 100.0); glMatrixMode(GL_MODELVIEW); glLoadIdentity(); gluLookAt(0.0, 0.5, 0.0, 50.0, 0.0, 50.0, 0.0, 1.0, 0.0); }

13. Example Program 5/5 void keyboard(unsigned char key, int x, int y){ switch(key){ case 'n': glBindTexture(GL_TEXTURE_2D, texObject[0]); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); break; case 'm': glBindTexture(GL_TEXTURE_2D, texObject[0]); glGenerateMipmap(GL_TEXTURE_2D); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR_MIPMAP_LINEAR); break; case 27: exit(0); } glutPostRedisplay(); }

14. Result Width/Height: 256/256

15. Load Image File FreeImage_Initialise() and FreeImage_DeInitialise(); Initialise the FreeImage library and release library FreeImage_Load(format, file name) Load a image file FreeImage_GetFileType Get the image format FreeImage_ConvertTo32Bits Convert the image to 32bit (BGRA 8 bits per channel) FreeImage_Unload Release image Main Memory CPU FreeImage HD

16. Generate Texture Object void glGenTextures( GLsizei n, GLuint *textures ); To generate texture names. http://msdn.microsoft.com/library/default.asp?url=/library/en-us/opengl/glfunc02_3p6b.asp n: the number of texture names to be generated. textures: pointer to the first element of an array in which the texture are stored. GLboolean glIsTexture( GLuint texture ); To determine if a name corresponds to a texture. http://msdn.microsoft.com/library/default.asp?url=/library/en-us/opengl/glfunc03_7cv9.asp

17. Bind texture void glBindTexture( GLenum target, GLuint texture ); To bind the texture to the target. http://msdn.microsoft.com/library/default.asp?url=/library/en-us/opengl/glfunc01_3bad.asp target: GL_TEXTURE_1D, GL_TEXTURE_2D void glDeleteTextures( GLsizei n, const GLuint *textures ); Delete named textures. http://msdn.microsoft.com/library/default.asp?url=/library/en-us/opengl/glfunc01_6vqr.asp

18. Send texture data: glTexImage2D 1/4 void glTexImage2D( GLenum target, GLint level, GLint internalformat, GLsizei width, GLsizei height, GLint border, GLenum format, GLenum type, const GLvoid *pixels ); Main MemoryVideo Memory CPUGPU glTexImage

19. Send texture data: glTexImage2D 2/4 Specifies a 2D texture image Target GL_TEXTURE_2D Level level-of-detail level. It must be 0 if you don ’ t want to set to mipmap. internalformat: The memory format in the video card memory GL_RGB, GL_RGBA, GL_RGBA_FLOAT32_ATI, … Width / height : image witdh / height

20. Send texture data: glTexImage2D 3/4 border: 0 or 1 0 : no border, image width & height must be power of 2. 1 : use border, image width & height must be power of 2 plus 2. Texture border

21. Send texture data: glTexImage2D 4/4 format: format of the loaded image data GL_RGB, GL_RGBA, GL_BGR, GL_BGRA … type: data type of the image data GL_UNSIGNED_BYTE, GL_FLOAT, … pixel: The pointer to the image data in main memory.

22. Texture Setting: glTexEnv 1/3 void glTexEnv{fi}(GLenum target, GLenum pname, GLfloat param ); to indicate how the texels are combined with the original pixels http://msdn.microsoft.com/library/default.asp?url=/library/en-us/opengl/glfunc03_6xyu.asp target: must be GL_TEXTURE_ENV pname: must be GL_TEXTURE_ENV_MODE param: 5 choices, see next page

23. Texture Setting: glTexEnv 2/3 Base Internal Format GL_REPLACEGL_MODULATEGL_ADD GL_ALPHAC = Cf, A = AtC = Cf, A = AfAtC=Cf, A=AfAt GL_LUMINANCEC = Lt, A = AfC = CfLt, A = AfC=Cf+CT, A=Af GL_LUMINANCE_ALPHAC = Lt, A = AtC = CfLt, A = AfAtC=Cf+Ct, A=AfAt GL_INTENSITYC = It, A = ItC = CfIt, A = AfItC=Cf+Ct, A=Af+At GL_RGBC = Ct, A = AfC = CfCt, A = AfC=Cf+Ct, A=Af GL_RGBAC = Ct, A = AtC = CfCt, A = AfAtC=Cf+Ct, A=AfAt Base Internal Format GL_DECALGL_BLEND GL_ALPHAUndefinedC = Cf, A = AfAt GL_LUMINANCEUndefinedC = Cf(1-Lt)+CcLt, A = Af GL_LUMINANCE_ALPHAUndefinedC = Cf(1-Lt)+CcLt, A = AfAt GL_INTENSITYUndefinedC = Cf(1-It)+CcIt, A = Af(1-It)+AcIt GL_RGBC = Ct, A = AfC = Cf(1-Ct)+CcCt, A = Af GL_RGBAC = Cf(1-At)+CtAt, A = AtC = Cf(1-Ct)+CcCt, A = AfAt Ct = color of texture, At = alpha of texture Cf = color of frame buffer, Af = alpha of frame buffer

24. Texture Setting: glTexEnv 3/3 glTexEnv{fi}v(GLenum target, GLenum pname, const GLfloat *params ) target: must be GL_TEXTURE_ENV pname: GL_TEXTURE_ENV_COLOR or GL_TEXTURE_ENV_MODE params: if pname is GL_TEXTURE_ENV_MODE : A pointer to an array of parameters.( GL_MODULATE, GL_DECAL, and GL_BLEND ) if pname is GL_TEXTURE_ENV_COLOR: a pointer to an array of R, G, B, A

25. Texture parameter 1/5 glTexParameter{if}(GLenum target, GLenum pname, GLfloat param ) Set texture parameters. http://msdn.microsoft.com/library/default.asp?url=/library/en-us/opengl/glfunc03_9upe.asp target: GL_TEXTURE_1D, GL_TEXTURE_2D pname / param: see next page

26. Texture parameter 2/5 pnameparam GL_TEXTURE_WRAP_S GL_TEXTURE_WRAP_TGL_REPEAT, GL_CLAMP, GL_CLAMP_TO_BORDER, GL_CLAMP_TO_EDGE, GL_TEXTURE_MAG_FILTER GL_TEXTURE_MIN_FILTERGL_NEAREST, GL_LINEAR, GL_NEAREST_MIPMAP_NEAREST, GL_NEAREST_MIPMAP_LINEAR, GL_LINEAR_MIPMAP_LINEAR, GL_LINEAR_MIPMAP_NEAREST GL_TEXTURE_BORDER_COLORcolor value

27. Texture parameter 3/5 WRAP Repeat both S, T Clamp both S, T Repeat T but Clamp S

28. Texture parameter 4/5 MAG filter When the pixel being textured maps to an area less than or equal to one texture element MIN filter When the pixel being textured maps to an area greater then one texture element

29. Texture parameter 5/5 GL_NEARST pixel texel GL_LINEAR Get weighted average color GL_NEAREST_MIPMAP_XXXXXX Find the most closely match mipmap GL_LINEAR_MIPMAP_XXXXXXX Find the most 2 closely match mipmap and get average.

30. Build mipmaps glGenerateMipmap(Target) Generate the mipmap from base level to max level Target: the type of this texture GL_TEXTURE_2D, GL_TEXTURE_3D, GL_TEXTURE_CUBE, … Don’t call it before glTexImage You can assign the base level and max level by following. glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_BASE_LEVEL, baseLevel); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAX_LEVEL, maxLevel);

31. Unconstrained Anisotropic Filter glBindTexture(GL_TEXTURE_2D, texObject[0]); glGenerateMipmap(GL_TEXTURE_2D); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR_MIPMAP_LINEAR); float fLargest; glGetFloatv(GL_MAX_TEXTURE_MAX_ANISOTROPY_EXT, &fLargest); glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAX_ANISOTROPY_EXT, fLargest); //If the number of samples is 1, it is the regular mipmap. texture Pre-image UAFMipmap Level 0 Level 1 Level 2

32. Compare NearestMipmapUAF

33. Automatic Texture Coordinate Generation No need to use glTexCoord Four types Sphere Object plane Eye plane Cube

34. Sphere environment.bmp Width/Height: 128/128

37. Object plane -1 S = 1.0 x + 0.0 y + 0.0 z + 0.0 w T = 0.0 x + 1.0 y + 0.0 z + 0.0 w xyz in world space

38. Object plane -2 S = 1.0 x + 0.0 y + 0.0 z + 0.0 w T = 0.0 x + 2.0 y + 0.0 z + 0.0 w xyz in world space

39. Eye plane S = 1.0 x + 0.0 y + 0.0 z + 0.0 w T = 0.0 x + 1.0 y + 0.0 z + 0.0 w xyz in eye space

40. Sphere Example //in display glTexGeni(GL_S, GL_TEXTURE_GEN_MODE, GL_SPHERE_MAP); glTexGeni(GL_T, GL_TEXTURE_GEN_MODE, GL_SPHERE_MAP); glEnable(GL_TEXTURE_GEN_S); glEnable(GL_TEXTURE_GEN_T); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, texObject[0]); //draw your objects //Disable them if you don’t want use apply them to next object

41. Object Plane Example //in display float params1[] = {1.0, 0.0, 0.0,0.0}; float params2[] = {0.0, 1.0, 0.0,0.0}; glTexGeni(GL_S, GL_TEXTURE_GEN_MODE, GL_OBJECT_LINEAR); glTexGeni(GL_T, GL_TEXTURE_GEN_MODE, GL_OBJECT_LINEAR); glTexGenfv(GL_S, GL_OBJECT_PLANE, params1); glTexGenfv(GL_T, GL_OBJECT_PLANE, params2); glEnable(GL_TEXTURE_GEN_S); glEnable(GL_TEXTURE_GEN_T); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, texObject[0]); //draw your objects //Disable them if you don’t want use apply them to next object

42. Eye Plane Example //in display float params1[] = {1.0, 0.0, 0.0,0.0}; float params2[] = {0.0, 1.0, 0.0,0.0}; glTexGeni(GL_S, GL_TEXTURE_GEN_MODE, GL_EYE_LINEAR); glTexGeni(GL_T, GL_TEXTURE_GEN_MODE, GL_EYE_LINEAR); glTexGenfv(GL_S, GL_EYE_PLANE, params1); glTexGenfv(GL_T, GL_EYE_PLANE, params2); glEnable(GL_TEXTURE_GEN_S); glEnable(GL_TEXTURE_GEN_T); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, texObject[0]); //draw your objects //Disable them if you don’t want use apply them to next object

43. Cube

44. Result Reflection Normal

45. Cube Example Bind Once, send six images. glBindTexture(GL_TEXTURE_CUBE_MAP, id); glTexImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_X, 0, GL_RGB, imageSize, imageSize, 0, GL_BGRA, GL_UNSIGNED_BYTE, image1); glTexImage2D(GL_TEXTURE_CUBE_MAP_NEGATIVE_X, 0, GL_RGB, imageSize, imageSize, 0, GL_BGRA, GL_UNSIGNED_BYTE, image2); glTexImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_Y, 0, GL_RGB, imageSize, imageSize, 0, GL_BGRA, GL_UNSIGNED_BYTE, image3); glTexImage2D(GL_TEXTURE_CUBE_MAP_NEGATIVE_Y, 0, GL_RGB, imageSize, imageSize, 0, GL_BGRA, GL_UNSIGNED_BYTE, image4); glTexImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_Z, 0, GL_RGB, imageSize, imageSize, 0, GL_BGRA, GL_UNSIGNED_BYTE, image5); glTexImage2D(GL_TEXTURE_CUBE_MAP_NEGATIVE_Z, 0, GL_RGB, imageSize, imageSize, 0, GL_BGRA, GL_UNSIGNED_BYTE, image6); glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MAG_FILTER, GL_LINEAR); glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MIN_FILTER, GL_LINEAR);

46. Texture Coordinate //in display glTexGeni(GL_S, GL_TEXTURE_GEN_MODE, GL_REFLECTION_MAP); glTexGeni(GL_T, GL_TEXTURE_GEN_MODE, GL_REFLECTION_MAP); glTexGeni(GL_R, GL_TEXTURE_GEN_MODE, GL_REFLECTION_MAP); glEnable(GL_TEXTURE_GEN_S); glEnable(GL_TEXTURE_GEN_T); glEnable(GL_TEXTURE_GEN_R); glEnable(GL_TEXTURE_CUBE_MAP); glBindTexture(GL_TEXTURE_CUBE_MAP, id); //draw your objects //Disable them if you don’t want use apply them to next object

47. Automatic Texture-Coordinate Generation glTexGen{dfi}(GLenum coord, GLenum pname, GLdouble param); control the generation of texture coordinates http://msdn.microsoft.com/library/default.asp?url=/library/en-us/opengl/glfunc03_73u6.asp coord: GL_S, GL_T, GL_R, or GL_Q. pname: must be GL_TEXTURE_GEN_MODE. param: GL_OBJECT_LINEAR, GL_EYE_LINEAR, or GL_SPHERE_MAP

48. Automatic Texture-Coordinate Generation glTexGen{dfi}v(GLenum coord, GLenum pname, const GLdouble *params ); coord: GL_S, GL_T, GL_R, or GL_Q. pname: GL_TEXTURE_GEN_MODE, GL_OBJECT_PLANE, or GL_EYE_PLANE … params: the array of texture generation parameters, if pname is GL_OBJECT_PLANE, or GL_EYE_PLANE. *Generated plane = p1X + p2Y + p3Z + p4W

49. Multi-texture Op 0 Op 1 Op 2 Op n glActiveTexture( GL_TEXTURE0 ); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, …); Pixel Color final color glActiveTexture( GL_TEXTURE1 ); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, …); glActiveTexture( GL_TEXTURE2 ); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, …); glActiveTexture( GL_TEXTUREn ); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, …);

50. Texture Layer void glActiveTexture(GLenum texture) Parameter: GL_TEXTURE0 ~ GL_MAX_TEXTURE_UNITS – 1 Choose layer before binding texture Bind 0 => No texture to the chosen layer

51. Operation glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_COMBINE); glTexEnvf(GL_TEXTURE_ENV, GL_COMBINE_RGB, operation); Operation GL_MODULATE / GL_ADD or /... / GL_SUBTRACT

52. Multiple Texture Coordinate glMultiTexCoord2fARB(GLenum target, GLshort s, GLshort t); Target GL_TEXTURE0 ~ GL_MAX_TEXTURE_UNITS – 1 s, t The texture coordinate of vertex Set the texture coordinate before calling glVertex You need the glew libraray. The setting of glew is similar to the glaux

53. Example void display() { glClearColor(0.0, 0.0, 0.0, 0.0); glClear(GL_COLOR_BUFFER_BIT); glColor3f(1.0, 1.0, 1.0); //bind texture 0 glActiveTexture(GL_TEXTURE0); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, texObject[0]); glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_COMBINE); glTexEnvf (GL_TEXTURE_ENV, GL_COMBINE_RGB, GL_MODULATE); //bind texture 1 glActiveTexture(GL_TEXTURE1); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, texObject[1]); glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_COMBINE); glTexEnvf(GL_TEXTURE_ENV, GL_COMBINE_RGB, GL_MODULATE);

54. glBegin(GL_QUADS); glColor3f(1.0, 1.0, 1.0) glMultiTexCoord2f(GL_TEXTURE0, 0.0, 0.0); glMultiTexCoord2f(GL_TEXTURE1, 0.0, 0.0); glVertex3f(-1.0, -1.0, 0.0); glMultiTexCoord2f(GL_TEXTURE0, 1.0, 0.0); glMultiTexCoord2f(GL_TEXTURE1, 3.0, 0.0); glVertex3f(1.0, -1.0, 0.0); glMultiTexCoord2f(GL_TEXTURE0, 1.0, 1.0); glMultiTexCoord2f(GL_TEXTURE1, 3.0, 3.0); glVertex3f(1.0, 1.0, 0.0); glMultiTexCoord2f(GL_TEXTURE0, 0.0, 1.0); glMultiTexCoord2f(GL_TEXTURE1, 0.0, 3.0); glVertex3f(-1.0, 1.0, 0.0); glEnd();

55. //unbind texture 1 glActiveTexture(GL_TEXTURE1); glDisable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, 0); //unbind texture 0 glActiveTexture(GL_TEXTURE0); glDisable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, 0); glFlush(); }

56. Result 1 st texture2 nd textureResult