猴子原创,欢迎转载。转载请注明: 转载自Cocos2D开发网–Cocos2Dev.com,谢谢!
原文地址: http://www.cocos2dev.com/?p=325
游戏中人物死掉后要把人物头像变成灰白图,很多游戏也是这样处理,问题来了,怎么将CCsprite生成的图变成灰白呢?
看了下实现,基本有了办法。CCSprite是在initWithTexture的时候渲染的贴图,如果在这里面设置一个一个灰度Shader,也许可以将图片改成灰白色。
GL Shader脚本代码:
#ifdef GL_ES
precision mediump
float
;
#endif
uniform sampler2D u_texture;
varying vec2 v_texCoord;
varying vec4 v_fragmentColor;
void
main(
void
)
{
// Convert to greyscale using NTSC weightings
float
alpha = texture2D(u_texture, v_texCoord).a;
float
grey = dot(texture2D(u_texture, v_texCoord).rgb, vec3(0.299, 0.587, 0.114));
gl_FragColor = vec4(grey, grey, grey, alpha);
}
这个主要目的是将RGB值转换为YUV值,Y就是灰度,所以我们取出里面的Y值来实现我们的灰白图。
Google了下,vec3(0.299, 0.587, 0.114) 是RGB转YUV的参数值。
计算完了之后根据原来的纹理alpha值,输出我们处理后的颜色到gl_FragColor,就可以让shader去渲染黑白图。
里面主要是在光栅化后的片段进行颜色处理,最后输出的是像素,它不会产生额外纹理,所以不会卡。
注意:GLSL1.0的可能有些函数不支持,会crash。不过目前基本可以不考虑。
下面就是我写好的类,加入自己的工程就可以了。
头文件
// // BYGraySprite.h // Demo // // Created by Yanghui Liu on 12-11-2. // Copyright (c) 2012年 BoyoJoy. All rights reserved. // #ifndef _BYGraySprite_h #define _BYGraySprite_h #include "cocoa/CCGeometry.h" #include "cocos2d.h" USING_NS_CC; class BYGraySprite : public cocos2d::CCSprite { public: BYGraySprite(); virtual ~BYGraySprite(); static BYGraySprite* create(const char* pszFileName); bool initWithTexture(CCTexture2D* pTexture, const CCRect& tRect); virtual void draw(); }; #endif//_BYGraySprite_h
cpp文件
// // BYGraySprite.cpp // Demo // // Created by Yanghui Liu on 12-11-2. // Copyright (c) 2012年 BoyoJoy. All rights reserved. // #include "BYGraySprite.h" #include "cocoa/CCGeometry.h" BYGraySprite::BYGraySprite() { } BYGraySprite::~BYGraySprite() { } BYGraySprite* BYGraySprite::create( const char* pszFileName ) { BYGraySprite* graySprite = new BYGraySprite; if (graySprite && graySprite->initWithFile(pszFileName)) { graySprite->autorelease(); return graySprite; } else { CC_SAFE_RELEASE(graySprite); return NULL; } } bool BYGraySprite::initWithTexture(CCTexture2D* pTexture, const CCRect& tRect ) { do { CC_BREAK_IF(!CCSprite::initWithTexture(pTexture, tRect)); GLchar* pszFragSource = "#ifdef GL_ES \n \ precision mediump float; \n \ #endif \n \ uniform sampler2D u_texture; \n \ varying vec2 v_texCoord; \n \ varying vec4 v_fragmentColor; \n \ void main(void) \n \ { \n \ // Convert to greyscale using NTSC weightings \n \ vec4 col = texture2D(u_texture, v_texCoord); \n \ float grey = dot(col.rgb, vec3(0.299, 0.587, 0.114)); \n \ gl_FragColor = vec4(grey, grey, grey, col.a); \n \ }"; CCGLProgram* pProgram = new CCGLProgram(); pProgram->initWithVertexShaderByteArray(ccPositionTextureColor_vert, pszFragSource); this->setShaderProgram(pProgram); pProgram->release(); CHECK_GL_ERROR_DEBUG(); this->getShaderProgram()->addAttribute(kCCAttributeNamePosition, kCCVertexAttrib_Position); this->getShaderProgram()->addAttribute(kCCAttributeNameColor, kCCVertexAttrib_Color); this->getShaderProgram()->addAttribute(kCCAttributeNameTexCoord, kCCVertexAttrib_TexCoords); CHECK_GL_ERROR_DEBUG(); this->getShaderProgram()->link(); CHECK_GL_ERROR_DEBUG(); this->getShaderProgram()->updateUniforms(); CHECK_GL_ERROR_DEBUG(); return true; } while (0); return false; } void BYGraySprite::draw() { ccGLEnableVertexAttribs(kCCVertexAttribFlag_PosColorTex ); ccGLBlendFunc( m_sBlendFunc.src, m_sBlendFunc.dst ); this->getShaderProgram()->use(); this->getShaderProgram()->setUniformsForBuiltins();// this->getShaderProgram()->setUniformForModelViewProjectionMatrix(); ccGLBindTexture2D( this->getTexture()->getName() ); #define kQuadSize sizeof(m_sQuad.bl) long offset = (long)&m_sQuad; // vertex int diff = offsetof( ccV3F_C4B_T2F, vertices); glVertexAttribPointer(kCCVertexAttrib_Position, 3, GL_FLOAT, GL_FALSE, kQuadSize, (void*) (offset + diff)); // texCoods diff = offsetof( ccV3F_C4B_T2F, texCoords); glVertexAttribPointer(kCCVertexAttrib_TexCoords, 2, GL_FLOAT, GL_FALSE, kQuadSize, (void*)(offset + diff)); // color diff = offsetof( ccV3F_C4B_T2F, colors); glVertexAttribPointer(kCCVertexAttrib_Color, 4, GL_UNSIGNED_BYTE, GL_TRUE, kQuadSize, (void*)(offset + diff)); glDrawArrays(GL_TRIANGLE_STRIP, 0, 4); CC_INCREMENT_GL_DRAWS(1); }
使用方法:
BYGraySprite* graySprite = BYGraySprite::create("Icon.png"); graySprite->setPosition( ccp(size.width/2, size.height/2) ); this->addChild(graySprite);
float grey = dot(texture2D(u_texture, v_texCoord).rgb, vec3(0.299, 0.587, 0.114)); \n \
gl_FragColor = vec4(grey, grey, grey, 1.0); \n \
改成:
vec4 col = texture2D(u_texture, v_texCoord); \n \
float grey = dot(col.rgb, vec3(0.299, 0.587, 0.114)); \n \
gl_FragColor = vec4(grey, grey, grey, col.a); \n \