(:3[kanのメモ帳]

個人ゲーム開発者kan.kikuchiのメモ的技術ブログ。月木更新でUnity関連がメイン。

(:3[kanのメモ帳]


本ブログの運営者kan.kikuchiが個人で開発したゲームです!


UIEffectを使って画面全体をディゾルブ(トランジション、フェード)させて切り替える方法【Unity】【uGUI】


このエントリーをはてなブックマークに追加

この記事でのバージョン
Unity 2022.3.16f1


はじめに

今回はディゾルブと呼ばれる特定のパターンで画面を埋めつくしていくようなフェード

UnityのuGUIで実現する方法の紹介です!





UIEffectを使って画面全体をディゾル

今回はUIEffectという無料(MIT License)で公開されているアセットを使います。



なお、導入はGitHubから直接ダウンロードしてきてプロジェクトに追加してもいいですし、


Package Managerを使ってインストールする事も可能です。


次に使い方ですが、

ディゾルブさせたいコンポーネント(画面全体を覆うImage等)が付いてるオブジェクトに

UIDissolveというコンポーネントをアタッチするだけ。


あとは好みの設定にし、Effect Factorの数値を変えると切り替えが出来ます。

ただし、ディゾルブする画像を他のUIよりも前面に表示する必要はあります。



なお、プログラムから切り替えを実行したい場合はUIDissolveのPlayを使います。

//ディゾルブの切り替え再生(_dissolveはUIDissolveクラス)
_dissolve.Play();


また、どのようにディゾルブするかを決めるルール画像はTransition Textureで設定しますが、


その画像のAlpha SourceをFrom Gray Scaleにする必要がある点には注意が必要です。


ちなみに以下のサイトから色々なパターンのルール画像を無料(リンクウェア)でダウンロード出来ます。

(この記事内で使われているルール画像も下記のものです)