默認(rèn)
頂點(diǎn)著色器代碼：
attribute vec4 Position; //頂點(diǎn)坐標(biāo)
attribute vec2 TextureCoords; //紋理坐標(biāo)
varying vec2 TextureCoordsVarying; //傳遞到片元著色器中的紋理坐標(biāo)
void main (void) {
gl_Position = Position;
TextureCoordsVarying = TextureCoords;
}
片元著色器代碼：
precision highp float; //設(shè)置片元著色器的精度
uniform sampler2D Texture; //紋理
varying vec2 TextureCoordsVarying; //紋理坐標(biāo)
void main (void) {
//文素
vec4 mask = texture2D(Texture, TextureCoordsVarying);
gl_FragColor = vec4(mask.rgb, 1.0);
}
二分屏
當(dāng)實(shí)現(xiàn)二分屏濾鏡時(shí)钥组，圖片紋理坐標(biāo)的x值是沒有任何變化的，主要是y值變化
當(dāng) y 在[0, 0.5]范圍時(shí)，屏幕的（0，0）坐標(biāo)需要對(duì)應(yīng)圖片的（0妆毕，0.25），所以y = y+0.25
當(dāng) y 在[0.5, 1]范圍時(shí)贮尖，屏幕的（0笛粘，0.5）坐標(biāo)需要對(duì)應(yīng)圖片的（0，0.25）湿硝，所以y = y-0.25
頂點(diǎn)著色器代碼不變薪前，片元著色器代碼：
precision highp float;
uniform sampler2D Texture;
varying vec2 TextureCoordsVarying;
void main (void) {
vec2 uv = TextureCoordsVarying.xy;
float y;
if (uv.y >= 0.0 && uv.y <= 0.5) {
y = uv.y + 0.25;
} else {
y = uv.y - 0.25;
}
gl_FragColor = texture2D(Texture, vec2(uv.x, y));
}
三分屏
當(dāng)實(shí)現(xiàn)三分屏濾鏡時(shí)，圖片紋理坐標(biāo)的x值是沒有任何變化的关斜，主要是y值變化
當(dāng) y 在[0, 1/3]范圍時(shí)示括，屏幕的（0，0）坐標(biāo)需要對(duì)應(yīng)圖片的（0蚤吹，1/3）例诀，所以y = y+1/3
當(dāng) y 在[1/3, 2/3]范圍時(shí)随抠，屏幕的（0裁着，1/3）坐標(biāo)需要對(duì)應(yīng)圖片的（0繁涂，1/3），所以y 不變
當(dāng) y 在[2/3, 1]范圍時(shí)二驰，屏幕的（0扔罪，2/3）坐標(biāo)需要對(duì)應(yīng)圖片的（0，1/3）桶雀，所以y = y-1/3
頂點(diǎn)著色器代碼不變矿酵，片元著色器代碼：
precision highp float;
uniform sampler2D Texture;
varying highp vec2 TextureCoordsVarying;
void main() {
vec2 uv = TextureCoordsVarying.xy;
if (uv.y < 1.0/3.0) {
uv.y = uv.y + 1.0/3.0;
} else if (uv.y > 2.0/3.0){
uv.y = uv.y - 1.0/3.0;
}
gl_FragColor = texture2D(Texture, uv);
}
四分屏
當(dāng)實(shí)現(xiàn)四分屏?xí)r，紋理坐標(biāo)x矗积、y均需要變化全肮，且屏幕坐標(biāo)需要與紋理坐標(biāo)一一映射，例如（x棘捣，y）取值（0.5辜腺，0.5）需要映射到紋理坐標(biāo)（1，1）時(shí)乍恐，x评疗、y均需要乘以2，即0.5 * 2 = 1茵烈，變化規(guī)則如下：
當(dāng) x 在[0, 0.5]范圍時(shí)百匆，x = x2
當(dāng) x在[0.5, 1]范圍時(shí)，x = (x-0.5)2
當(dāng) y 在[0, 0.5]范圍時(shí)呜投，y = y2
當(dāng) y 在[0.5, 1]范圍時(shí)加匈，y = (y-0.5)2
頂點(diǎn)著色器代碼不變，片元著色器代碼：
precision highp float;
uniform sampler2D Texture;
varying highp vec2 TextureCoordsVarying;
void main() {
vec2 uv = TextureCoordsVarying.xy;
if(uv.x <= 0.5){
uv.x = uv.x * 2.0;
}else{
uv.x = (uv.x - 0.5) * 2.0;
}
if (uv.y<= 0.5) {
uv.y = uv.y * 2.0;
}else{
uv.y = (uv.y - 0.5) * 2.0;
}
gl_FragColor = texture2D(Texture, uv);
}
六分屏
當(dāng)實(shí)現(xiàn)六分屏?xí)r仑荐，紋理坐標(biāo)x雕拼、y均需要變化，其變化規(guī)則如下：
當(dāng) x 在[0, 1/3]范圍時(shí)释漆，x = x+1/3
當(dāng) x 在[1/3, 2/3]范圍時(shí)悲没，x 不變
當(dāng) x 在[2/3, 1]范圍時(shí)，x = x-1/3
當(dāng) y 在[0, 0.5]范圍時(shí)男图，y = y+0.25
當(dāng) y 在[0.5, 1]范圍時(shí)示姿，y = y-0.24
頂點(diǎn)著色器代碼不變，片元著色器代碼：
precision highp float;
uniform sampler2D Texture;
varying highp vec2 TextureCoordsVarying;
void main() {
vec2 uv = TextureCoordsVarying.xy;
if(uv.x <= 1.0 / 3.0){
uv.x = uv.x + 1.0/3.0;
}else if(uv.x >= 2.0/3.0){
uv.x = uv.x - 1.0/3.0;
}
if(uv.y <= 0.5){
uv.y = uv.y + 0.25;
}else {
uv.y = uv.y - 0.25;
}
gl_FragColor = texture2D(Texture, uv);
}
九分屏
當(dāng)實(shí)現(xiàn)九分屏?xí)r逊笆，紋理坐標(biāo)x栈戳、y均需要變化，其變化規(guī)則如下：
當(dāng) x 在[0, 1/3]范圍時(shí)难裆，x = x3
當(dāng) x 在[1/3, 2/3]范圍時(shí)子檀，x = (x-1/3)3
當(dāng) x 在[2/3, 1]范圍時(shí)镊掖，x = (x-2/3)3
當(dāng) y 在[0, 1/3]范圍時(shí)，y= y3
當(dāng) y 在[1/3, 2/3]范圍時(shí)褂痰，y = (y-1/3)3
當(dāng) y在[2/3, 1]范圍時(shí)亩进，y = (y-2/3)3
頂點(diǎn)著色器代碼不變，片元著色器代碼：
precision highp float;
uniform sampler2D Texture;
varying highp vec2 TextureCoordsVarying;
void main() {
vec2 uv = TextureCoordsVarying.xy;
if (uv.x < 1.0 / 3.0) {
uv.x = uv.x * 3.0;
} else if (uv.x < 2.0 / 3.0) {
uv.x = (uv.x - 1.0 / 3.0) * 3.0;
} else {
uv.x = (uv.x - 2.0 / 3.0) * 3.0;
}
if (uv.y <= 1.0 / 3.0) {
uv.y = uv.y * 3.0;
} else if (uv.y < 2.0 / 3.0) {
uv.y = (uv.y - 1.0 / 3.0) * 3.0;
} else {
uv.y = (uv.y - 2.0 / 3.0) * 3.0;
}
gl_FragColor = texture2D(Texture, uv);
}
