Cocos2d-x3.3でSpriteの明度(あるいは輝度)をテキトーに調節する

Pocket

IMG_1817

タイトルの通り、上のスプライトの明度を調整する方法のメモです。

多分OpenGLの仕様なんだろなって思ってるんですが(OpenGLを全然知らないし勉強する気もないからなんとも言えないんだけど)、Cocos2d-xではSpriteの色を調節する方法はあっても、その明度を色々するメソッドがありません。
だから、以下のように設定すると黒くはなるのですが…

sprite->setColor(Color3B(0,0,0));

IMG_1820

だからといって、Color3Bのそれぞれのrgb値を255にしても、元に戻るだけです。

sprite->setColor(Color3B(255,255,255));

IMG_1817しょんぼり(´・ω・`)
しかし、以下のやり方で、擬似的に(?)ですが明るさも調節することができるようになります。

結論:blendFuncをいじる

明度をいじるにはblendFuncの時代ですよ。
blendFuncについては下記のサイトがわかりやすかったです。

Cocos2d-x:ブレンドの設定 | Lady Wendy

明度を変えるには「加算」の設定にする

というわけで、やってみます。

sprite->setBlendFunc((BlendFunc) { GL_SRC_ALPHA, GL_ONE });
sprite->setColor(Color3B(255,255,255));

この「setBlendFunc((BlendFunc) { GL_SRC_ALPHA, GL_ONE });」の部分で加算のブレンド設定にしています。
普通に以下のように書いてもOKです。

BlendFunc blend;
blend.src = GL_SRC_ALPHA;
blend.dst = GL_ONE;
sprite->setBlendFunc(blend);

IMG_1818

やったー明るくなったー\(^o^)/・・・?
なんか惜しいですね。
気持ち明るくなってるような気もしますが、成仏しかけてるようにも思えます。
透けている部分に何かしら怨念めいたものを感じますね。

そしてColor3Bのrgb値を0にすると、完全に成仏してしまいました。
やはり死にかけていたみたいですね。

sprite->setBlendFunc((BlendFunc) { GL_SRC_ALPHA, GL_ONE });
sprite->setColor(Color3B(0,0,0));

IMG_1823

さようならここすたん・・・。

安易な発想:重ねてみる

どうも、明度は透けてしまうようです。

「なら元のと重ねて表示したらいいんじゃね」

ということで、2つのスプライトを重ねてみます。
cocos2d-xのv3では同じスプライトを使ってたら、自動的にSpriteBatchNodeという素敵機能が働いて最適化されるとかされないとかいう記事をどこかで読んだような読まなかったような気がするので(かなりテキトーですみません)、きっとほとんど速度は変わらずに表示できるんじゃないかな、と淡い期待をこめながらやってみます。

どっちみちそんな神経質に作ってないので、速度が落ちても仕方ないですませちゃいますが(・ω・)

// ここすたんを召喚
auto sprite = Sprite::create("HelloWorld.png");
sprite->setPosition(Vec2(visibleSize.width/2 + origin.x, visibleSize.height/2 + origin.y));

// 明度を調節するここすたんを召喚
auto innerSprite = Sprite::create("HelloWorld.png");
innerSprite->setPosition(sprite->getContentSize() / 2);
innerSprite->setBlendFunc((BlendFunc) { GL_SRC_ALPHA, GL_ONE });

// ここすたんの子ノードにする
sprite->addChild(innerSprite);

// 色の変更が子ノードにも伝播する設定
sprite->setCascadeOpacityEnabled(true);
sprite->setCascadeColorEnabled(true);

// 色を変えてみる
sprite->setColor(Color3B(255,255,255));

いちお解説すると、スプライトの中に同じスプライトを重なるように入れてます。
そして子スプライトのblendFuncを調節し、
setCascadeOpacityEnabledおよびsetCascadeColorEnabledを設定して親ノードの色や透明度の変更が子ノードにも伝播するようにしています。
最後に、親ノードの色を変更してます。

IMG_1822

簡単なわりになんかいい感じな気がする!
そして、rgb値を0にしてみると・・・

IMG_1821

もとめてた感じに近いですね!

GL callsをみると結局1個呼び出してるのが増えてるんで、上で期待したような結果にはなりませんでしたが(同じノード上で同じSpriteFrameを使う、など色々な制限があるのか単にぼくが読んだという夢を見たのかどっちかですね)、とりあえずこれならTintByを使って光らせることもできそうな気がしますね。

ところで、輝度?明度?どっちなんでしょう。
最後までテキトーですみません(´・ω・`)

※ここすたんという呼び方も、ぼくがそう勝手に呼んでます。

Cocos2d-x3.3でSpriteの明度(あるいは輝度)をテキトーに調節する” への1件のコメント

  1. ピンバック: Cocos2d-x v3でスプライトの輝度や明度を操作する | たそがれブランチ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です