手头上有很多人物行走图,技能特效图等,但这些图都有个纯黑色背景,怎么样将内容显示出来,让背景透明呢?前段时间搞了一下,感谢群里的童鞋们,提供了思路和方法。@H_404_2@
@H_404_2@
这里用shader处理了像素,使黑色背景透明,直接上代码@H_404_2@
ShaderSprite.h@H_404_2@
#ifndef __TestShader__ShaderSprite__@H_404_2@
#define@H_404_2@ __TestShader__ShaderSprite__@H_404_2@
#include "cocos2d.h"@H_404_2@
USING_NS_CC;
class@H_404_2@ ShaderSprite : public@H_404_2@ CCSprite {
public@H_404_2@:
static@H_404_2@ ShaderSprite* create(const@H_404_2@ char@H_404_2@* pszFileName);
virtual@H_404_2@ bool@H_404_2@ initWithTexture(CCTexture2D *pTexture,const@H_404_2@ CCRect& rect);
void@H_404_2@ draw(void@H_404_2@);
};
endif@H_404_2@ /* defined(__TestShader__ShaderSprite__) */@H_404_2@@H_404_2@
ShaderSprite.cpp@H_404_2@@H_404_2@
#include "ShaderSprite.h"@H_404_2@
static@H_404_2@ CC_DLL const@H_404_2@ GLchar *transparentshader =
#include "tansparentshader.h"@H_404_2@
ShaderSprite* ShaderSprite::create(char@H_404_2@ *pszFileName)
{
ShaderSprite *pRet = new@H_404_2@ ShaderSprite();
if@H_404_2@ (pRet && pRet->initWithFile(pszFileName)) {
pRet->autorelease();
return@H_404_2@ pRet;
}
else@H_404_2@
{
delete pRet;
pRet = NULL;
return@H_404_2@ NULL;
}
}
bool@H_404_2@ ShaderSprite::initWithTexture(CCTexture2D *pTexture,51); font-weight:bold">const@H_404_2@ CCRect& rect)
{
do@H_404_2@{
// CCLog("override initWithTexture!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!");@H_404_2@
CC_BREAK_IF(!CCSprite::initWithTexture(pTexture,rect));
// 加载顶点着色器和片元着色器@H_404_2@
m_pShaderProgram = new@H_404_2@ CCGLProgram();
m_pShaderProgram ->initWithVertexShaderByteArray(ccPositionTextureA8Color_vert,transparentshader);
CHECK_GL_ERROR_DEBUG();
// 启用顶点着色器的attribute变量,坐标、纹理坐标、颜色@H_404_2@
m_pShaderProgram->addAttribute(kCCAttributeNamePosition,kCCVertexAttrib_Position);
m_pShaderProgram->addAttribute(kCCAttributeNameColor,kCCVertexAttrib_Color);
m_pShaderProgram->addAttribute(kCCAttributeNameTexCoord,kCCVertexAttrib_TexCoords);
CHECK_GL_ERROR_DEBUG();
// 自定义着色器链接@H_404_2@
m_pShaderProgram->link();
CHECK_GL_ERROR_DEBUG();
// 设置移动、缩放、旋转矩阵@H_404_2@
m_pShaderProgram->updateUniforms();
CHECK_GL_ERROR_DEBUG();
return@H_404_2@ true@H_404_2@;
}while@H_404_2@(0@H_404_2@);
false@H_404_2@;
}
void@H_404_2@ ShaderSprite::draw(void@H_404_2@)
{
// CCLog("override draw!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!");@H_404_2@
CC_PROFILER_START_CATEGORY(kCCProfilerCategorySprite,"CCSprite - draw"@H_404_2@);
CCAssert(!m_pobBatchNode,68)">"If CCSprite is being rendered by CCSpriteBatchNode,CCSprite#draw SHOULD NOT be called"@H_404_2@);
CC_NODE_DRAW_SETUP();
//@H_404_2@
// 启用attributes变量输入,顶点坐标,纹理坐标,颜色@H_404_2@
//@H_404_2@
ccGLEnableVertexAttribs( kCCVertexAttribFlag_PosColorTex );
ccGLBlendFunc(m_sBlendFunc.src,m_sBlendFunc.dst);
m_pShaderProgram->use();
m_pShaderProgram->setUniformsForBuiltins();
// 绑定纹理到纹理槽0@H_404_2@
ccGLBindTexture2D(m_pobTexture->getName());
define@H_404_2@ kQuadSize sizeof(m_sQuad.bl)@H_404_2@
long@H_404_2@ offset = (long@H_404_2@)&m_sQuad;
// vertex@H_404_2@
int@H_404_2@ diff = offsetof( ccV3F_C4B_T2F,vertices);
glVertexAttribPointer(kCCVertexAttrib_Position,3@H_404_2@,GL_FLOAT,GL_FALSE,kQuadSize,(void@H_404_2@*) (offset + diff));
// texCoods@H_404_2@
diff = offsetof( ccV3F_C4B_T2F,texCoords);
glVertexAttribPointer(kCCVertexAttrib_TexCoords,153)">2@H_404_2@,51); font-weight:bold">void@H_404_2@*)(offset + diff));
// color@H_404_2@
diff = offsetof( ccV3F_C4B_T2F,colors);
glVertexAttribPointer(kCCVertexAttrib_Color,153)">4@H_404_2@,GL_UNSIGNED_BYTE,GL_TRUE,51); font-weight:bold">void@H_404_2@*)(offset + diff));
glDrawArrays(GL_TRIANGLE_STRIP,153)">0@H_404_2@,153)">4@H_404_2@);
CHECK_GL_ERROR_DEBUG();
CC_INCREMENT_GL_DRAWS(1@H_404_2@);
CC_PROFILER_STOP_CATEGORY(kCCProfilerCategorySprite,68)">"CCSprite - draw"@H_404_2@);
}@H_404_2@
tansparentshader.h@H_404_2@
" \n\ #ifdef GL_ES \n\ precision lowp float; \n\ #endif \n\ varying vec4 v_fragmentColor; \n\ varying vec2 v_texCoord; \n\ uniform sampler2D u_texture; \n\ void main() \n\ { \n\ float ratio=0.0; \n\ vec4 texColor = texture2D(u_texture,v_texCoord); \n\ ratio = texColor[0] > texColor[1]?(texColor[0] > texColor[2] ? texColor[0] : texColor[2]) :(texColor[1] > texColor[2]? texColor[1] : texColor[2]); \n\ if (ratio != 0.0) \n\ { \n\ texColor[0] = texColor[0] / ratio; \n\ texColor[1] = texColor[1] / ratio; \n\ texColor[2] = texColor[2] / ratio; \n\ texColor[3] = ratio; \n\ } \n\ else \n\ { \n\ texColor[3] = 0.0; \n\ } \n\ gl_FragColor = v_fragmentColor*texColor@H_404_2@; \n\ }"@H_404_2@;@H_404_2@
注意shader编程没有隐士数据类型转换,所以都显示为float了。@H_404_2@@H_404_2@
然后ratio是指在rgb中找最大的,如果ratio为0直接将alpha设为0,否则alpha设为ratio,然后各rgb除以ratio,这里是为了做渐变,否则变化太生硬。@H_404_2@
上图:@H_404_2@