cocos2d-x学习笔记——双重纹理透明特效

前端之家收集整理的这篇文章主要介绍了cocos2d-x学习笔记——双重纹理透明特效前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
  1. MultiTexture.png
  2. 不知道有没有人看到这个效果会眼熟。这个只是将openg es编程指南里面的多重纹理效果移植到cocos2d上面来。但是,本文多了一个可以设置亮度纹理位置和大小的方法
  3.  
  4. 这种效果可以用来模拟手电筒吧。
  5.  
  6. 就是利用了shader,读取两块纹理,然后通过一定的算法计算出叠加后的色值,最后渲染出来。
  7.  
  8. 我们了解到,渲染sprite的类是TriangleCommand,这个类只能渲染多个三角形,并且只能渲染一块纹理。因此,我们要使用CustomCommand来渲染两块纹理。
  9.  
  10. 我们在CustomCommand的执行回调里面写这样的代码
  11. 这段代码就是读取纹理、坐标、颜色信息,最后绘制出来。这里只是简简单单的写了一下,如果调用多的话,可以利用VAOVBO来优化一下执行效率。
  12. 这里要提醒的是,不能利用SpriteBatchNode来优化。因为SpriteBatchNode只会获取sprite的单个纹理,而灯光纹理却是没有的。SpriteBatchNode的优化原理是通过减少顶点提交的次数来优化的,如果你需要的话要也可以根据这个原理来做一些处理。
  13.  
  14. 而渲染的主要代码是在shader里面。利用fragment shader处理纹理,然后达成这样的效果
  15. gl_FragColor是最后输出的纹理色值。baseColor是读取的墙壁纹理值,最后lightColor是灯光效果纹理值。
  16.  
  17. 这里做了一下修改,将纹理范围不在0-1的值全部设置成了黑色,也就是将纹理外的颜色变成了黑色,然后参与计算。
  18.  
  19. 最后说一下我在做这个的时候遇到的一个坑,sprite自身的vertex shader里面用到的是p矩阵,然后我也用p矩阵,最后发现不能设置位置。最后,我发现Renderer在渲染三角形之前就将所有顶点做了mv变换,但是我这里没有变换,只好乖乖的用mvp矩阵了。
  20.  
  21. 本文代码下载地址:https://pan.baidu.com/s/1dEIwRQx

    查看原文:http://www.51xyyx.com/3282.html//Load the mv
  22. _glProgramState->apply(_modelViewTransform);
  23.  
  24. float size = sizeof(V3F_C4F_T2F2);
  25.  
  26. // Load the vertex position
  27. glVertexAttribPointer ( GLProgram::VERTEX_ATTRIB_POSITION,3,GL_FLOAT,GL_FALSE,size,&_verts[0]);
  28. glVertexAttribPointer ( GLProgram::VERTEX_ATTRIB_COLOR,4,&(_verts[0].color));
  29. // Load the texture coordinate
  30. glVertexAttribPointer ( GLProgram::VERTEX_ATTRIB_TEX_COORD,2,&(_verts[0].texCoords));
  31. glVertexAttribPointer ( GLProgram::VERTEX_ATTRIB_TEX_COORD1,&(_verts[0].texCoords1));
  32.  
  33. glEnableVertexAttribArray ( GLProgram::VERTEX_ATTRIB_POSITION );
  34. glEnableVertexAttribArray ( GLProgram::VERTEX_ATTRIB_COLOR );
  35. glEnableVertexAttribArray ( GLProgram::VERTEX_ATTRIB_TEX_COORD );
  36. glEnableVertexAttribArray ( GLProgram::VERTEX_ATTRIB_TEX_COORD1 );
  37.  
  38. //bind texture
  39. GL::bindTextureN(0,_texture->getName());
  40. glUniform1i(_glProgramState->getGLProgram()->getUniformLocation(GLProgram::UNIFORM_NAME_SAMPLER0),0);
  41.  
  42. GL::bindTextureN(1,_lightTexture->getName());
  43. glUniform1i(_glProgramState->getGLProgram()->getUniformLocation(GLProgram::UNIFORM_NAME_SAMPLER1),1);
  44.  
  45. //draw
  46. glDrawElements ( GL_TRIANGLES,6,GL_UNSIGNED_SHORT,quadIndices );void main()
  47. {
  48. vec4 baseColor;
  49. baseColor = texture2D( CC_Texture0,v_texCoord )*v_fragmentColor; vec4 lightColor;
  50. if (v_texCoord1.x>1.0 || v_texCoord1.y>1.0 || v_texCoord1.y < 0.0 || v_texCoord1.x<0.0 )
  51. {
  52. lightColor = vec4(0,0,1);
  53. }
  54. else
  55. {
  56. lightColor = texture2D( CC_Texture1,v_texCoord1 );
  57. }
  58. gl_FragColor = baseColor * (lightColor + 0.25);
  59. }

猜你在找的Cocos2d-x相关文章