ページの作成
親となるページを選択してください。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球
子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール
親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
| この記事の要点 |
|
はじめに
Unreal Engine 5 では UI を構築するために UMG(Unreal Motion Graphics) の Widget を使います。表示までは簡単ですが、「特定のクラスのウィジェットだけ閉じたい」「複数生成した中から条件付きで消したい」となると、いきなり戸惑う人が多い領域です。
本記事では、Blueprint だけで実装できる 3 つのパターン(直接閉じる / クラス指定で一括 / 条件付きで個別)を、ノードのつなぎ方とともに解説します。
前提:ウィジェットを閉じるとは
UMG のウィジェットは Add to Viewport でビューポートに追加された状態を「表示」と呼びます。閉じる(消す)処理の本質はビューポートから取り除くことで、これを担うノードが Remove from Parent です。
| ノード | 役割 |
|---|---|
Create Widget | クラスを指定してウィジェットインスタンスを生成 |
Add to Viewport | 画面に追加(表示開始) |
Remove from Parent | 親(ビューポート)から取り除く(非表示化) |
Get All Widgets of Class | 現在ビューポートにある指定クラスのウィジェット一覧を取得 |
方法 1:変数経由で直接閉じる
もっとも簡単なパターンです。表示するときに変数として持っておき、閉じたいタイミングでその変数に対して Remove from Parent を呼びます。
セットアップ
- Blueprint で User Widget 変数(型: 該当 Widget クラス)を作成。例:
CurrentMenuWidget - Create Widget の戻り値を
Set CurrentMenuWidgetに接続 - そのまま
Add to Viewportで表示
閉じる側
- キー入力や任意のイベントで
Get CurrentMenuWidget Is Validで null チェック- 有効なら
Remove from Parentを呼び、続けてSet CurrentMenuWidget = Noneで参照クリア
参照を None にしておかないと、ウィジェットがビューポートから外れた後も Blueprint がインスタンスを保持し続けるため、ガベージコレクションされません。変数のクリアは習慣化しておきましょう。
方法 2:Get All Widgets of Class で一括クローズ
複数の同種ウィジェットが画面上に存在していて、まとめて消したい場合に使うのが Get All Widgets of Class です。
ノードの流れ
- イベント(例: 入力アクション)から開始
Get All Widgets of Classノード(Top Level Only は通常 true)- 出力 Array に対し
For Each Loop - 各要素(Array Element)に対して
Remove from Parent
クラスの指定
Widget Class ピンに対象の User Widget クラスを指定します。子クラスを含めるかは Top Level Only ではなく、指定したクラスとその派生クラスがマッチします。たとえば WBP_Menu を指定すれば WBP_PauseMenu(WBP_Menu を継承)もヒットします。
方法 3:条件付きで特定のものだけ閉じる
「同じクラスのウィジェットが 3 つあるが、Owner プレイヤーが自分のものだけ閉じたい」のような条件付きクローズです。
ウィジェット側の準備
- 該当 Widget Blueprint に
OwnerPlayer(型: Player Controller)変数を追加 - Expose on Spawn / Instance Editable をオンにする(Create Widget のピンで渡せる)
- 生成時に Owning Player をセット
閉じる側のロジック
Get All Widgets of Classでリスト取得For Each Loop- 各要素に対して
OwnerPlayer変数を取得 Equal (Object)でGet Player Controller (0)と比較Branch→ True ならRemove from Parent、False なら何もしない
条件のバリエーション
| 条件 | 判定方法 |
|---|---|
| 特定プレイヤーのもの | OwnerPlayer 変数を持たせて比較 |
| 表示後 N 秒経過 | SpawnedTime(GetGameTimeInSeconds で記録)と現在時刻の差で判定 |
| 特定の状態フラグ | bIsModal や Category 等の自前 enum で判別 |
| クラスがさらに特化 | Cast To 子クラス → 成功した場合のみ閉じる |
応用:フェードアウトしてから閉じる
いきなり消えるとプレイヤーに違和感を与えます。ウィジェット側に Animation(FadeOut) を作っておき、再生完了後に Remove from Parent するのが定石です。
ウィジェット側
- Animations パネルで新規アニメ
FadeOutを作成 - ルート(Canvas Panel など)の Render Opacity を 1 → 0 にキーフレーム
- Event Graph で
OnAnimationFinishedを実装し、Animation 引数が FadeOut のときRemove from Parent
呼び出し側
閉じたいタイミングでは Play Animation (FadeOut) を呼ぶだけ。アニメ完了は イベントベースで拾うので Delay より正確です。
Hide と Remove の違い
| 方法 | 挙動 | 使いどころ |
|---|---|---|
| Visibility を Hidden / Collapsed | 描画停止するがインスタンスは生存 | すぐ再表示する UI(HUD のサブパネル等) |
| Remove from Parent | ビューポートから外れる。参照を切れば GC 対象 | 使い終わりのウィンドウ、もう開かないダイアログ |
| Set Render Opacity = 0 | 透明だが当たり判定(マウスクリック)は残る | アニメ用、入力は通したい一時的な演出 |
「閉じる」のニュアンスに合わせて使い分けると、無駄なメモリ・GC を抑えつつ快適な UX を実現できます。
よくあるトラブル
| 症状 | 原因と対処 |
|---|---|
| Remove したのに次フレームも残って見える | 同じクラスを別所で再生成している。Get All Widgets of Class で残存を確認 |
| Remove 後もメモリが減らない | 変数で参照を保持したまま。Set 〜 = None で開放 |
| Get All Widgets of Class が空配列 | クラスを親側で指定し過ぎ / Add to Viewport していない / Sub Widget は対象外 |
| 子ウィジェットだけ閉じたい | Sub Widget は Remove from Parent でも閉じられる。親 Canvas Panel から外れる |
| マウス入力が他に行かない | 消し忘れの Modal Widget が残存。Get All Widgets of Class で全消去 → 必要なものだけ復活 |
FAQ
Q: Remove from Parent と Destroy の違いは?
A: ウィジェットには Actor のような Destroy は基本ありません。Remove from Parent + 参照クリアが「破棄」に相当します。
Q: Tick で毎フレーム Remove は安全?
A: 既に外れているウィジェットへの Remove は無害ですが、無駄なので Is Valid で守るか、参照クリアと併用するのが推奨。
Q: C++ から呼ぶ場合は?
A: UUserWidget::RemoveFromParent() がそのまま使えます。Blueprint と同じセマンティクスです。
関連
- ウィジェット — 親カテゴリ
- 「Get Overlapping Actors」から特定のクラスの場合のみ処理を実行する方法 — クラス判定の Tips
- Add to Viewport — 表示開始
- Get All Widgets of Class — クラス指定で取得
- Animation / OnAnimationFinished — フェード演出
ページの作成
親となるページを選択してください。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球
子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール
親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
子ページはありません
人気ページ
- 1 Eclipseで「サーバーに追加または除去できるリソースがありません。」の原因と対処法
- 2 tomcat の起動 / 停止ログと catalina.log・catalina.out の違い
- 3 JavaScript base URL 取得方法|window.location.origin と SSR/Node.js 対応
- 4 YouTube Data API v3 エラー一覧|403/400/404 の主要原因と切り分け
- 5 Spring Frameworkのアノテーション一覧
- 6 Laravel エラー一覧|500/Blade/DB 接続/ルーティングの代表エラー
- 7 3Dグラフィックスとは|モデリング/レンダリング/主要ソフトウェア (Blender / Maya)
- 8 【Spring】@Valueアノテーションとは
- 9 CATALINA_HOME の確認方法 (Linux / Mac)
- 10 【Spring】@Autowiredアノテーションとは
最近更新/作成されたページ
- IPv6とは|128bitアドレス・コロン16進表記/::省略・リンクローカル・SLAAC・デュアルスタック NEW 2026-06-22 12:34:44
- VPNとは|暗号トンネル・サイト間/リモートアクセス・IPsec/SSL-VPN/WireGuardを解説 NEW 2026-06-22 12:19:10
- MAC アドレスフィルタリングの仕組みと限界 | ネットワーク入門 NEW 2026-06-22 12:19:10
- gRPC とは HTTP/2 + Protocol Buffers の高速 RPC | ネットワーク入門 NEW 2026-06-22 12:17:25
- WebRTC とは ブラウザ間 P2P の音声・映像・データ通信 | ネットワーク入門 NEW 2026-06-22 12:17:25
- HTTP/2 とは 多重化・HPACK・バイナリフレーム | ネットワーク入門 NEW 2026-06-22 12:17:25
- Web通信プロトコル入門 HTTP/2・HTTP/3・WebSocket・gRPC・WebRTC | ネットワーク入門 NEW 2026-06-22 12:17:25
- HTTP/3 (QUIC) とは UDP ベースの低遅延 Web 通信 | ネットワーク入門 NEW 2026-06-22 12:17:25
- WebSocket とは 全二重リアルタイム通信 ws/wss | ネットワーク入門 NEW 2026-06-22 12:17:25
- HAProxy とは frontend/backend と設定例 | ネットワーク入門 NEW 2026-06-22 12:17:24
- 証明書と認証局(CA)とは|X.509・信頼チェーン・DV/OV/EV・失効(CRL/OCSP)を解説 NEW 2026-06-22 12:17:24
- ファイアウォールとは|パケットフィルタ・ステートフル・DMZ・次世代FW(L4/L7)を解説 NEW 2026-06-22 12:17:24
- iptables/nftablesとは|テーブル・チェーン・ルール例・永続化をLinux視点で解説 NEW 2026-06-22 12:17:24
- CDN とは エッジキャッシュ・TTL・Cloudflare/CloudFront | ネットワーク入門 NEW 2026-06-22 12:17:24
- TLS/SSLの仕組み|ハンドシェイク・暗号スイート・前方秘匿性・証明書検証をわかりやすく解説 NEW 2026-06-22 12:17:24
コメントを削除してもよろしいでしょうか?