在OpenGL中自定义页面卷曲着色器

在OpenGL中自定义页面卷曲着色器,opengl,shader,page-curl,Opengl,Shader,Page Curl,我目前正在设计一个片段着色器,它将显示一个页面卷曲效果,作为两个图像之间的过渡。所以我在网上查了一下,找到了我想要的代码: varying vec2 texCoord; uniform sampler2D sourceTex; uniform sampler2D targetTex; uniform float time; // Ranges from 0.0 to 1.0 const float MIN_AMOUNT = -0.16; const float MAX_AMOUNT = 1.3

我目前正在设计一个片段着色器,它将显示一个页面卷曲效果,作为两个图像之间的过渡。所以我在网上查了一下,找到了我想要的代码:

varying vec2 texCoord;
uniform sampler2D sourceTex;
uniform sampler2D targetTex;
uniform float time; // Ranges from 0.0 to 1.0

const float MIN_AMOUNT = -0.16;
const float MAX_AMOUNT = 1.3;
float amount = time * (MAX_AMOUNT - MIN_AMOUNT) + MIN_AMOUNT;

const float PI = 3.141592653589793;

const float scale = 512.0;
const float sharpness = 3.0;

float cylinderCenter = amount;
// 360 degrees * amount
float cylinderAngle = 2.0 * PI * amount;

const float cylinderRadius = 1.0 / PI / 2.0;

vec3 hitPoint(float hitAngle, float yc, vec3 point, mat3 rrotation) {
    float hitPoint = hitAngle / (2.0 * PI);
    point.y = hitPoint;
    return rrotation * point;
}


vec4 antiAlias(vec4 color1, vec4 color2, float distance) {
    distance *= scale;
    if (distance < 0.0) return color2;
    if (distance > 2.0) return color1;
    float dd = pow(1.0 - distance / 2.0, sharpness);
    return ((color2 - color1) * dd) + color1;
}

float distanceToEdge(vec3 point) {
    float dx = abs(point.x > 0.5 ? 1.0 - point.x : point.x);
    float dy = abs(point.y > 0.5 ? 1.0 - point.y : point.y);
    if (point.x < 0.0) dx = -point.x;
    if (point.x > 1.0) dx = point.x - 1.0;
    if (point.y < 0.0) dy = -point.y;
    if (point.y > 1.0) dy = point.y - 1.0;
    if ((point.x < 0.0 || point.x > 1.0) && (point.y < 0.0 || point.y > 1.0)) return sqrt(dx * dx + dy * dy);
    return min(dx, dy);
}

vec4 seeThrough(float yc, vec2 p, mat3 rotation, mat3 rrotation) {
    float hitAngle = PI - (acos(yc / cylinderRadius) - cylinderAngle);
    vec3 point = hitPoint(hitAngle, yc, rotation * vec3(p, 1.0), rrotation);

    if (yc <= 0.0 && (point.x < 0.0 || point.y < 0.0 || point.x > 1.0 || point.y > 1.0)) {
        return texture2D(targetTex, texCoord);
    }

    if (yc > 0.0) return texture2D(sourceTex, p);

    vec4 color = texture2D(sourceTex, point.xy);
    vec4 tcolor = vec4(0.0);

    return antiAlias(color, tcolor, distanceToEdge(point));
}

vec4 seeThroughWithShadow(float yc, vec2 p, vec3 point, mat3 rotation, mat3 rrotation) {
    float shadow = distanceToEdge(point) * 30.0;
    shadow = (1.0 - shadow) / 3.0;
    if (shadow < 0.0) shadow = 0.0;
    else shadow *= amount;

    vec4 shadowColor = seeThrough(yc, p, rotation, rrotation);
    shadowColor.r -= shadow;
    shadowColor.g -= shadow;
    shadowColor.b -= shadow;
    return shadowColor;
}

vec4 backside(float yc, vec3 point) {
    vec4 color = texture2D(sourceTex, point.xy);
    float gray = (color.r + color.b + color.g) / 15.0;
    gray += (8.0 / 10.0) * (pow(1.0 - abs(yc / cylinderRadius), 2.0 / 10.0) / 2.0 + (5.0 / 10.0));
    color.rgb = vec3(gray);
    return color;
}

