GLSL圆形碰撞边界无法弹跳问题求助

问题代码 #

#ifdef GL_ES
precision mediump float;
#endif

uniform vec2  u_resolution;
uniform vec2  u_mouse;
uniform float u_time;

vec3 color_bg = vec3(1.0);
vec3 circle_color = vec3(0.0, 0.0, 0.0);

void circle(float radius, vec2 pos, vec2 mouse, vec2 view, float speed) {
    gl_FragColor = vec4(color_bg, 1.0);
    float aspect_ratio = u_resolution.x / u_resolution.y;
    pos.x += u_time * speed;
    float circle_radius = sqrt(pow((view.x * aspect_ratio - pos.x * aspect_ratio), 2.0) + pow((view.y - pos.y), 2.0));   
    if(pos.x + radius >= 1.0 || pos.x - radius <= 0.0) {
        //  Background orange color change for debugging
        gl_FragColor = vec4(vec3(0.9686, 0.5529, 0.298), 1.0);
        speed = -speed;
    }
    if(circle_radius <= radius) {
        gl_FragColor = vec4(circle_color, 1.0);
    }
}

void main() {
    vec2 normalized_view = gl_FragCoord.xy/u_resolution;
    vec2 normalized_mouse = u_mouse.xy/u_resolution;
    vec2 circle_position = vec2(0.5, 0.5);
    float speed = 0.2;
    circle(0.03, circle_position, normalized_mouse, normalized_view, speed);
}

问题描述 #

接触GLSL及图形编程仅数日，编写的GLSL代码中，圆形碰撞边界后无法实现弹跳效果，此前尝试求助ChatGPT但未能解决问题。

硬件环境：MacBook M1 Pro

原因分析 #

• 局部变量作用域限制：circle函数中修改的speed是函数的局部参数，和main函数里定义的speed是两个独立变量。函数内的speed = -speed只会改变当前函数内的副本值，不会影响main中控制位置更新的speed，因此速度方向从未真正反转。
• 位置更新逻辑错误：当前用pos.x += u_time * speed更新位置，是直接基于全局时间的线性累加，而非基于上一帧位置的增量更新。即使速度方向反转，u_time始终递增，位置仍会持续向初始方向移动，无法实现反向运动。而且片段Shader本身没有帧间状态存储能力，每帧都会重新计算，这种基于全局时间的方式无法实现弹跳所需的方向切换逻辑。
• 碰撞后的位置修正缺失：检测到碰撞时，仅修改了局部speed，没有将已经超出边界的圆形位置拉回边界内。这会导致后续帧持续触发碰撞判断，圆形无法正常从边界处反弹并向相反方向移动。

内容的提问来源于stack exchange，提问作者David