OpenGL GLSL fragment shader learning（1）

#ifdef GL_ES
precision mediump float;
#endif

uniform float u_time;

void main() {
	gl_FragColor = vec4(1.0,0.0,1.0,1.0);
}

上面是Hello，world例子，接下来讲解各个部分作用

1.精度

float类型在 shaders 中非常重要，所以精度非常重要。更低的精度会有更快的渲染速度，但是会以质量为代价。你可以选择每一个浮点值的精度。

//设定了所有的浮点值都是中等精度
precision mediump float;
//低精度设定
precision lowp float;
//高精度设定
precision highp float;

2.输出

最终的像素颜色取决于预设的全局变量 gl_FragColor

gl_FragColor = vec4(1.0,0.0,1.0,1.0);

注意在GLSL中vec4 精确到单精度浮点，写成vec4(1,1,1,1)程序将会报错。

3.uniform

所有线程的输入值必须统一（uniform），而且必须设为只读。

这些输入值叫做 uniform ，它们的数据类型通常为：float, vec2, vec3, vec4, mat2, mat3, mat4, sampler2D and samplerCube

//我们一般的使用以下的名字
uniform vec2 u_resolution; // 画布尺寸（宽，高）
uniform vec2 u_mouse;      // 鼠标位置（在屏幕上哪个像素）
uniform float u_time;     // 时间（加载后的秒数）


//当然有些小伙伴使用ShaderToy网站学习的时候可能会看到如下的名字：
uniform vec3 iResolution;   // 视口分辨率（以像素计）,有效值iSolution.x,iSolution.y
uniform vec4 iMouse;        // 鼠标坐标 xy： 当前位置, zw： 点击位置
uniform float iTime;        // shader 运行时间（以秒计）
uniform float iTimeDelta; // 渲染时间，单位秒 
uniform int iFrame; // 渲染帧数

uniform float iChannelTime[4]; // 渲染通道播放时长(in seconds)

uniform vec3 iChannelResolution[4]; //  通道分辨率 (in pixels)

uniform samplerXX iChannel0..3; // input channel. XX = 2D/Cube  4个纹理通道

uniform vec4 iDate; // (year, month, day, time in seconds)

uniform float iSampleRate; // sound sample rate (i.e., 44100)   音频采样率

4.内置函数

三角函数

float radians(float degrees)  
vec2 radians(vec2 degrees)  
vec3 radians(vec3 degrees)  
vec4 radians(vec4 degrees)

弧度函数将度数转换为弧度。输入参数可以是浮点标量或浮点向量。在浮点向量的情况下，所有分量都分别从度数转换为弧度。

float degrees(float radians)  
vec2 degrees(vec2 radians)  
vec3 degrees(vec3 radians)  
vec4 degrees(vec4 radians)

degree函数将弧度转换为度数。输入参数可以是浮点标量或浮点向量。在浮点向量的情况下，每个分量都分别从弧度转换为度数。

float sin(float angle)  
vec2 sin(vec2 angle)  
vec3 sin(vec3 angle)  
vec4 sin(vec4 angle)

sin函数以弧度返回角度的正弦值。输入参数可以是浮点标量或浮点向量。在浮点向量的情况下，为每个分量单独计算正弦。

float cos(float angle)  
vec2 cos(vec2 angle)  
vec3 cos(vec3 angle)  
vec4 cos(vec4 angle)

cos函数以弧度返回角度的余弦值。输入参数可以是浮点标量或浮点向量。在浮点向量的情况下，余弦是为每个分量单独计算的。

float tan(float angle)  
vec2 tan(vec2 angle)  
vec3 tan(vec3 angle)  
vec4 tan(vec4 angle)

tan函数以弧度返回角度的正切。输入参数可以是浮点标量或浮点向量。在浮点向量的情况下，为每个分量分别计算切线。

float asin(float x)  
vec2 asin(vec2 x)  
vec3 asin(vec3 x)  
vec4 asin(vec4 x)

asin函数以弧度返回角度的反正弦值。它是正弦的反函数。输入参数可以是浮点标量或浮点向量。如果是浮点向量，则为每个分量分别计算反正弦值。

float acos(float x)  
vec2 acos(vec2 x)  
vec3 acos(vec3 x)  
vec4 acos(vec4 x)

acos函数以弧度返回角度的反余弦值。它是余弦的反函数。输入参数可以是浮点标量或浮点向量。如果是浮点向量，则为每个分量分别计算反余弦。

float atan(float y_over_x)  
vec2 atan(vec2 y_over_x)  
vec3 atan(vec3 y_over_x)  
vec4 atan(vec4 y_over_x)

atan函数以弧度返回角度的反正切。它是正切的反函数。输入参数可以是浮点标量或浮点向量。在浮点向量的情况下，为每个分量分别计算反正切。

float atan(float y, float x)  
vec2 atan(vec2 y, vec2 x)  
vec3 atan(vec3 y, vec3 x)  
vec4 atan(vec4 y, vec4 x)

atan函数也有两个参数的变体（在其他编程语言中，通常称为 atan2）。对于具有笛卡尔坐标 (x, y) 的点，该函数返回具有极坐标 (r, θ) 的同一点的角度 θ。

---

指数函数

float pow(float x, float y)  
vec2 pow(vec2 x, vec2 y)  
vec3 pow(vec3 x, vec3 y)  
vec4 pow(vec4 x, vec4 y)

幂函数返回 x 的 y 次幂。输入参数可以是浮点标量或浮点向量。在浮点向量的情况下，操作是按组件完成的。

---

指数函数

float exp(float x)  
vec2 exp(vec2 x)  
vec3 exp(vec3 x)  
vec4 exp(vec4 x)

exp函数返回常数 e的x 次幂。输入参数可以是浮点标量或浮点向量。在浮点向量的情况下，操作是按组件完成的。

---

自然对数