[历史归档]本文原发布于 cstriker1407.info 个人博客内容为历史存档仅供参考。发布时间2014-04-03 标题cocos2dx学习笔记shaders分类编程 / C C / cocos2dx 标签cocos2dx·shaderscocos2dx学习笔记shaders参考文档ShaderskCCShaderType\_PositionTextureColorccShader\_PositionTextureColor\_vert.hccShader\_PositionTextureColor\_frag.hkCCShaderType\_PositionTextureColorAlphaTestccShader\_PositionTextureColor\_vert.hccShader\_PositionTextureColorAlphaTest\_frag.hkCCShaderType\_PositionColorccShader\_PositionColor\_vert.hccShader\_PositionColor\_frag.hkCCShaderType\_PositionTextureccShader\_PositionTexture\_vert.hccShader\_PositionTexture\_frag.hkCCShaderType\_PositionTexture\_uColorccShader\_PositionTexture\_uColor\_vert.hccShader\_PositionTexture\_uColor\_frag.hkCCShaderType\_PositionTextureA8ColorccShader\_PositionTextureA8Color\_vert.hccShader\_PositionTextureA8Color\_frag.hkCCShaderType\_Position\_uColorccShader\_Position\_uColor\_vert.hccShader\_Position\_uColor\_frag.hkCCShaderType\_PositionLengthTexureColorccShader\_PositionColorLengthTexture\_vert.hccShader\_PositionColorLengthTexture\_frag.hkCCShaderType\_ControlSwitchccShader\_PositionTextureColor\_vert.hccShaderEx\_SwitchMask\_frag.h根据【void CCShaderCache::loadDefaultShader(CCGLProgram *p, int type)】这个函数和【ccShaders.cpp】这个文件我们可以找到cocos2dx的自带的一些shader的代码。这里备注下学习笔记参考文档【 http://blog.csdn.net/carl_zhong/article/details/12219485 】【 http://blog.csdn.net/wangyuchun_799/article/details/7763373 】【 http://blog.csdn.net/wangyuchun_799/article/details/7770500 】ShaderskCCShaderType_PositionTextureColorccShader_PositionTextureColor_vert.h \ attribute vec4 a_position; \ //顶点位置 attribute vec2 a_texCoord; \ //顶点纹理坐标 attribute vec4 a_color; \ //顶点颜色 \ #ifdef GL_ES \ varying lowp vec4 v_fragmentColor; \ varying mediump vec2 v_texCoord; \ #else \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_fragmentColor a_color; \ //将输入的顶点颜色传到片段着色器里面 v_texCoord a_texCoord; \ //将输入的顶点纹理坐标传到片段着色器里面 } \ ;ccShader_PositionTextureColor_frag.h \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ uniform sampler2D CC_Texture0; \ \ void main() \ { \ // texture2D:根据采样器CC_Texture0和纹理坐标v_texCoord获取映射的颜色 // 用定点颜色和映射颜色算出输出的颜色 gl_FragColor v_fragmentColor * texture2D(CC_Texture0, v_texCoord); \ } \ ;kCCShaderType_PositionTextureColorAlphaTestccShader_PositionTextureColor_vert.h同上ccShader_PositionTextureColorAlphaTest_frag.h//和ccShader_PositionTextureColor_frag.h类似 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ uniform sampler2D CC_Texture0; \ uniform float CC_alpha_value; \ \ void main() \ { \ vec4 texColor texture2D(CC_Texture0, v_texCoord); \ \ // mimic: glAlphaFunc(GL_GREATER) \ // pass if ( incoming_pixel CC_alpha_value ) fail if incoming_pixel CC_alpha_value \ \ // 如果着色器执行了discard关键字片元将被直接扔掉gl_FragColor会变得毫不相干。 if ( texColor.a CC_alpha_value ) \ discard; \ \ gl_FragColor texColor * v_fragmentColor; \ } \ ;kCCShaderType_PositionColorccShader_PositionColor_vert.h//ccShader_PositionTextureColor_vert.h类似不过没有输入输出纹理坐标 \ attribute vec4 a_position; \ attribute vec4 a_color; \ #ifdef GL_ES \ varying lowp vec4 v_fragmentColor; \ #else \ varying vec4 v_fragmentColor; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_fragmentColor a_color; \ } \ ;ccShader_PositionColor_frag.h//ccShader_PositionTextureColor_frag.h类似,不过因为没有纹理坐标 //只用顶点颜色算出输出的颜色 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ \ void main() \ { \ gl_FragColor v_fragmentColor; \ } \ ;kCCShaderType_PositionTextureccShader_PositionTexture_vert.h//ccShader_PositionTextureColor_vert.h类似不过没有输入输出顶点颜色 \ attribute vec4 a_position; \ attribute vec2 a_texCoord; \ \ #ifdef GL_ES \ varying mediump vec2 v_texCoord; \ #else \ varying vec2 v_texCoord; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_texCoord a_texCoord; \ } \ ;ccShader_PositionTexture_frag.h//ccShader_PositionTextureColor_frag.h类似,不过因为没有顶点颜色 //只用映射颜色算出输出的颜色 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec2 v_texCoord; \ uniform sampler2D CC_Texture0; \ \ void main() \ { \ gl_FragColor texture2D(CC_Texture0, v_texCoord); \ } \ ;kCCShaderType_PositionTexture_uColorccShader_PositionTexture_uColor_vert.h//ccShader_PositionTexture_vert.h类似 \ attribute vec4 a_position; \ attribute vec2 a_texCoord; \ \ #ifdef GL_ES \ varying mediump vec2 v_texCoord; \ #else \ varying vec2 v_texCoord; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_texCoord a_texCoord; \ } \ ;ccShader_PositionTexture_uColor_frag.h//ccShader_PositionTexture_frag.h类似,使用映射颜色和u_color常量来算出输出的颜色 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ uniform vec4 u_color; \ \ varying vec2 v_texCoord; \ \ uniform sampler2D CC_Texture0; \ \ void main() \ { \ gl_FragColor texture2D(CC_Texture0, v_texCoord) * u_color; \ } \ ;kCCShaderType_PositionTextureA8ColorccShader_PositionTextureA8Color_vert.h//和ccShader_PositionTextureColor_vert.h类似 \ attribute vec4 a_position; \ attribute vec2 a_texCoord; \ attribute vec4 a_color; \ \ #ifdef GL_ES \ varying lowp vec4 v_fragmentColor; \ varying mediump vec2 v_texCoord; \ #else \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_fragmentColor a_color; \ v_texCoord a_texCoord; \ } \ ;ccShader_PositionTextureA8Color_frag.h//输出的颜色的rgb是传入的顶点的的颜色输出的颜色的a是顶点颜色.a和映射颜色.a的计算值 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ uniform sampler2D CC_Texture0; \ \ void main() \ { \ gl_FragColor vec4( v_fragmentColor.rgb,// RGB from uniform \ v_fragmentColor.a * texture2D(CC_Texture0, v_texCoord).a // A from texture uniform \ ); \ } \ ;kCCShaderType_Position_uColorccShader_Position_uColor_vert.h//输出给片段着色器的颜色是常量颜色u_color输出给片段着色器的大小是常量大小u_pointSize外部只传入一个position \ attribute vec4 a_position; \ uniform vec4 u_color; \ uniform float u_pointSize; \ \ #ifdef GL_ES \ varying lowp vec4 v_fragmentColor; \ #else \ varying vec4 v_fragmentColor; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ gl_PointSize u_pointSize; \ v_fragmentColor u_color; \ } \ ;ccShader_Position_uColor_frag.h//输出颜色只和顶点颜色有关顶点颜色由u_color赋值。 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ \ void main() \ { \ gl_FragColor v_fragmentColor; \ } \ ;kCCShaderType_PositionLengthTexureColorccShader_PositionColorLengthTexture_vert.h//输出给片段着色器的颜色是由输入颜色a_color计算出来的 //计算方式很简单让a_color的rgb颜色值根据alpha值再进行一次消减 \ #ifdef GL_ES \ attribute mediump vec4 a_position; \ attribute mediump vec2 a_texcoord; \ attribute mediump vec4 a_color; \ \ varying mediump vec4 v_color; \ varying mediump vec2 v_texcoord; \ \ #else \ attribute vec4 a_position; \ attribute vec2 a_texcoord; \ attribute vec4 a_color; \ \ varying vec4 v_color; \ varying vec2 v_texcoord; \ #endif \ \ void main() \ { \ v_color vec4(a_color.rgb * a_color.a, a_color.a); \ v_texcoord a_texcoord; \ \ gl_Position CC_MVPMatrix * a_position; \ } \ ;ccShader_PositionColorLengthTexture_frag.h/* 11genType step (genType edge, genType x)genType step (float edge, genType x) 如果x edge返回0.0否则返回1.0 12genType smoothstep (genType edge0,genType edge1,genType x)genType smoothstep (float edge0,float edge1,genType x) 如果x edge0返回0.0 如果x edge1 返回1.0如果edge0 x edge1则执行0~1之间的平滑埃尔米特差值。如果edge0 edge1结果是未定义的。 */ \ #ifdef GL_ES \ // #extension GL_OES_standard_derivatives : enable \ \ varying mediump vec4 v_color; \ varying mediump vec2 v_texcoord; \ #else \ varying vec4 v_color; \ varying vec2 v_texcoord; \ #endif \ \ void main() \ { \ // #if defined GL_OES_standard_derivatives \ // gl_FragColor v_color*smoothstep(0.0, length(fwidth(v_texcoord)), 1.0 - length(v_texcoord)); \ // #else \ gl_FragColor v_color*step(0.0, 1.0 - length(v_texcoord)); \ // #endif \ } \ ;kCCShaderType_ControlSwitchccShader_PositionTextureColor_vert.h同上ccShaderEx_SwitchMask_frag.h//使用不同的采样器对同一个纹理坐标v_texCoord进行采样得到两个颜色texColor maskColor //然后用这两个颜色算出finalColor最后用finalColor和顶点颜色计算出最终的输出颜色 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ uniform sampler2D u_texture; \ uniform sampler2D u_mask; \ \ void main() \ { \ vec4 texColor texture2D(u_texture, v_texCoord); \ vec4 maskColor texture2D(u_mask, v_texCoord); \ vec4 finalColor vec4(texColor.r, texColor.g, texColor.b, maskColor.a * texColor.a); \ gl_FragColor v_fragmentColor * finalColor; \ } \ ; 
长河君 · 2026/8/19 13:15:02 · 阅读 1.2k 【2014-04-03】cocos2dx学习笔记：shaders
[历史归档]本文原发布于 cstriker1407.info 个人博客内容为历史存档仅供参考。发布时间2014-04-03 标题cocos2dx学习笔记shaders分类编程 / C C / cocos2dx 标签cocos2dx·shaderscocos2dx学习笔记shaders参考文档ShaderskCCShaderType\_PositionTextureColorccShader\_PositionTextureColor\_vert.hccShader\_PositionTextureColor\_frag.hkCCShaderType\_PositionTextureColorAlphaTestccShader\_PositionTextureColor\_vert.hccShader\_PositionTextureColorAlphaTest\_frag.hkCCShaderType\_PositionColorccShader\_PositionColor\_vert.hccShader\_PositionColor\_frag.hkCCShaderType\_PositionTextureccShader\_PositionTexture\_vert.hccShader\_PositionTexture\_frag.hkCCShaderType\_PositionTexture\_uColorccShader\_PositionTexture\_uColor\_vert.hccShader\_PositionTexture\_uColor\_frag.hkCCShaderType\_PositionTextureA8ColorccShader\_PositionTextureA8Color\_vert.hccShader\_PositionTextureA8Color\_frag.hkCCShaderType\_Position\_uColorccShader\_Position\_uColor\_vert.hccShader\_Position\_uColor\_frag.hkCCShaderType\_PositionLengthTexureColorccShader\_PositionColorLengthTexture\_vert.hccShader\_PositionColorLengthTexture\_frag.hkCCShaderType\_ControlSwitchccShader\_PositionTextureColor\_vert.hccShaderEx\_SwitchMask\_frag.h根据【void CCShaderCache::loadDefaultShader(CCGLProgram *p, int type)】这个函数和【ccShaders.cpp】这个文件我们可以找到cocos2dx的自带的一些shader的代码。这里备注下学习笔记参考文档【 http://blog.csdn.net/carl_zhong/article/details/12219485 】【 http://blog.csdn.net/wangyuchun_799/article/details/7763373 】【 http://blog.csdn.net/wangyuchun_799/article/details/7770500 】ShaderskCCShaderType_PositionTextureColorccShader_PositionTextureColor_vert.h \ attribute vec4 a_position; \ //顶点位置 attribute vec2 a_texCoord; \ //顶点纹理坐标 attribute vec4 a_color; \ //顶点颜色 \ #ifdef GL_ES \ varying lowp vec4 v_fragmentColor; \ varying mediump vec2 v_texCoord; \ #else \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_fragmentColor a_color; \ //将输入的顶点颜色传到片段着色器里面 v_texCoord a_texCoord; \ //将输入的顶点纹理坐标传到片段着色器里面 } \ ;ccShader_PositionTextureColor_frag.h \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ uniform sampler2D CC_Texture0; \ \ void main() \ { \ // texture2D:根据采样器CC_Texture0和纹理坐标v_texCoord获取映射的颜色 // 用定点颜色和映射颜色算出输出的颜色 gl_FragColor v_fragmentColor * texture2D(CC_Texture0, v_texCoord); \ } \ ;kCCShaderType_PositionTextureColorAlphaTestccShader_PositionTextureColor_vert.h同上ccShader_PositionTextureColorAlphaTest_frag.h//和ccShader_PositionTextureColor_frag.h类似 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ uniform sampler2D CC_Texture0; \ uniform float CC_alpha_value; \ \ void main() \ { \ vec4 texColor texture2D(CC_Texture0, v_texCoord); \ \ // mimic: glAlphaFunc(GL_GREATER) \ // pass if ( incoming_pixel CC_alpha_value ) fail if incoming_pixel CC_alpha_value \ \ // 如果着色器执行了discard关键字片元将被直接扔掉gl_FragColor会变得毫不相干。 if ( texColor.a CC_alpha_value ) \ discard; \ \ gl_FragColor texColor * v_fragmentColor; \ } \ ;kCCShaderType_PositionColorccShader_PositionColor_vert.h//ccShader_PositionTextureColor_vert.h类似不过没有输入输出纹理坐标 \ attribute vec4 a_position; \ attribute vec4 a_color; \ #ifdef GL_ES \ varying lowp vec4 v_fragmentColor; \ #else \ varying vec4 v_fragmentColor; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_fragmentColor a_color; \ } \ ;ccShader_PositionColor_frag.h//ccShader_PositionTextureColor_frag.h类似,不过因为没有纹理坐标 //只用顶点颜色算出输出的颜色 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ \ void main() \ { \ gl_FragColor v_fragmentColor; \ } \ ;kCCShaderType_PositionTextureccShader_PositionTexture_vert.h//ccShader_PositionTextureColor_vert.h类似不过没有输入输出顶点颜色 \ attribute vec4 a_position; \ attribute vec2 a_texCoord; \ \ #ifdef GL_ES \ varying mediump vec2 v_texCoord; \ #else \ varying vec2 v_texCoord; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_texCoord a_texCoord; \ } \ ;ccShader_PositionTexture_frag.h//ccShader_PositionTextureColor_frag.h类似,不过因为没有顶点颜色 //只用映射颜色算出输出的颜色 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec2 v_texCoord; \ uniform sampler2D CC_Texture0; \ \ void main() \ { \ gl_FragColor texture2D(CC_Texture0, v_texCoord); \ } \ ;kCCShaderType_PositionTexture_uColorccShader_PositionTexture_uColor_vert.h//ccShader_PositionTexture_vert.h类似 \ attribute vec4 a_position; \ attribute vec2 a_texCoord; \ \ #ifdef GL_ES \ varying mediump vec2 v_texCoord; \ #else \ varying vec2 v_texCoord; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_texCoord a_texCoord; \ } \ ;ccShader_PositionTexture_uColor_frag.h//ccShader_PositionTexture_frag.h类似,使用映射颜色和u_color常量来算出输出的颜色 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ uniform vec4 u_color; \ \ varying vec2 v_texCoord; \ \ uniform sampler2D CC_Texture0; \ \ void main() \ { \ gl_FragColor texture2D(CC_Texture0, v_texCoord) * u_color; \ } \ ;kCCShaderType_PositionTextureA8ColorccShader_PositionTextureA8Color_vert.h//和ccShader_PositionTextureColor_vert.h类似 \ attribute vec4 a_position; \ attribute vec2 a_texCoord; \ attribute vec4 a_color; \ \ #ifdef GL_ES \ varying lowp vec4 v_fragmentColor; \ varying mediump vec2 v_texCoord; \ #else \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ v_fragmentColor a_color; \ v_texCoord a_texCoord; \ } \ ;ccShader_PositionTextureA8Color_frag.h//输出的颜色的rgb是传入的顶点的的颜色输出的颜色的a是顶点颜色.a和映射颜色.a的计算值 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ uniform sampler2D CC_Texture0; \ \ void main() \ { \ gl_FragColor vec4( v_fragmentColor.rgb,// RGB from uniform \ v_fragmentColor.a * texture2D(CC_Texture0, v_texCoord).a // A from texture uniform \ ); \ } \ ;kCCShaderType_Position_uColorccShader_Position_uColor_vert.h//输出给片段着色器的颜色是常量颜色u_color输出给片段着色器的大小是常量大小u_pointSize外部只传入一个position \ attribute vec4 a_position; \ uniform vec4 u_color; \ uniform float u_pointSize; \ \ #ifdef GL_ES \ varying lowp vec4 v_fragmentColor; \ #else \ varying vec4 v_fragmentColor; \ #endif \ \ void main() \ { \ gl_Position CC_MVPMatrix * a_position; \ gl_PointSize u_pointSize; \ v_fragmentColor u_color; \ } \ ;ccShader_Position_uColor_frag.h//输出颜色只和顶点颜色有关顶点颜色由u_color赋值。 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ \ void main() \ { \ gl_FragColor v_fragmentColor; \ } \ ;kCCShaderType_PositionLengthTexureColorccShader_PositionColorLengthTexture_vert.h//输出给片段着色器的颜色是由输入颜色a_color计算出来的 //计算方式很简单让a_color的rgb颜色值根据alpha值再进行一次消减 \ #ifdef GL_ES \ attribute mediump vec4 a_position; \ attribute mediump vec2 a_texcoord; \ attribute mediump vec4 a_color; \ \ varying mediump vec4 v_color; \ varying mediump vec2 v_texcoord; \ \ #else \ attribute vec4 a_position; \ attribute vec2 a_texcoord; \ attribute vec4 a_color; \ \ varying vec4 v_color; \ varying vec2 v_texcoord; \ #endif \ \ void main() \ { \ v_color vec4(a_color.rgb * a_color.a, a_color.a); \ v_texcoord a_texcoord; \ \ gl_Position CC_MVPMatrix * a_position; \ } \ ;ccShader_PositionColorLengthTexture_frag.h/* 11genType step (genType edge, genType x)genType step (float edge, genType x) 如果x edge返回0.0否则返回1.0 12genType smoothstep (genType edge0,genType edge1,genType x)genType smoothstep (float edge0,float edge1,genType x) 如果x edge0返回0.0 如果x edge1 返回1.0如果edge0 x edge1则执行0~1之间的平滑埃尔米特差值。如果edge0 edge1结果是未定义的。 */ \ #ifdef GL_ES \ // #extension GL_OES_standard_derivatives : enable \ \ varying mediump vec4 v_color; \ varying mediump vec2 v_texcoord; \ #else \ varying vec4 v_color; \ varying vec2 v_texcoord; \ #endif \ \ void main() \ { \ // #if defined GL_OES_standard_derivatives \ // gl_FragColor v_color*smoothstep(0.0, length(fwidth(v_texcoord)), 1.0 - length(v_texcoord)); \ // #else \ gl_FragColor v_color*step(0.0, 1.0 - length(v_texcoord)); \ // #endif \ } \ ;kCCShaderType_ControlSwitchccShader_PositionTextureColor_vert.h同上ccShaderEx_SwitchMask_frag.h//使用不同的采样器对同一个纹理坐标v_texCoord进行采样得到两个颜色texColor maskColor //然后用这两个颜色算出finalColor最后用finalColor和顶点颜色计算出最终的输出颜色 \ #ifdef GL_ES \ precision lowp float; \ #endif \ \ varying vec4 v_fragmentColor; \ varying vec2 v_texCoord; \ uniform sampler2D u_texture; \ uniform sampler2D u_mask; \ \ void main() \ { \ vec4 texColor texture2D(u_texture, v_texCoord); \ vec4 maskColor texture2D(u_mask, v_texCoord); \ vec4 finalColor vec4(texColor.r, texColor.g, texColor.b, maskColor.a * texColor.a); \ gl_FragColor v_fragmentColor * finalColor; \ } \ ;