今回は、合成モードの差分を利用してオブジェクトが重なる部分の色を反転させる方法を紹介したいと思います。
使用例
こんな感じで、図形の円とテキストが重なる部分の色が反転します。
合成モード差分
まずはテキストオブジェクトを置きます。
続いて円(図形)を置き、合成モードを差分にします。これだけでテキストと円が重なる部分の色が反転します。
色の反転
合成モード差分による色の反転は、差分設定にしたオブジェクトの色から重なる色を引いたものが表示されます。
ここでは、白い四角形を合成モード差分にして、赤い円と重ねました。そうすると、重なった部分は白から赤を抜いたシアンになりました。
白(255,255,255)-赤(255,0,0)=シアン(0,255,255)
オブジェクトの色を少し変えてみます。
差分設定にした四角形は(244,244,244)。円は(249,8,107)にしました。白からピンクを引いた緑が重なった部分に表示されました。
白(244,244,244)-ピンク(249,8,107)=緑(5,236,137)
値がマイナスになる場合は、マイナスを取った数値になるようです。
ただ、差分を使った色の反転では、反転した色が思っていたのと違うと感じることもあり、個人的には白と黒が扱いやすいと思います。
重なる部分を任意の色にする
合成モードの差分を利用した方法では、重なった部分の色は指定できません。そこで、重なる部分の色を変えたいときは“上のオブジェクトでクリッピング”を利用するといいと思います。
最初に表示させるもの。
オブジェクトの配置が全く一緒で色だけ変えたものをシーンもしくは画像等で用意します。
図形を置いて表示させたい画像(ここでは赤地に白のテキスト)を”上のオブジェクトでクリッピング”すると、図形の部分だけ色が変わります。
応用
差分にした図形を動かした例。テキストにアニメーションをつけたりしてもいいですね。
いかがだったでしょうか。
合成モードの差分を使った色の反転、機会があれば是非試してみてください。