cocos creator 2.x shader
2019-12-27 本文已影响0人
千罹
示例文件
// Copyright (c) 2017-2018 Xiamen Yaji Software Co., Ltd.
CCEffect %{
techniques:
- passes:
- vert: vs
frag: fs
blendState:
targets:
- blend: true
rasterizerState:
cullMode: none
properties:
texture: { value: white }
}%
// 顶点着色器，对应上main声明的名字 vs
CCProgram vs %{
// lowp 低等精度（low pixel）
// mediump 中等精度（medium pixel）
// highp 高等精度（high pixel）
precision highp float;
// 统一值（shader playground 内置的变量（见附录），非cocos 内置变量，不能直接使用）
// uniform vec2 u_resolution; // 画布尺寸（宽，高）
// uniform vec2 u_mouse; // 鼠标位置（在屏幕上哪个像素）
// uniform float u_time; // 时间（加载后的秒数）
// 下面说明
#include <cc-global>
// 下面说明
#include <cc-local>
in vec3 a_position;
in vec4 a_color;
out vec4 v_color;
in vec2 a_uv0;
out vec2 v_uv0;
void main () {
vec4 pos = vec4(a_position, 1);
#if CC_USE_MODEL
pos = cc_matViewProj * cc_matWorld * pos;
#else
pos = cc_matViewProj * pos;
#endif
v_uv0 = a_uv0;
v_color = a_color;
gl_Position = pos; // gl_ 开头的变量都是 openGL 的内置变量，自己的变量不要用 gl_ 开头
}
}%
// 片段（片元）着色器，对应最上面声明的名字 fs
CCProgram fs %{
precision highp float;
// 下面说明
#include <cc-global>
in vec4 v_color;
in vec2 v_uv0;
uniform sampler2D texture;
// uniform PROPERTIES{ vec4 color; float factor; float width; float u_time; }
void main () {
vec4 c = texture2D(texture, v_uv0);
float clrbright = (c.r + c.g + c.b) * (1. / 3.);
float gray = (0.6) * clrbright;
float d = sin(cc_time.x); // 使用 cc-global 中的内置变量 cc_time.x
gl_FragColor = vec4(c.r * d, c.g, c.b, c.a); // gl_ 开头的变量都是 openGL 的内置变量，自己的变量不要用 gl_ 开头
}
}%
说明
#include <cc-global>
#include <cc-local>
cc-global
是内置的全局变量包，包含以下变量（常用的时间等）
#pragma builtin(global)
uniform CCGlobal {
vec4 cc_time; // x
vec4 cc_screenSize; // xy zw
vec4 cc_screenScale; //
vec4 cc_nativeSize; //
mat4 cc_matView;
mat4 cc_matViewInv;
mat4 cc_matProj;
mat4 cc_matProjInv;
mat4 cc_matViewProj;
mat4 cc_matViewProjInv;
vec4 cc_cameraPos; // xyz
vec4 cc_exposure; // x: exp, y: expInv, w: expScale
vec4 cc_mainLitDir; // xyz
vec4 cc_mainLitColor; // xyz: color, w: intensity
vec4 cc_ambientSky;
vec4 cc_ambientGround;
};
- 因为uniform 每个「插槽」能够存储一个四元数。
- cc_time 应该只有第一位放了时间，也就是 [x,y,z,w] 里的 x。
- 下面其它变量同理。
cc-local
#pragma builtin(local)
uniform CCLocal {
mat4 cc_matWorld;
mat4 cc_matWorldIT;
};
其他包和常用方法
|-- 点我去 cocos creator 源码 -->>>
常见问题
1. 精度问题
1 != 1.
0.1 == .1
1 是整数
1. 是 1.0 即浮点数
openGL 不会进行强制类型转换，需要书写的时候确定变量类型
eg:
gl_FragColor = vec4(1, 1, 1, 1); // 错误
gl_FragColor = vec4(1., 1., 1., 1.); // 正确
gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0); // 正确
