精灵图怎么做高亮效果

Creator 2.x
#1

求助，想要给精灵图加上高亮效果，要怎么弄？？？

#2

让你家美术高亮

#4

让你家美术做个高亮动画 在你想要高亮的时候 覆盖在上个节点直接播放

#5

因为需要动态控制，只能用程序做这个高亮的动作了

#6

程序现在没办法直接在精灵图上做高亮么(╥╯^╰╥)

#7

把其他图片调暗

#8

着色器

#9

是cc.color么

#10

写个高亮shader作为脚本挂在精灵上,加个开关控制开关

#12

直接调node颜色就好了啊。。。

#13

1.一定要程序实现那就是自己定义shader了!我记得高亮就是对rgb 颜色值乘以一个相同的倍数即可!
2.不过你用了shader的话如果是那个节点有button组件的话 点击按钮之后可能会让自定义shader失效。在button组件源码里点击后会把shader恢复成了默认的

#14

rgb 颜色是不能直接调节亮度的,最好先把颜色转化为hsl颜色体系,这样就可以直观的调节明度,送一段shader,效率有待优化

var _vert = `
attribute vec4 a_position;
 attribute vec2 a_texCoord;
 attribute vec4 a_color;
 varying vec2 v_texCoord;
 varying vec4 v_fragmentColor;
 void main()
 {
     gl_Position = CC_PMatrix  * a_position;
     v_fragmentColor = a_color;
     v_texCoord = a_texCoord;
 }
`;

var _frag = `
#ifdef GL_ES  
precision mediump float;  
#endif  
  
varying vec2 v_texCoord;  
uniform float u_dH;  
uniform float u_dS;  
uniform float u_dL;  
  
void main() {  

    vec4 texColor=texture2D(CC_Texture0, v_texCoord).rgba;
    float r=texColor.r;
    float g=texColor.g;
    float b=texColor.b;
    float a=texColor.a;
    float h;  
    float s;  
    float l;  
    {  
        float max=max(max(r,g),b);  
        float min=min(min(r,g),b);  

        if(max==min){  
  
            h=0.0;  
        }else if(max==r&&g>=b){  
            h=60.0*(g-b)/(max-min)+0.0;  
        }else if(max==r&&g<b){  
            h=60.0*(g-b)/(max-min)+360.0;  
        }else if(max==g){  
            h=60.0*(b-r)/(max-min)+120.0;  
        }else if(max==b){  
            h=60.0*(r-g)/(max-min)+240.0;  
        }  

        l=0.5*(max+min);  

        if(l==0.0||max==min){  
            s=0.0;  
        }else if(0.0<=l&&l<=0.5){  
            s=(max-min)/(2.0*l);  
        }else if(l>0.5){  
            s=(max-min)/(2.0-2.0*l);  
        }  
    }  

    h=h+u_dH;  
    s=min(1.0,max(0.0,s+u_dS));  


    vec4 finalColor;  
    {  
        float q;  
        if(l<0.5){  
            q=l*(1.0+s);  
        }else if(l>=0.5){  
            q=l+s-l*s;  
        }  
        float p=2.0*l-q;  
        float hk=h/360.0;  
        float t[3];  
        t[0]=hk+1.0/3.0;t[1]=hk;t[2]=hk-1.0/3.0;  
        for(int i=0;i<3;i++){  
            if(t[i]<0.0)t[i]+=1.0;  
            if(t[i]>1.0)t[i]-=1.0;  
        }
        float c[3];  
        for(int i=0;i<3;i++){  
            if(t[i]<1.0/6.0){  
                c[i]=p+((q-p)*6.0*t[i]);  
            }else if(1.0/6.0<=t[i]&&t[i]<0.5){  
                c[i]=q;  
            }else if(0.5<=t[i]&&t[i]<2.0/3.0){  
                c[i]=p+((q-p)*6.0*(2.0/3.0-t[i]));  
            }else{  
                c[i]=p;  
            }  
        }  
        finalColor=vec4(c[0],c[1],c[2],a);  
    }  
  
    finalColor+=vec4(u_dL,u_dL,u_dL,0.0);  
  
    gl_FragColor=finalColor;  
  
}  
`
1赞
#15

嗯嗯，蟹蟹啦，我回去试试

#16

蟹蟹~~