View
238
Download
4
Category
Tags:
Preview:
DESCRIPTION
OpenGL L05-Texturing
Citation preview
Mohammad Shaker
mohammadshaker.com
@ZGTRShaker
2014
OpenGL Graphics
L05-Texturing
Texturing
that appears in a video game needs to be textured; this includes everything from plants
to people. If things aren’t textured well, your game just won’t look right.
OpenGL Architecture
DisplayList
PolynomialEvaluator
Per VertexOperations &
PrimitiveAssembly
RasterizationPer Fragment
OperationsFrameBuffer
TextureMemory
CPU
PixelOperations
OpenGL Architecture
DisplayList
PolynomialEvaluator
Per VertexOperations &
PrimitiveAssembly
RasterizationPer Fragment
OperationsFrameBuffer
TextureMemory
CPU
PixelOperations
How to use a Texture?
• How to use a Texture?
1. Load the texture
2. Map it into a polygon
3. Draw the polygon
How to use a Texture?
• How to use a Texture?
1. Load the texture
2. Map it into a polygon
3. Draw the polygon
• How to use a Texture? (OpenGL)1. Specify textures in texture objects
2. Set texture filter
3. Set texture function
4. Set texture wrap mode
5. Set optional perspective correction hint
6. Bind texture object
7. Enable texturing
8. Supply texture coordinates for vertex
• How OpenGL store images?– One image per texture object
– May be shared by several graphics contexts
Textures Coordinates
Textures Coordinates
Texture Mapping
s
t
x
y
z
image
geometry
screen
Textures Coordinates
Textures Coordinates
Textures Coordinates
s
t
1, 10, 1
0, 0 1, 0
(s, t) = (0.2, 0.8)
(0.4, 0.2)
(0.8, 0.4)
A
B C
a
b
c
Texture Space Object Space
Textures Coordinates
Texturing Functions
Texturing Functions
• Generate texture names
glGenTextures(n, *texIds);
• Create texture objects with texture data and state
glBindTexture(target, id);
• Bind textures before using
glBindTexture(target, id);
• Define a texture image from an array of texels in CPU memory
glTexImage2D(target, level, components, w, h, border, format, type,
*texels);
• Texel colors are processed by pixel pipeline
– pixel scales, biases and lookups can be done
Filter Modes
• Filter modes control how pixels are minified or magnified. Generally a color is
computed using the nearest texel or by a linear average of several texels.
• The filter type, above is one of GL_TEXTURE_MIN_FILTER or GL_TEXTURE_MAG_FILTER.
• The mode is one of GL_NEAREST, GL_LINEAR, or special modes for mipmapping.
Mipmapping modes are used for minification only, and have values of:
– GL_NEAREST_MIPMAP_NEAREST
– GL_NEAREST_MIPMAP_LINEAR
– GL_LINEAR_MIPMAP_NEAREST
– GL_LINEAR_MIPMAP_LINEAR
Filter Modes
• Example: glTexParameteri(target, type, mode);
Texture Polygon
Magnification Minification
PolygonTexture
Wrapping Mode
• Wrap mode determines what should happen if a texture coordinate lies outside of the [0,1] range.
• If the GL_REPEAT wrap mode is used, for texture coordinate values less than zero or greater than
one, the integer is ignored and only the fractional value is used.
• If the GL_CLAMP wrap mode is used, the texture value at the extreme (either 0 or 1) is used.
• Example:
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP)
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT)
textureGL_REPEATwrapping
GL_CLAMPwrapping
s
t
Texture Parameters
Read more: https://open.gl/textures
Body Color When Textured
• glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE);
– resultColor = Body Color + Texture Color [By default]
• glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE);
– resultColor = Texture Color
• glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_BLEND);
– resultColor = Texture Color + Blending
• GLfloat fColor[4] = { 0.0f, 0.0f, 0.0f, 1f };
• glTexEnvfv(GL_TEXTURE_ENV, GL_TEXTURE_ENV_COLOR, fColor);
TexturingSomething to pay attention for
Something to pay attention for
• The image must be 24 bit (RGB)
• The image extension should be .bmp
• The image dimensions must be a power of 2 (2, 4, 8, 16, 32, 64, ..etc.)
– If dimensions of image are not power of 2 then scale:
• gluScaleImage(format, w_in, h_in, type_in, *data_in, w_out, h_out, type_out, *data_out);
*_in is for source image
*_out is for destination image
• White color should be assigned before drawing a textured object by setting:
glColor3f(1,1,1);
• You should call: glBindTexture(GL_TEXTURE_2D, textureID) between glBegin() and
glEnd()
Texturing Example
Texturing Example
• #include "texture.h”
• int imageTexId;
• InitGL()
– imageTexId = LoadTexture("images//tile.bmp");
• DrawGLScene()
glEnable(GL_TEXTURE_2D);
glBindTexture(GL_TEXTURE_2D, imageTexId);
glScalef(5,5,1);
glBegin(GL_QUADS);
glTexCoord2f(1,0) ; glVertex3f(1,-1,1);
glTexCoord2f(1,1) ; glVertex3f(1,1,1);
glTexCoord2f(0,1) ; glVertex3f(-1,1,1);
glTexCoord2f(0,0) ; glVertex3f(-1,-1,1);
glEnd();
glDisable(GL_TEXTURE_2D);
Texturing Example
• #include "texture.h”
• int imageTexId;
• InitGL()
– imageTexId = LoadTexture("images//tile.bmp");
• DrawGLScene()
glEnable(GL_TEXTURE_2D);
glBindTexture(GL_TEXTURE_2D, imageTexId);
glScalef(5,5,1);
glBegin(GL_QUADS);
glTexCoord2f(1,0) ; glVertex3f(1,-1,1);
glTexCoord2f(1,1) ; glVertex3f(1,1,1);
glTexCoord2f(0,1) ; glVertex3f(-1,1,1);
glTexCoord2f(0,0) ; glVertex3f(-1,-1,1);
glEnd();
glDisable(GL_TEXTURE_2D);
Texturing Example
• #include "texture.h”
• int imageTexId;
• InitGL()
– imageTexId = LoadTexture("images//tile.bmp");
• DrawGLScene()
glEnable(GL_TEXTURE_2D);
glBindTexture(GL_TEXTURE_2D, imageTexId);
glScalef(5,5,1);
glBegin(GL_QUADS);
glTexCoord2f(1,0) ; glVertex3f(1,-1,1);
glTexCoord2f(1,1) ; glVertex3f(1,1,1);
glTexCoord2f(0,1) ; glVertex3f(-1,1,1);
glTexCoord2f(0,0) ; glVertex3f(-1,-1,1);
glEnd();
glDisable(GL_TEXTURE_2D);
Texturing Example
• #include "texture.h”
• int imageTexId;
• InitGL()
– imageTexId = LoadTexture("images//tile.bmp");
• DrawGLScene()
glEnable(GL_TEXTURE_2D);
glBindTexture(GL_TEXTURE_2D, imageTexId);
glScalef(5,5,1);
glBegin(GL_QUADS);
glTexCoord2f(1,0) ; glVertex3f(1,-1,1);
glTexCoord2f(1,1) ; glVertex3f(1,1,1);
glTexCoord2f(0,1) ; glVertex3f(-1,1,1);
glTexCoord2f(0,0) ; glVertex3f(-1,-1,1);
glEnd();
glDisable(GL_TEXTURE_2D);
gluQuadricTexture
gluQuadricTexture
+
gluQuadricTexture
+ =
gluQuadricTexture
Blending
Blending
• You can blend objects using:
– glBlendFunc(GLenum sfactor, GLenum dfactor);
• sfactor: is the source blend factor
• dfactor: is the destination blend factor
• Transparency is implemented using:
– “GL_SRC_ALPHA” for the source
– “GL_ONE_MINUS_SRC_ALPHA” for the destination
Blending
• You can blend objects using:
– glBlendFunc(GLenum sfactor, GLenum dfactor);
• sfactor: is the source blend factor
• dfactor: is the destination blend factor
• Transparency is implemented using:
– “GL_SRC_ALPHA” for the source
– “GL_ONE_MINUS_SRC_ALPHA” for the destination
OpenGL Architecture
DisplayList
PolynomialEvaluator
Per VertexOperations &
PrimitiveAssembly
RasterizationPer Fragment
OperationsFrameBuffer
TextureMemory
CPU
PixelOperations
OpenGL Architecture
DisplayList
PolynomialEvaluator
Per VertexOperations &
PrimitiveAssembly
RasterizationPer Fragment
OperationsFrameBuffer
TextureMemory
CPU
PixelOperations
Blending
• Combine pixels with what’s in already in the framebuffer
glBlendFunc(src, dst )
FramebufferPixel (dst)
BlendingEquation
Fragment(src)
BlendedPixel
pfr CdstCsrcC
Transparency with .tga (32 bit)
Transparency with .tga
+ =
Transparency with .tga
+ =
One .tga File
Add Transparency with .tga
• #include "tgaLoader.h”
• TGAImage grassImage;
• InitGL ()
– glEnable(GL_TEXTURE_2D);
– grassImage = LoadTGA(“images//grass.tga");
• DrawGLScene ()
glBindTexture(GL_TEXTURE_2D , grassImage.texID);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA , GL_ONE_MINUS_SRC_ALPHA);
glBegin(GL_QUADS);
glTexCoord2f(1,0); glVertex3f(5,-5,0);
glTexCoord2f(1,1); glVertex3f(5,5,0);
glTexCoord2f(0,1); glVertex3f(-5,5,0);
glTexCoord2f(0,0); glVertex3f(-5,-5,0);
glEnd();
glDisable(GL_BLEND);
Add Transparency with .tga
• #include "tgaLoader.h”
• TGAImage grassImage;
• InitGL ()
– glEnable(GL_TEXTURE_2D);
– grassImage = LoadTGA(“images//grass.tga");
• DrawGLScene ()
glBindTexture(GL_TEXTURE_2D , grassImage.texID);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA , GL_ONE_MINUS_SRC_ALPHA);
glBegin(GL_QUADS);
glTexCoord2f(1,0); glVertex3f(5,-5,0);
glTexCoord2f(1,1); glVertex3f(5,5,0);
glTexCoord2f(0,1); glVertex3f(-5,5,0);
glTexCoord2f(0,0); glVertex3f(-5,-5,0);
glEnd();
glDisable(GL_BLEND);
Add Transparency with .tga
• #include "tgaLoader.h”
• TGAImage grassImage;
• InitGL ()
– glEnable(GL_TEXTURE_2D);
– grassImage = LoadTGA(“images//grass.tga");
• DrawGLScene ()
glBindTexture(GL_TEXTURE_2D , grassImage.texID);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA , GL_ONE_MINUS_SRC_ALPHA);
glBegin(GL_QUADS);
glTexCoord2f(1,0); glVertex3f(5,-5,0);
glTexCoord2f(1,1); glVertex3f(5,5,0);
glTexCoord2f(0,1); glVertex3f(-5,5,0);
glTexCoord2f(0,0); glVertex3f(-5,-5,0);
glEnd();
glDisable(GL_BLEND);
Add Transparency with .tga
Transparency with .tga (32 bit)Something to pay attention for, again
Something to pay attention for, again
• The image must be 24 bit (RGB)
• The image extension should be .bmp
• The image dimensions must be a power of 2 (2, 4, 8, 16, 32, 64, ..etc.) or scale.
• White color should be assigned before drawing a textured object by setting:
glColor3f(1,1,1);
• You should call: glBindTexture(GL_TEXTURE_2D, textureID) between
glBegin() and glEnd()
• Additional stuff when you use transparency with .tga
– The image must be 32 bit (RGB)
– The image extension should be .tga
– In InitGL(), You must load .tga files LAST
– In DrawGLScene(), you must draw the transparent objects LAST
Texture Tilling
Texture TillingTiling is a very simple effect that creates a repeating pattern of
an image on the surface of a primitive object
Texture Tilling
Using a small image to cover a large surface makes tiling a useful way to increase the performance of your textures and decrease the size of your image files.
Texture Tilling, How toSimply set the texture coordinates larger than 1
as many time as you want the texture to be tilled
Billboarding
Billboarding
Mipmapping
Mipmappingmultum in parvo (mip): many things in a small place
Mipmapped Textures
• Mipmap allows for prefiltered texture maps of decreasing resolutions
• Lessens interpolation errors for smaller textured objects
• Declare mipmap level during texture definition
glTexImage*D(GL_TEXTURE_*D, level, …)
• GLU mipmap builder routines
gluBuild*DMipmaps()
2D Texture and 3D Texture?http://gamedev.stackexchange.com/questions/9668/what-are-3d-textures
2D Texture and 3D Texture
• All we have used so far are 2D textures mapped on a 3D coordinates.
• So what’s a 3D texture?!
– 3D texture (or sometimes called “Volume textures”) works like regular 2D texture but it is truly
3D. 2D textures has UV coordinates, 3D has UVW coordinates
Textures Coordinates
• Texture coordinates are named s, t, r, and q
2D Texture and 3D Texture
• 3D textures are used in:
– Textures mapped into a model vertices
– volumetric effects in games (fire, smoke, light rays, realistic fog)
– caching light for realtime global illumination (CryEngine for example)
– scientific (MRI, CT scans are saved into volumes)
2D Texture and 3D Texture
• Watch Nvidia smoke box in a XFX 9600gt
– https://www.youtube.com/watch?v=9AS4xV-CK14
2D Texture and 3D Texture
• Watch Global illumination in CryEngine 3 Tech Trailer (HD)
– https://www.youtube.com/watch?v=Pq39Xb7OdH8
Recommended