图片精灵颜色混合模式-新闻详情

图片精灵颜色混合模式


发布时间:2016-09-29责任编辑:朱明 浏览:1377


在游戏开发中,我们经常会使用到精灵图片的颜色变换,简单粗暴的setColor函数实现,但是这只是在原图片上覆盖了一层颜色,如果我们需要实现闪光的灯,照明弹效果等等,那就可以使用下面介绍的方法来实现。

 

混合模式

 

如果学习过OpenGL(ES),就知道里面使用glBlendFunc函数实现的。在cocos2d-x里肯定也有,对于精灵,可以使用mysprite->setBlendFunc()来现。

 

什么是颜色混合?

简单来说就是将RGBA中的A,经行操作处理。具体一点,就是把某一像素位置原来的颜色和将要画上去的颜色,通过某种方式混在一起,从而实现特殊的效果。

OpenGL 会把源颜色和目标颜色各自取出,并乘以一个系数(源颜色乘以的系数称为源因子,目标颜色乘以的系数称为目标因子),然后相加,这样就得到了新的颜色。(也可以不是相加,新版本的OpenGL可以设置运算方式,包括加、减、取两者中较大的、取两者中较小的、逻辑运算等,但我们这里只简单讨论下。)

 

假设源颜色的四个分量(指红色,绿色,蓝色,alpha值)是(Rs, Gs, Bs,  As),目标颜色的四个分量是(Rd, Gd, Bd, Ad),又设源因子为(Sr, Sg, Sb, Sa),目标因子为(Dr, Dg, Db,  Da)。则混合产生的新颜色可以表示为:

(Rs*Sr+Rd*Dr, Gs*Sg+Gd*Dg, Bs*Sb+Bd*Db, As*Sa+Ad*Da)

 

glBlendFunc有两个参数,前者表示源因子,后者表示目标因子。这两个参数可以是多种值,(有兴趣的同学可以去翻看下源码,里面有大量的参数)
下面介绍比较常用的几种:

GL_ZERO:表示使用0.0作为因子,实际上相当于不使用这种颜色参与混合运算。
GL_ONE
 表示使用1.0作为因子,实际上相当于完全的使用了这种颜色参与混合运算。
GL_SRC_ALPHA
:表示使用源颜色的alpha值来作为因子。
GL_DST_ALPHA
:表示使用目标颜色的alpha值来作为因子。
GL_ONE_MINUS_SRC_ALPHA
:表示用1.0减去源颜色的alpha值来作为因子。
GL_ONE_MINUS_DST_ALPHA
:表示用1.0减去目标颜色的alpha值来作为因子。

 

下面举一个例子:

 

auto spr  Sprite::create("hat.png");

       spr->setScale(0.5f);

       spr->setPosition(winsize.width / 2, winsize.height / 2);

       this->addChild(spr);

 

       auto spr1  Sprite::create("123.png");

       spr1->setColor(Color3B::WHITE);

       spr1->setScale(5.0f);

       spr1->setPosition(winsize.width / 2, winsize.height / 2);

       this->addChild(spr1);

 

       BlendFunc bf  { GL_DST_COLOR, GL_ONE };

       spr1->setBlendFunc(bf);

 

资源123.png:“图片精灵3.png ”(透明的小图片)

效果后:                                                                               效果前:
  图片精灵1.png         图片精灵2.png

 

看上面的对比,使用颜色混合,配合动画,不需要美术就可以实现一些不错的效果。

 

春秋工作室  供搞