OpenGL中如何实现按下't'键时物体颜色的平滑过渡而非直接切换

核心实现逻辑 #

原有代码在按下't'键时直接将预设颜色数组的对应索引值赋值给材质参数，没有中间渲染帧的颜色插值过程，因此会出现生硬的颜色跳转。平滑过渡的核心是在两个相邻目标颜色之间增加逐帧的线性插值计算，通过逐步推进插值进度，模拟颜色渐变的视觉效果。

具体代码修改步骤 #

• 保留原有预设颜色数组定义，新增过渡状态相关全局变量：

// 原有预设颜色数组保持不变
GLfloat diffColors[9][4] = { {0.3, 0.8, 0.9, 1.0},
                             {1, 0, 0, 1},
                             {0, 1, 0, 1},
                             {0, 0, 1, 1},
                             {0.5, 0.5, 0.9, 1},
                             {0.2, 0.5, 0.5, 1},
                             {0.5, 0.5, 0.9, 1},
                             {0.9, 0.5, 0.5, 1},
                             {0.3, 0.8, 0.5, 1} };

// 过渡过程需要的全局状态变量
GLfloat currentColor[4];    // 当前实际渲染使用的颜色值
GLfloat startColor[4];      // 颜色过渡的起始点值
GLfloat targetColor[4];     // 颜色过渡的目标点值
GLfloat transitionProgress = 1.0; // 过渡进度，1代表当前过渡已完成
const GLfloat transitionSpeed = 0.05; // 过渡步长，数值越大切换速度越快
int changeColor = 0;         // 原有颜色索引计数变量

• 在程序初始化位置设置初始颜色值，避免空值导致渲染异常：

memcpy(currentColor, diffColors[0], sizeof(currentColor));
memcpy(startColor, diffColors[0], sizeof(startColor));
memcpy(targetColor, diffColors[0], sizeof(targetColor));

• 修改't'键的按键处理逻辑，不再直接修改渲染用的颜色，而是触发新的过渡流程：

case 't':
        // 将当前正在显示的颜色存为过渡起点
        memcpy(startColor, currentColor, sizeof(currentColor));
        // 更新颜色索引，确定要切换到的目标颜色
        changeColor += 1;
        if(changeColor>8) //Toggling between 9 different colors
            changeColor=0;
        memcpy(targetColor, diffColors[changeColor], sizeof(targetColor));
        // 重置过渡进度，启动插值流程
        transitionProgress = 0.0f;
        break; 

• 在每帧渲染循环中逐帧更新插值结果，替换原有直接取预设数组的材质设置代码：

// 每帧渲染时先检查过渡状态
if(transitionProgress < 1.0f) {
    // 按固定步长推进过渡进度，封顶为1
    transitionProgress += transitionSpeed;
    if(transitionProgress > 1.0f) transitionProgress = 1.0f;
    // 对RGBA四个颜色通道分别做线性插值计算
    for(int channel = 0; channel < 4; channel++) {
        currentColor[channel] = startColor[channel] 
                                + (targetColor[channel] - startColor[channel]) * transitionProgress;
    }
}
// 替换原有直接读取diffColors数组的设置逻辑
glMaterialfv(GL_FRONT_AND_BACK, GL_AMBIENT_AND_DIFFUSE, currentColor);

效果优化提示 #

• 过渡速度适配：transitionSpeed的数值可以根据程序实际帧率调整，比如高帧率下适当调小数值，保证不同硬件上的过渡视觉时长一致。
• 连续按键兼容：如果在过渡未完成时再次按下't'键，代码会自动把当前插值计算出的currentColor作为新的过渡起点，不会出现颜色跳变，支持连续快速切换的流畅衔接。
• 头文件依赖：代码中用到的memcpy内存拷贝函数需要引入<string.h>头文件才能正常编译。
• 动效增强：如需更柔和的过渡效果，可以把线性插值的进度值替换为缓动函数（比如easeInOut曲线），避免过渡过程的速度感过于生硬。

内容的提问来源于stack exchange，提问作者Mahnaz Rafia Islam