opengl|es - 2D绘制

本文关注的是基于SDL的OPENGL|ES(下文简称ES)的2D绘制的实现方式。

ES中常见的实现2D的方法是使用正投影,然后绘制2D纹理

      

view plain copy to clipboard print ?
  1. glDisable( GL_DEPTH_TEST ) ;   
  2. glMatrixMode( GL_PROJECTION ) ;   
  3. glLoadIdentity() ;   
  4. /*  
  5.  * Upside-down square viewport: it maps the screen as if the (arbitrary-set) resolution were  
  6.  * 1000x1000 pixels.  
  7.  *  
  8.  */  
  9. glOrtho( /* left */ 0, /* right */ 1000, /* bottom */ 1000, /* top */ 0,    
  10.     /* near */ 0, /* far */ 1 ) ;   
  11.        
  12.     - or, preferably to keep the 4/3 ratio like 800x600, 640x480, 1024x768, etc. -   
  13. // Non-reversed 4/3 viewport:      
  14. glOrtho( /* left */ -320.0f, /* right */ 320.0f, /* bottom */ -240.0f, /* top */ 240.0f,    
  15.     /* near */ -1, /* far */ 1 )   

glDisable( GL_DEPTH_TEST ) ; glMatrixMode( GL_PROJECTION ) ; glLoadIdentity() ; /* * Upside-down square viewport: it maps the screen as if the (arbitrary-set) resolution were * 1000x1000 pixels. * */ glOrtho( /* left */ 0, /* right */ 1000, /* bottom */ 1000, /* top */ 0, /* near */ 0, /* far */ 1 ) ; - or, preferably to keep the 4/3 ratio like 800x600, 640x480, 1024x768, etc. - // Non-reversed 4/3 viewport: glOrtho( /* left */ -320.0f, /* right */ 320.0f, /* bottom */ -240.0f, /* top */ 240.0f, /* near */ -1, /* far */ 1 )  

 

这里有三个问题,

其一SDL与ES的坐标系统不同,SDL的(0,0)在屏幕的左上角,而ES的在屏幕的左下角,这里可以使用上下反转的正投影来解决,或者在每次绘制前使用如下的变换,

 

view plain copy to clipboard print ?
  1. glMatrixMode( GL_TEXTURE ) ;   
  2. glLoadIdentity() ;   
  3. glScalef( 1, -1, 1 ) ;  

glMatrixMode( GL_TEXTURE ) ; glLoadIdentity() ; glScalef( 1, -1, 1 ) ; 

 

其二OPENGL认为自己拥有整个屏幕,对于显示缓存,只能使用OPENGL进行控制

其三在OPENGL与SDL之间的BLIT,当SDL选择OPENGL模式的时候(OPENGLBLIT模式是不被推荐的)是不能之间进行的,这里使用了技巧,是将SDL的缓存转换成了OPENGL的材质,然后供OPENGL的2D显示使用,如下

 

view plain copy to clipboard print ?
  1.     /* Use the surface width and height expanded to powers of 2,OPENGL 的纹理大小必须是2的倍数 */  
  2.     w = gy_powerOfTwo(surface->w);   
  3.     h = gy_powerOfTwo(surface->h);   
  4.     texcoord[0] = 0;            /* Min X */  
  5.     texcoord[1] = 0;            /* Min Y */  
  6.     texcoord[2] = surface->w / (gy_real32)w; /* Max X */  
  7.     texcoord[3] = surface->h / (gy_real32)h; /* Max Y */  
  8.     image = SDL_CreateRGBSurface(   
  9.         SDL_SWSURFACE,   
  10.         w, h,   
  11.         32,   
  12. #if SDL_BYTEORDER != SDL_BIG_ENDIAN /* OpenGL RGBA masks */   
  13.                 0x000000ff,   
  14.         0x0000ff00,   
  15.         0x00ff0000,   
  16.         0xff000000   
  17. #endif   
  18.         );   
  19.     if ( image == NULL ) {   
  20.         return 0;   
  21.     }   
  22.     /* Save the alpha blending attributes */  
  23.     saved_flags = surface->flags&(SDL_SRCALPHA|SDL_RLEACCELOK);   
  24.     saved_alpha = surface->format->alpha;   
  25.     if ( (saved_flags & SDL_SRCALPHA) == SDL_SRCALPHA ) {   
  26.            
  27.     }   
  28.     SDL_SetAlpha(surface, SDL_SRCALPHA, saved_alpha);//记得在正投影后设置纹理的环境时,使用GL_MODULATE模式   
  29.           
  30.     /* Copy the surface into the GL texture image */  
  31.     area.x = 0;   
  32.     area.y = 0;   
  33.     area.w = surface->w;   
  34.     area.h = surface->h;   
  35.     SDL_BlitSurface(surface, &area, image, &area);   
  36.     
  37.     /* Restore the alpha blending attributes */  
  38.     if ( (saved_flags & SDL_SRCALPHA) == SDL_SRCALPHA ) {   
  39.         SDL_SetAlpha(surface, saved_flags, saved_alpha);   
  40.     }   
  41.     /* Create an OpenGL texture for the image */  
  42.     glGenTextures(1, &texture);     //生成纹理   
  43.     glBindTexture(GL_TEXTURE_2D, texture);  //选择纹理   
  44.     glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);   
  45.     glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);   
  46.     glTexImage2D(   
  47.         GL_TEXTURE_2D,   
  48.         0,   
  49.         GL_RGBA,   
  50.         w, h,   
  51.         0,   
  52.         GL_RGBA,   
  53.         GL_UNSIGNED_BYTE/*每种颜色8位*/,   
  54.         image->pixels);   
  55.     SDL_FreeSurface(image); /* No longer needed */  

