ぺんたんがゲーム開発やアプリ開発、最近の気になる話題、特にスマホやIT関連について語る場所

ぺんごや

Unity Unity初心者 Unity基礎

【Unity】uGuiで最前面にあるUI以外の操作を不可にする方法

投稿日:

UIにボタンやスクロールビューを配置していると、最前面に表示されているUI以外のタップ反応を無効にしたいと思うことがあります。

例えば、アイテム一覧からアイテムを選択すると、最前面にアイテムの詳細説明がポップアップ表示される場合とか。
そのやり方を説明します。

最前面にあるUI以外、触れなくする方法

やりたいこと

動画のように最前面に表示されたUI以外をいじっても反応させなくしたいです。

実装方法

触らせたくないUIより前面になんでもいいからUIをかぶせる。以上。

とてもシンプルです。

 

今回は以下のように「wall_back」という画像UIを追加しました。

 

そしてそれを、画面全体を覆うようにサイズを調整し配置しました。

 

視認性を高めるため、色に半透明の黒を指定しています。色は何でもよく完全に透明な画像でもOKです。

なお、ヒエラルキーウィンドウで下にあるものが、より前面に配置されますので、反応させたくないUIよりも下に追加するようにします。

UIの挙動

UnityのUIは表示が重なっているときは最前面に表示されているUIのみ反応する挙動のため、それを利用し反応させたくないものの上にUIを置いてしまえという手法です。

やり方ひとつでとてもシンプルに実装できるのはUnityのありがたいところですね。

【おまけ】逆に画像UIを表示しつつも後ろのUIを操作したい場合


画像UIのレイキャストターゲットをOFFにしてあげるとタップが前面のUIを貫通し、下のUIが反応するようになります。

-Unity, Unity初心者, Unity基礎

Copyright© ぺんごや , 2019 All Rights Reserved Powered by STINGER.