Unity UI Canvas連携｜センサー検知と同期した警告パネルの動的制御プロセス
視覚的フィードバックの導入。「 BRAKE!!」UIの実装
自動走行や安全停止のロジックは完成しましたが、画面上では「なぜ止まっているのか」が分かりにくいという課題がありました。そこで、ハコブくんの「意思」を視覚化するために、UI（ユーザーインターフェース）を導入しました。
※薬剤搬送ロボットハコブくんは技術検証用の仮想設定です。 実用化目的ではなく、制御・UIデザイン・HRI（人間とロボットの相互作用）の本質を探求するコンセプトとして定義しています。
警告パネル（UI Canvas）の作成
まず、UnityのCanvasシステムを使用して、画面の中央や端にパッと浮かび上がる警告パネルを設計しました。 背景には鮮やかな赤色のパネル（BrakePanel）を配置し、その上に視認性の高い「⚠ BRAKE」というテキストを表示させています。ハコブくんが危険を感じたときだけこのパネルをアクティブにする仕様です。
スクリプトへのヒモ付けと制御
作成した BrakePanel を、ハコブくんの制御スクリプトである HakobuMove.cs の brakeUI 変数に登録しました。 プログラム側で、センサーが障害物を検知した瞬間に SetActive(true) を、安全が確認されたら SetActive(false) を実行するように設定し、ハコブくんの「脳」と「表示」を完全に同期させました。
視覚化された安全機能
実際に動かしてみると、看護師さんや壁に近づいてハコブくんが止まると同時に、画面にパッと赤い警告が現れるようになりました。 この視覚的なフィードバックにより、シミュレーションの説得力が格段に向上し、デバッグの際も「今、センサーが反応している」ということが直感的に把握できるようになりました。
設定手順
今回行ったUI設定の具体的な手順は以下の通りです。
UIオブジェクトの構築
Unity画面の左側にあるHierarchyウィンドウの何もない場所で右クリックします。
表示されたメニューから UI を選択します。
その中にある Canvas をクリックします。
Canvas を作成し、その子要素として Panel（名前：
BrakePanel）を追加しました。Panelの
Imageコンポーネントで色を赤に設定し、少しだけ透明度を下げて警告らしい雰囲気にしました。そのさらに子要素として Text (TextMeshPro) を配置し、BRAKE !!という文字を中央に大きく表示させました。
初期状態の設定
パトロール開始時は表示されないよう、
BrakePanel本体のチェックボックスを外し、非アクティブな状態にしておきました。
インスペクターでの紐付け
Hakobu_kunオブジェクトを選択し、スクリプト内のBrake UIという空の枠に、HierarchyにあるBrakePanelをドラッグ＆ドロップしてセットしました。
パトロール開始時のUI制御。初期状態の最適化とスクリプトによる自動制御
BRAKE !! の表示には成功しましたが、再生ボタンを押した瞬間から画面に警告が出続けてしまう現象が発生しました。これは、UIオブジェクトがエディタ上で「常に表示（Active）」の状態になっていたことが原因です。ハコブくんがパトロールを開始する時は静かにスタートし、本当に危険な時だけ警告を出すよう、初期設定の改善を行いました。
インスペクターによる「既定の非表示」設定
まず、Canvasの設定をいじるのではなく、警告パネルである BrakePanel 自体を非アクティブ（隠した状態） に設定しました。 エディタのインスペクターで、BrakePanel の名前の左横にあるチェックボックスをオフにすることで、ゲーム開始時に「最初は何も表示されていない」という正しい初期状態を作ることができました。
スクリプトの Start() での強制リセット
万が一、エディタでチェックを入れたまま再生してしまっても大丈夫なように、HakobuMove.cs の Start() メソッドに、UIを強制的にオフにする処理を1行追加しました。これにより、通信やセンサーの準備が整うまでは、確実に警告表示を隠しておくことができます。
パトロール開始と同期したUI制御
修正の結果、再生ボタンを押すとハコブくんは無言で走り出し、突き当たりの壁や看護師さんを検知した瞬間、意図した通りに BRAKE !! がパッと表示されるようになりました。これにより、シミュレーションとしての「動的なリアクション」がより自然で洗練されたものになりました。
修正が必要な2つのポイント
インスペクターでの設定（手動）
Hierarchy で
BrakePanelを選択します。Inspector の一番上、名前のすぐ左にあるチェックボックスをオフにします。
これで、再生した瞬間に「BRAKE !!」が最初から出ている状態を防げます。
スクリプトへの追加（自動）
HakobuMove.cs の Start() メソッドの中に、以下の1行を追加します。
C#
void Start()
{
// ...（既存の処理）...
// パトロール開始時にUIを確実に消しておく
if (brakeUI != null) { brakeUI.SetActive(false); }
Debug.Log("ハコブくん、全システム起動。パトロール開始時はUIを待機状態にします。");
}
作業のポイントと確認結果
Canvasの設定は不要: Canvas自体はUIを表示するための土台なので、基本的には設定を変更する必要はありません。重要なのは、その子要素である「パネル（
BrakePanel）」をプログラムがどう扱うかです。条件式の確認: すでに
FixedUpdate内でbrakeUI.SetActive(isPathBlocked);という記述が入っていれば、センサーが何も検知していない時は自動的に非表示になります。
動作確認の成果
再生を開始した直後、画面に「BRAKE !!」が出ていないことを確認しました。
ハコブくんが壁に接近し、自動ブレーキがかかった瞬間にだけ正確に警告が表示されました。
これで、ユーザーにとっても「今何が起きているか」が誤解なく伝わるようになりました。
