用shader使图片背景透明
转自:http://blog.csdn.net/dawn_moon/article/details/8631783
好吧,终于抽时间写这篇文章了。
手头上有很多人物行走图,技能特效图等,但这些图都有个纯黑色背景,怎么样将内容显示出来,让背景透明呢?前段时间搞了一下,感谢群里的童鞋们,提供了思路和方法。
这里用shader处理了像素,使黑色背景透明,直接上代码
ShaderSprite.h
#ifndef __TestShader__ShaderSprite__
#define __TestShader__ShaderSprite__ #include "cocos2d.h"
USING_NS_CC; class ShaderSprite : public CCSprite { public:
static ShaderSprite* create(const char* pszFileName);
virtual bool initWithTexture(CCTexture2D *pTexture, const CCRect& rect);
virtual void draw(void);
}; #endif /* defined(__TestShader__ShaderSprite__) */
ShaderSprite.cpp
#include "ShaderSprite.h" static CC_DLL const GLchar *transparentshader =
#include "tansparentshader.h" ShaderSprite* ShaderSprite::create(const char *pszFileName)
{
ShaderSprite *pRet = new ShaderSprite();
if (pRet && pRet->initWithFile(pszFileName)) {
pRet->autorelease();
return pRet;
}
else
{
delete pRet;
pRet = NULL;
return NULL;
}
} bool ShaderSprite::initWithTexture(CCTexture2D *pTexture, const CCRect& rect)
{
do{
// CCLog("override initWithTexture!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!");
CC_BREAK_IF(!CCSprite::initWithTexture(pTexture, rect)); // 加载顶点着色器和片元着色器
m_pShaderProgram = new CCGLProgram();
m_pShaderProgram ->initWithVertexShaderByteArray(ccPositionTextureA8Color_vert, transparentshader); CHECK_GL_ERROR_DEBUG(); // 启用顶点着色器的attribute变量,坐标、纹理坐标、颜色
m_pShaderProgram->addAttribute(kCCAttributeNamePosition, kCCVertexAttrib_Position);
m_pShaderProgram->addAttribute(kCCAttributeNameColor, kCCVertexAttrib_Color);
m_pShaderProgram->addAttribute(kCCAttributeNameTexCoord, kCCVertexAttrib_TexCoords); CHECK_GL_ERROR_DEBUG(); // 自定义着色器链接
m_pShaderProgram->link(); CHECK_GL_ERROR_DEBUG(); // 设置移动、缩放、旋转矩阵
m_pShaderProgram->updateUniforms(); CHECK_GL_ERROR_DEBUG(); return true; }while();
return false;
} void ShaderSprite::draw(void)
{
// CCLog("override draw!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!");
CC_PROFILER_START_CATEGORY(kCCProfilerCategorySprite, "CCSprite - draw"); CCAssert(!m_pobBatchNode, "If CCSprite is being rendered by CCSpriteBatchNode, CCSprite#draw SHOULD NOT be called"); CC_NODE_DRAW_SETUP(); //
// 启用attributes变量输入,顶点坐标,纹理坐标,颜色
//
ccGLEnableVertexAttribs( kCCVertexAttribFlag_PosColorTex );
ccGLBlendFunc(m_sBlendFunc.src, m_sBlendFunc.dst); m_pShaderProgram->use();
m_pShaderProgram->setUniformsForBuiltins(); // 绑定纹理到纹理槽0
ccGLBindTexture2D(m_pobTexture->getName()); #define kQuadSize sizeof(m_sQuad.bl)
long offset = (long)&m_sQuad; // vertex
int diff = offsetof( ccV3F_C4B_T2F, vertices);
glVertexAttribPointer(kCCVertexAttrib_Position, , GL_FLOAT, GL_FALSE, kQuadSize, (void*) (offset + diff)); // texCoods
diff = offsetof( ccV3F_C4B_T2F, texCoords);
glVertexAttribPointer(kCCVertexAttrib_TexCoords, , GL_FLOAT, GL_FALSE, kQuadSize, (void*)(offset + diff)); // color
diff = offsetof( ccV3F_C4B_T2F, colors);
glVertexAttribPointer(kCCVertexAttrib_Color, , GL_UNSIGNED_BYTE, GL_TRUE, kQuadSize, (void*)(offset + diff)); glDrawArrays(GL_TRIANGLE_STRIP, , ); CHECK_GL_ERROR_DEBUG(); CC_INCREMENT_GL_DRAWS();
CC_PROFILER_STOP_CATEGORY(kCCProfilerCategorySprite, "CCSprite - draw");
}
片段着色器代码
tansparentshader.h
" \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[] > texColor[]?(texColor[] > texColor[] ? texColor[] : texColor[]) :(texColor[] > texColor[]? texColor[] : texColor[]); \n\
if (ratio != 0.0) \n\
{ \n\
texColor[] = texColor[] / ratio; \n\
texColor[] = texColor[] / ratio; \n\
texColor[] = texColor[] / ratio; \n\
texColor[] = ratio; \n\
} \n\
else \n\
{ \n\
texColor[] = 0.0; \n\
} \n\
gl_FragColor = v_fragmentColor*texColor; \n\
}";
注意shader编程没有隐士数据类型转换,所以都显示为float了。
然后ratio是指在rgb中找最大的,如果ratio为0直接将alpha设为0,否则alpha设为ratio,然后各rgb除以ratio,这里是为了做渐变,否则变化太生硬。
上图:
好了,上面两张图是一样的。只是屏幕背景一个是白色,一个是黑色。图片背景透明了。
用shader使图片背景透明的更多相关文章
- 【转】cocos2d-x游戏开发(十四)用shader使图片背景透明
转自:http://blog.csdn.net/dawn_moon/article/details/8631783 好吧,终于抽时间写这篇文章了. 手头上有很多人物行走图,技能特效图等,但这些图都有个 ...
- cocos2d-x—使用shader使图片背景透明
这里用shader处理了像素,使黑色背景透明,直接上代码 ShaderSprite.h [cpp] view plaincopyprint? #ifndef __TestShader__ShaderS ...
- ps让图片背景透明
效果图: jpg=>png,背景透明 步骤: 1.选择橡皮工具的第三个 魔术橡皮 保存为png, 按住Ctrl+alt+shift+s 保存:
- Android 设置按钮背景透明与半透明_图片背景透明
Button或者ImageButton的背景设为透明或者半透明 半透明<Button android:background="#e0000000" ... /> 透明 ...
- SVG图片背景透明
今天在调整网页的时候,将logo以原有直接贴代码形式,改为加载文件. 其实真正的目的是做SEO.上次SEO交流后得出 结论:核心在于内容的本身的优化.信噪比很重要.也就是有效信息需要占文章的主要内容, ...
- Swift开发教程--怎样使UITableViewController背景透明
self.tableView.backgroundView? .backgroundColor = UIColor.clearColor(); self.tableView.backgroundCol ...
- JS - 使 canvas 背景透明
canvas = document.getElementById('canvas1'); var context = canvas.getContext('2d');context.fillStyle ...
- C# 实现PNG文件的背景透明显示,解决动态显示闪烁问题 【转】
http://blog.sina.com.cn/s/blog_402c071e0102x4rl.html 以下内容,对于想要使用C#实现PNG图片背景透明显示,同时动态显示时无闪烁问题的人来说, ...
- jquery 图片背景透明度(支持IE5/IE6/IE7)
设置背景图片,以突出透明度的效果及jquery png背景透明插件实例教程 <head> <title>toggle()</title> <style typ ...
随机推荐
- poj 1787 Charlie's Change
// 题意 给定一个数p,要求用四种币值为1,5,10,25的硬币拼成p,并且硬币数要最多,如果无解输出"Charlie cannot buy coffee.",1<=p&l ...
- 一天一个Java基础——排序
插入排序 直接插入排序: 当插入第i个数据元素k时,由前i-1个数据元素组成已排序的数据序列,将k与数据序列中各数据元素依次进行比较后,插入到数据序列的适当位置,使得插入后的数据序列仍是排序的. 直接 ...
- Meta标签详解(转)
引言 您的个人网站即使做得再精彩,在“浩瀚如海”的网络空间中,也如一叶扁舟不易为人发现,如何推广个人网站,人们首先想到的方法无外乎以下几种: ● 在搜索引擎中登录自己的个人网站 ● 在知名网站加入你个 ...
- Hilbert先生旅馆的故事
以前上实变函数的时候稍微讲了下这个故事呢. 来自Hansschwarzkopf 很久很久以前,在欧洲某国的一个小镇上,Hilbert先生开了一家拥有无数个房间的旅馆.一天,旅馆生意红火得一塌糊涂,不到 ...
- 差分信号(Differential Signal)
差分信号(Differential Signal)在高速电路设计中的应用越来越广泛,电路中最关键的信号往往都要采用差分结构设计,什么另它这么倍受青睐呢?在 PCB 设计中又如何能保证其良好的性能呢? ...
- (一)使用Blender导出GameMaker支持的模型脚本
源于YOYO论坛帖子:http://gmc.yoyogames.com/index.php?showtopic=603723 既然想做3D,那就先从模型的导入开始,具体的源文件,可以在“(二)使用等高 ...
- NGUI-快捷键
ALT+SHIFT+S :添加一个新的sprite ALT+SHIFT+L :添加一个新的Label ALT+SHIFT+T:添加一个简单的Texture ALT+SHIFT+W 添加一个可见的wid ...
- Python 变量 对象 引用
1.变量 变量第一次赋值时被创建,变量在使用前必须赋值 变量本身没有类型,变量类型为它引用的对象类型: 变量在使用时被替换成它引用的对象 2.对象 对象本身具有计数和类型,变量引用对象,当对象的引用变 ...
- Classes and Objects :类和对象(2)
类内部可以有另一个类,也就是内部类,如果带static则为静态内部类静态内部类当然不能直接访问实例变量内部类修饰符可以有四种,而外部类只有两种 内部类的意义:这个内部类只适用于这个外部类因为外部类的某 ...
- Memory Cache(内存缓存)
当Google测试了Google Search服务的可用性后,发现速度是最影响Web应用的可用性的因素之一.相对于作用相同但是速度慢的应用,用户更喜欢速度快的应用.多来年,Google已经掌握了如何使 ...