/* Use the surface width and height expanded to powers of 2,OPENGL 的纹理大小必须是2的倍数 */ w = gy_powerOfTwo(surface->w); h = gy_powerOfTwo(surface->h); texcoord[0] = 0; /* Min X */ texcoord[1] = 0; /* Min Y */ texcoord[2] = surface->w / (gy_real32)w; /* Max X */ texcoord[3] = surface->h / (gy_real32)h; /* Max Y */ image = SDL_CreateRGBSurface( SDL_SWSURFACE, w, h, 32, #if SDL_BYTEORDER != SDL_BIG_ENDIAN /* OpenGL RGBA masks */ 0x000000ff, 0x0000ff00, 0x00ff0000, 0xff000000 #endif ); if ( image == NULL ) { return 0; } /* Save the alpha blending attributes */ saved_flags = surface->flags&(SDL_SRCALPHA|SDL_RLEACCELOK); saved_alpha = surface->format->alpha; if ( (saved_flags & SDL_SRCALPHA) == SDL_SRCALPHA ) { } SDL_SetAlpha(surface, SDL_SRCALPHA, saved_alpha);//记得在正投影后设置纹理的环境时,使用GL_MODULATE模式 /* Copy the surface into the GL texture image */ area.x = 0; area.y = 0; area.w = surface->w; area.h = surface->h; SDL_BlitSurface(surface, &area, image, &area); /* Restore the alpha blending attributes */ if ( (saved_flags & SDL_SRCALPHA) == SDL_SRCALPHA ) { SDL_SetAlpha(surface, saved_flags, saved_alpha); } /* Create an OpenGL texture for the image */ glGenTextures(1, &texture); //生成纹理 glBindTexture(GL_TEXTURE_2D, texture); //选择纹理 glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); glTexImage2D( GL_TEXTURE_2D, 0, GL_RGBA, w, h, 0, GL_RGBA, GL_UNSIGNED_BYTE/*每种颜色8位*/, image->pixels); SDL_FreeSurface(image); /* No longer needed */  

 

最后值得注意的是,ES在纹理绘制时选择使用glDrawElements函数,其最后一个参数是索引值,由于OPENGL是状态机驱动的,整个坐标系统是提前将状态设置好的,不用总是在困扰与这个东西是如何绘制出来,呵呵,如下是glDrawElements的使用方式

view plain copy to clipboard print ?
  1. glBindTexture(GL_TEXTURE_2D, uiTexture);   
  2. glEnableClientState( GL_VERTEX_ARRAY );    
  3. glEnableClientState( GL_NORMAL_ARRAY );   
  4. glEnableClientState( GL_TEXTURE_COORD_ARRAY );   
  5. glNormalPointer( GL_FLOAT, 0, rnormal );    
  6. glVertexPointer(3, GL_FLOAT, 0, vertex); //注意纹理坐标体系和点坐标体系是不同的   
  7. glTexCoordPointer(2,GL_FLOAT,0,textures );   
  8. glDrawElements( GL_TRIANGLES,6,GL_UNSIGNED_BYTE,trivert);     
  9. glDisableClientState( GL_TEXTURE_COORD_ARRAY );   
  10. glDisableClientState( GL_VERTEX_ARRAY );  

glBindTexture(GL_TEXTURE_2D, uiTexture); glEnableClientState( GL_VERTEX_ARRAY ); glEnableClientState( GL_NORMAL_ARRAY ); glEnableClientState( GL_TEXTURE_COORD_ARRAY ); glNormalPointer( GL_FLOAT, 0, rnormal ); glVertexPointer(3, GL_FLOAT, 0, vertex); //注意纹理坐标体系和点坐标体系是不同的 glTexCoordPointer(2,GL_FLOAT,0,textures ); glDrawElements( GL_TRIANGLES,6,GL_UNSIGNED_BYTE,trivert); glDisableClientState( GL_TEXTURE_COORD_ARRAY ); glDisableClientState( GL_VERTEX_ARRAY ); 

 

你可能感兴趣的:(image,filter,float,byte,attributes,textures)