Lab

Cocos2d-x:ブレンドの設定

 Tag :  Published : 2014-2-9

Pocket

ccBlendFuncを使用します。
Photoshopでいうところの描画モード(乗算とかスクリーンとか)のような効果を作成します。

基本形

空とひまわりのスプライトを重ねて配置して、いろいろブレンドしてみます。

cocos2d-x 後景の写真
cocos2d-x 前景の写真

基本のコードはこんな感じです。

    CCSize s = CCDirector::sharedDirector()->getWinSize();

    //空
    CCSprite* pImg = CCSprite::create("sky.png");
    pImg->setPosition(ccp(s.width/2, s.height/2));
    addChild(pImg);
    
    //ひまわり
    CCSprite* pImg2 = CCSprite::create("sunflower.png");
    pImg2->setPosition(pImg->getPosition());
    addChild(pImg2);
    
    //ブレンド
    ccBlendFunc blend;
    
    //前景(ひまわり)の合成方法
    blend.src = GL_ONE_MINUS_DST_COLOR;
    
    //後景(空)の合成方法
    blend.dst = GL_ONE;
   
    pImg2->setBlendFunc(blend);
    

以下、blend.src/blend.dstの値を変更して、いろいろな効果を見てみます。
乗算以外、ひまわりの背景は透明にしてあります。

乗算

cocos2d-x 乗算
    blend.src = GL_ZERO;
    blend.dst = GL_SRC_COLOR;
    

加算

Photoshopで言う所の、”覆い焼き(リニア)ー加算”です。

cocos2d-x 加算
    blend.src = GL_SRC_ALPHA;
    blend.dst = GL_ONE;
    

減算

cocos2d-x 減算
    blend.src = GL_ZERO;
    blend.dst = GL_ONE_MINUS_SRC_COLOR;
    

除外

cocos2d-x 除外
    blend.src = GL_ONE_MINUS_DST_COLOR;
    blend.dst = GL_ONE_MINUS_SRC_COLOR;
    

スクリーン

cocos2d-x スクリーン
    blend.src = GL_ONE_MINUS_DST_COLOR;
    blend.dst = GL_ONE;