什么是着色器？
在计算机图形学领域，着色器(Shader) 是一种特殊类型的计算机程序，最初用于做阴影，在图像中产生适当的光照、明暗，现在主要用于产生特殊效果，也用于视频后期处理。（维基百科）
Cocos2dx中的Shader
Cocos2d-x 使用的着色器语言是 OpenGL ES Shading Language v1.0，描述 GLSL 语言不在本文的范围之内。想了解更多，请参考 规范文档。在 Cocos2d-x 中，所有的可渲染的 Node 对象都使用着色器。比如，Sprite 对象使用为 2D 精灵优化过的着色器，Sprite3D 使用为 3D 对象优化过的着色器。
cocos2dx引擎为我们提供了一些常用的shader,在frameworks\cocos2d-x\cocos\renderer目录下。
自定义Shader
为cocos2dx节点设置自定义shader：
1
| sprite:setGLProgramState(programState)
|
在programState中包含两部分：顶点(vert)着色器和片源(frag)着色器。可以通过shader名称进行加载，也可以直接在lua中进行编写然后加载。
1
2
3
4
5
6
|
local programState = cc.GLProgramState:getOrCreateWithGLProgramName(shaderName)
local glProgram = cc.GLProgram:createWithByteArrays(vert, frag)
local programState = cc.GLProgramState:getOrCreateWithGLProgram(glProgram)
|
看看顶点/片源着色器的结构
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
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;
}
#ifdef GL_ES
precision lowp float;
#endif
varying vec4 v_fragmentColor;
varying vec2 v_texCoord;
void main()
{
vec4 p = texture2D(CC_Texture0, v_texCoord);
gl_FragColor = v_fragmentColor * p;
}
|
参考
着色器和材质
Cocos2d-lua 初识shader之一：置灰
