色调偏移着色器打破alpha

时间:2015-12-31 04:52:37

标签: opengl opengl-es cocos2d-x shader

我正在使用cocos2dx。我有一个使用这样的自定义着色器设置的Sprite:

boss_1 = Sprite::createWithSpriteFrameName("Zombies/normal/0_0_0.png");
boss_1->setPosition(boss_1->getContentSize()/2.0f);
boss_1->setBlendFunc(cocos2d::BlendFunc::ALPHA_NON_PREMULTIPLIED);
boss_1->setGLProgramState(boss_1_state);

我有以下着色器:

vec3 hueAdjust(vec3 color, float hueAdjust)
{
    const vec3  kRGBToYPrime = vec3 (0.299, 0.587, 0.114);
    const vec3  kRGBToI     = vec3 (0.596, -0.275, -0.321);
    const vec3  kRGBToQ     = vec3 (0.212, -0.523, 0.311);

    const vec3  kYIQToR   = vec3 (1.0, 0.956, 0.621);
    const vec3  kYIQToG   = vec3 (1.0, -0.272, -0.647);
    const vec3  kYIQToB   = vec3 (1.0, -1.107, 1.704);

    // Convert to YIQ
    float   YPrime  = dot (color, kRGBToYPrime);
    float   I      = dot (color, kRGBToI);
    float   Q      = dot (color, kRGBToQ);

    // Calculate the hue and chroma
    float   hue     = atan (Q, I);
    float   chroma  = sqrt (I * I + Q * Q);

    // Make the user's adjustments
    hue += hueAdjust;

    // Convert back to YIQ
    Q = chroma * sin (hue);
    I = chroma * cos (hue);

    // Convert back to RGB
    vec3    yIQ   = vec3 (YPrime, I, Q);
    color.r = dot (yIQ, kYIQToR);
    color.g = dot (yIQ, kYIQToG);
    color.b = dot (yIQ, kYIQToB);

    // Save the result
    return color;
}

void main()
{
    vec4 v_orColor = v_fragmentColor * texture2D(CC_Texture0, v_texCoord);

    // Hue

    vec3 hueAdjustedColor = hueAdjust(v_orColor.rgb, hue_value);

    gl_FragColor = vec4(hueAdjustedColor, v_orColor.a);
}

但是alpha似乎迷失了,精灵用黑色背景渲染。 (虽然色调偏移效果很好,因为我可以用滑块测试它)

这只发生在hueAdjust函数中。如果我使用这个其他功能来改变对比度/饱和度/亮度,那么alpha将被完美保留:

vec3 ContrastSaturationBrightness(vec3 color, float brt, float sat, float con)
{
    // Increase or decrease these values to adjust r, g and b color channels seperately
    const float AvgLumR = 0.5;
    const float AvgLumG = 0.5;
    const float AvgLumB = 0.5;

    const vec3 LumCoeff = vec3(0.2125, 0.7154, 0.0721);

    vec3 AvgLumin = vec3(AvgLumR, AvgLumG, AvgLumB);
    vec3 brtColor = color * brt;
    vec3 intensity = vec3(dot(brtColor, LumCoeff));
    vec3 satColor = mix(intensity, brtColor, sat);
    vec3 conColor = mix(AvgLumin, satColor, con);
    return conColor;
}

1 个答案:

答案 0 :(得分:1)

似乎hueAdjust中的算法输出负颜色或NaN ...

我通过更换这一行来实现它:

vec3 hueAdjustedColor = hueAdjust(v_orColor.rgb, hue_value);

这一个:

vec3 hueAdjustedColor = max(hueAdjust(v_orColor.rgb, hue_value), 0.0);

BTW,算法似乎过于复杂。为什么要转换像RGB这样的颜色 - > YIQ - > HSV - > YIQ - > RGB?您可以直接将RGB转换为HSV,反之亦然,无需中间YIQ阶段。以下是快速无分支算法:http://revolution.themepunch.com/wordpress-instagram-gallery/

希望,这有助于:)