2018年6月19日火曜日

【unity】GUI上でButtonの状態に応じてtextの色を変える

タイトルの問題に関して以下の英語の記事を参考にしました
というかほぼ答え感ある
https://answers.unity.com/questions/940456/how-to-change-text-color-on-hover-in-new-gui.html




ボタンにマウスを重ねた時にボタンじゃなくてテキストの色が変わってほしい!
黒色から赤色に変わってほしい!

テキストの色を変えるのは結構簡単に変えることができます。

ButtonコンポーネントのTransitionが "Color Tint" になっていることを確認して、
Transitionの中のTargetGraphicをTextを持っているオブジェクトに変えればいいだけです。

それでできるんかーい

ちなみにTargetGraphicにTextが出てこない場合はButtonとTextの親子関係を確かめてください。
デフォルトなら大丈夫です。

デフォルトの親子関係


しかーーーーし!!!

マウスを重ねている状態

これだと黒色から赤っぽい黒色に変わっただけです。
マウスを重ねた時に黒色から完全な赤色に変えるにはどうしたらいいのでしょうか。

答えはTextのフォントの色を白にし、ButtonのNomalColorを黒にすればいいのです。



ButtonのTrasitionでの色の変更はあくまで元々の色に新しい色でかけ算を行なっているだけです。
なのでもしフォントの色が完全な黒(=RGBが全て0)では、Buttonから色の変更を試みても掛けたら0になるので真っ黒のままになります(Buttonの色変更を受け付けない)。
黒色から赤っぽい黒色になったのもこれが原因。

それなら元々のフォントの色を完全な白(=RGBが全て1)にして、後から色を変えるときは全てButton側から行えば良いのです。


余談ですがこれの本領を発揮するのはButtonの表示を透明にすることにあります。

これが

こうじゃ


スクリプトなしでもそれっぽいUIが作れそうですね。これは強い。

0 件のコメント:

コメントを投稿