cocos2d 颜色混合 ccBlendFunc 使用方法

本节参考：http://www.jb51.cc/article/p-kxbrzgaj-vm.html

1、概念

“混合”是指两种颜色的叠加方式。在新图片将要渲染画到屏幕上的时候，将用在新图片中的红、绿、蓝和透明度信息，与屏幕上已经存在的图片颜色信息相融合。

说的具体一点，就是把某一像素位置上原来的颜色和将要画上去的颜色，通过某种方式混在一起，从而实现特殊的效果。

新图片颜色被称作“源颜色”，而屏幕上已存在的图片颜色则被称作“目标颜色”。

OpenGL会把源颜色和目标颜色各自取出，并乘以一个系数（源颜色乘以的系数称为“源因子”，目标颜色乘以的系数称为“目标因子”），然后相加，这样就得到了新的颜色。

2、计算公式

假设：颜色信息的四个分量（红，绿，蓝，透明度）

（1）“源颜色” ：（Rs,Gs,Bs,As）

（2）“目标颜色”：（Rd,Gd,Bd,Ad）

（3）“源因子” ：（Sr,Sg,Sb,Sa）

（4）“目标因子”：（Dr,Dg,Db,Da）

那么混合产生的新颜色可以表示为：

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

如果颜色的某一分量超过了1.0，则它会被自动截取为1.0，不需要考虑越界的问题。

3、混合因子

混合方式	解释	因子值
GL_ZERO	全部不用	（0,0）
GL_ONE	全部使用	（1,1,1）
GL_SRC_COLOR	使用源颜色	（Rs,As）
GL_DST_COLOR	使用目标颜色	（Rd,Ad）
GL_ONE_MINUS_SRC_COLOR	减去源颜色	（1-Rs,1-Gs,1-Bs,1-As）
GL_ONE_MINUS_DST_COLOR	减去目标颜色	（1-Rd,1-Gd,1-Bd,1-Ad）
GL_SRC_ALPHA	使用源颜色的透明度	（As,As,0)"> GL_DST_ALPHA	使用目标颜色的透明度	（Ad,Ad,0)"> GL_ONE_MINUS_SRC_ALPHA	减去源颜色的透明度	（1-As,1-As,1-As）
GL_ONE_MINUS_DST_ALPHA	减去目标颜色的透明度	（1-Ad,1-Ad,1-Ad）

4、使用方法

Sprite精灵类中有一个设置混合方式的函数setBlendFunc(BlendFunc)，另外混合方式的属性值是以BlendFunc结构体作为数据的，定义方式为：{ '源因子','目标因子' }。

混合方式可用于精灵纹理图片颜色信息的混合与叠加。

4.1、混合方式创建

1

2

3

4

//@H_301_262@

 
        
        @H_301_262@ 
        //{'源因子','目标因子'}@H_301_262@ 
       
 
        
        @H_301_262@ 
        BlendFunccbl={GL_SRC_ALPHA,GL_ONE};@H_301_262@ 
       
 
        
        //@H_301_262@

4.2、静态常量（常用混合方式）

5

6

@H_862_301@@H_301_262@

const@H_301_262@ 
        BlendFuncBlendFunc::DISABLE={GL_ONE,GL_ZERO};@H_301_262@

 
        
        BlendFuncBlendFunc::ALPHA_PREMULTIPLIED={GL_ONE,GL_ONE_MINUS_SRC_ALPHA};@H_301_262@ 
       
 
        
        BlendFuncBlendFunc::ALPHA_NON_PREMULTIPLIED={GL_SRC_ALPHA,GL_ONE_MINUS_SRC_ALPHA};@H_301_262@ 
       
 
        
        BlendFuncBlendFunc::ADDITIVE={GL_SRC_ALPHA,GL_ONE};@H_301_262@ 
       
 
        
         4.3、混合方式举例 
 
 
        6 
       
      
        7 
       
      
        8 
       
      
        9 
       
      
        10 
       
      
        11 
       
      
        12 
       
      
        13 
       
      
        14 
       
      
        15 
       
      
        16 
        
     //@H_301_262@ 
        
        
        //目标图片，已存在于屏幕上@H_301_262@ 
       
 
        
        Sprite*sp1=Sprite::create(@H_301_262@ 
        "red.jpg"@H_301_262@ 
        );@H_301_262@ 
       
 
        
        sp1->setPosition(mysize/3);@H_301_262@ 
       
 
        
        this@H_301_262@ 
        ->addChild(sp1);@H_301_262@ 
       
 
       
          
        
        
        //源图片，新图片@H_301_262@ 
       
 
        
        Sprite*sp2=Sprite::create(@H_301_262@ 
        "green.jpg"@H_301_262@ 
        );@H_301_262@ 
       
 
        
        sp2->setPosition(mysize/3.0*2.0);@H_301_262@ 
       
 
        
        ->addChild(sp2);@H_301_262@ 
       
 
       
          
        
        
        //混合方式，新图片渲染时的混合方式@H_301_262@ 
       
 
       @H_376_404@ 
        //{源因子,混合因子}@H_301_262@ 
       
 
        
        301_262@ 
       
 
        
        sp2->setBlendFunc(cbl);@H_301_262@ 
       
 
        
        4.4、如下图所示 
  
5、混合方式举例 
 （1）{ GL_ONE,GL_ZERO } 
（2）{ GL_ZERO,GL_ONE } 
（3）{ GL_ONE,SimKai">（4）{ GL_SRC_ALPHA,GL_ONE }（比较常用） 
 和上图一样？是因为“源颜色”的透明度为：1。
  
 本文出自 “夏天的风” 博客，请务必保留此出处http://www.jb51.cc/article/p-fpnoljdp-wx.html

      
      
                 
        上一篇：Cocos2dx 实现擦除 橡皮擦 刮奖 效下一篇：cocos2d-js 热更新详解（一）

cocos2d 颜色混合 ccBlendFunc 使用方法

猜你在找的Cocos2d-x相关文章