vec4 behindSurface(float yc, vec3 point, mat3 rrotation) {
    float shado = (1.0 - ((-cylinderRadius - yc) / amount * 7.0)) / 6.0;
    shado *= 1.0 - abs(point.x - 0.5);

    yc = (-cylinderRadius - cylinderRadius - yc);

    float hitAngle = (acos(yc / cylinderRadius) + cylinderAngle) - PI;
    point = hitPoint(hitAngle, yc, point, rrotation);

    if (yc < 0.0 && point.x >= 0.0 && point.y >= 0.0 && point.x <= 1.0 && point.y <= 1.0 && (hitAngle < PI || amount > 0.5)){
        shado = 1.0 - (sqrt(pow(point.x - 0.5, 2.0) + pow(point.y - 0.5, 2.0)) / (71.0 / 100.0));
        shado *= pow(-yc / cylinderRadius, 3.0);
        shado *= 0.5;
    } else
        shado = 0.0;

    return vec4(texture2D(targetTex, texCoord).rgb - shado, 1.0);
}

void main(void) {
    const float angle = 30.0 * PI / 180.0;
    float c = cos(-angle);
    float s = sin(-angle);

    mat3 rotation = mat3(
        c, s, 0,
        -s, c, 0,
        0.12, 0.258, 1
    );

    c = cos(angle);
    s = sin(angle);

    mat3 rrotation = mat3(
        c, s, 0,
        -s, c, 0,
        0.15, -0.5, 1
    );

    vec3 point = rotation * vec3(texCoord, 1.0);

    float yc = point.y - cylinderCenter;

    if (yc < -cylinderRadius) {
        // Behind surface
        gl_FragColor = behindSurface(yc, point, rrotation);
        return;
    }

    if (yc > cylinderRadius) {
        // Flat surface
        gl_FragColor = texture2D(sourceTex, texCoord);
        return;
    }

    float hitAngle = (acos(yc / cylinderRadius) + cylinderAngle) - PI;

    float hitAngleMod = mod(hitAngle, 2.0 * PI);
    if ((hitAngleMod > PI && amount < 0.5) || (hitAngleMod > PI/2.0 && amount < 0.0)) {
        gl_FragColor = seeThrough(yc, texCoord, rotation, rrotation);
        return;
    }

    point = hitPoint(hitAngle, yc, point, rrotation);

    if (point.x < 0.0 || point.y < 0.0 || point.x > 1.0 || point.y > 1.0) {
        gl_FragColor = seeThroughWithShadow(yc, texCoord, point, rotation, rrotation);
        return;
    }

    vec4 color = backside(yc, point);

    vec4 otherColor;
    if (yc < 0.0) {
        float shado = 1.0 - (sqrt(pow(point.x - 0.5, 2.0) + pow(point.y - 0.5, 2.0)) / 0.71);
        shado *= pow(-yc / cylinderRadius, 3.0);
        shado *= 0.5;
        otherColor = vec4(0.0, 0.0, 0.0, shado);
    } else {
        otherColor = texture2D(sourceTex, texCoord);
    }

    color = antiAlias(color, otherColor, cylinderRadius - abs(yc));

    vec4 cl = seeThroughWithShadow(yc, texCoord, point, rotation, rrotation);
    float dist = distanceToEdge(point);

    gl_FragColor = antiAlias(color, cl, dist);
}
可变vec2 texCoord;
均匀取样器;
均匀采样2D targetTex;
均匀浮动时间;//范围从0.0到1.0
常量浮动最小值=-0.16;
常量浮动最大值=1.3;
浮动金额=时间*(最大金额-最小金额)+最小金额;
常量浮点PI=3.141592653589793;
常量浮点标度=512.0;
常数浮点锐度=3.0;
浮动油缸中心=数量;
//360度*数量
浮动油缸角度=2.0*PI*数量;
常量浮动油缸半径=1.0/PI/2.0;
vec3命中点(浮动命中角、浮动yc、vec3命中点、mat3错误){
浮动命中点=命中角/(2.0*PI);
点y=生命点;
返回错误*点;
}
vec4抗锯齿(vec4 color1、vec4 color2、浮点距离){
距离*=刻度;
如果(距离<0.0)返回颜色2;
如果(距离>2.0)返回颜色1;
浮动dd=功率(1.0-距离/2.0,锐度);
返回((color2-color1)*dd)+color1;
}
浮动距离到边缘(vec3点){
浮动dx=abs(点x>0.5?1.0-点x:点x);
浮动dy=绝对值(点y>0.5?1.0-点y:点y);
如果(点x<0.0)dx=-点x;
如果(点x>1.0)dx=点x-1.0;
如果(点y<0.0)dy=-点y;
如果(点y>1.0)dy=点y-1.0;
if((点x<0.0 |点x>1.0)和&(点y<0.0 |点y>1.0))返回sqrt(dx*dx+dy*dy);
返回最小值(dx,dy);
}
vec4透视(浮动yc、vec2 p、mat3旋转、mat3旋转){
浮动hitAngle=PI-(acos(yc/气缸半径)-气缸角度);
vec3点=命中点(命中角,yc,旋转*vec3(p,1.0),旋转);
如果(yc 1.0 | |点y>1.0)){
返回纹理2D(targetTex,texCoord);
}
如果(yc>0.0)返回纹理2d(sourceTex,p);
vec4 color=texture2D(sourceTex,point.xy);
vec4 tcolor=vec4(0.0);
返回反别名(颜色、t颜色、距离边缘(点));
}
带阴影的vec4透视(浮动yc、vec2 p、vec3点、mat3旋转、mat3旋转){
浮动阴影=距离边缘(点)*30.0;
影子=(1.0-影子)/3.0;
如果(阴影<0.0)阴影=0.0;
else shadow*=金额;
vec4阴影颜色=透视(yc、p、旋转、旋转);
shadowColor.r-=阴影;
shadowColor.g-=阴影;
shadowColor.b-=阴影;
返回阴影颜色;
}
vec4背面(浮动yc,vec3点){
vec4 color=texture2D(sourceTex,point.xy);
浮动灰色=(color.r+color.b+color.g)/15.0;
灰色+=(8.0/10.0)*(功率(1.0-abs(yc/圆柱半径),2.0/10.0)/2.0+(5.0/10.0));
color.rgb=vec3(灰色);
返回颜色;
}
vec4背面(浮动yc、vec3点、mat3腐蚀){
浮动着色器=(1.0-(-cylinderRadius-yc)/数量*7.0))/6.0;
shado*=1.0-abs(点x-0.5);
yc=(-cylinderRadius-cylinderRadius-yc);
浮动命中角=(acos(yc/气缸半径)+气缸角度)-PI;
点=命中点(命中角度、yc、点、错误);
如果(yc<0.0&&point.x>=0.0&&point.y>=0.0&&point.x圆柱体半径){
//平面
gl_FragColor=纹理2D(sourceTex,texCoord);
返回;
}
浮动命中角=(acos(yc/气缸半径)+气缸角度)-PI;
浮动hitAngleMod=mod(hitAngle,2.0*PI);
如果((hitAngleMod>PI和金额<0.5)| |(hitAngleMod>PI/2.0和金额<0.0)){
gl_FragColor=透视(yc、texCoord、旋转、旋转);
返回;
}
点=命中点(命中角度、yc、点、错误);
如果(点x<0.0 | |点y<0.0 | |点x>1.0 | |点y>1.0){
gl_FragColor=带阴影的透视图(yc、texCoord、点、旋转、旋转);
返回;
}
vec4颜色=背面(yc,点);
vec4其他颜色;
如果(yc<0.0){
浮点shado=1.0-(sqrt(功率(点x-0.5,2.0)+功率(点y-0.5,2.0))/0.71;
shado*=功率(-yc/圆柱半径,3.0);
沙多*=0.5;
otherColor=vec4(0.0,0.0,0.0,shado);
}否则{
otherColor=texture2D(sourceTex,texCoord);
}
颜色=抗锯齿(颜色、其他颜色、圆柱体半径-abs(yc));
vec4 cl=带阴影的透视图(yc、texCoord、点、旋转、旋转);
浮动距离=距离边缘(点);
gl_FragColor=抗锯齿(颜色、cl、距离);
}

我只是想修改旋度的角度,但似乎有太多的依赖项不是动态生成的,有人知道它背后的数学知识足以帮助我吗,或者知道甚至可以使用更好的代码示例吗?

主函数中的角度如何?我猜你的意思是
常量float angle=30.0*PI/180.0对吗?正如我所说的,有很多依赖项,如果你只是把30.0改成60.0,整个效果就乱七八糟了