メニュー アンカー

ポップアップ メニューの位置を固定できるメニュー アンカーの使用方法と設定についての情報

メニュー アンカー は、UI レイアウトに追加できるウィジェットです。メニュー アンカー を使用すると、画面上のポップアップ メニューの位置を調整できます。

このページでは、UI レイアウトでのメニュー アンカーの使用と調整に関する基本情報を提供します。さらに、Unreal Motion Graphics UI Designer (UMG) を使用して、以下の Anchor Menu ウィジェットの使用と調整の例をよく理解してください。

メニュー アンカーのプロパティ

[Details (詳細)] パネルのオプション

配置した メニュー アンカー の詳細パネルには、ウィジェットに関連して設定可能な以下のオプションがあります。

DetailsPanel.png

オプション

説明

Menu Class

メニューが呼び出された場合にスポーンする Widget ブループリント (ポップアップ)。毎回ウィジェットを新たに作成します。

Placement

作成したウィジェットの位置を決めるために使用するいくつかの配置オプション。

Fit in Window

true に設定すると、メニュー アンカーはウィンドウ内のメニューにフィットしようとします。

Should Defer Painting After Window

ウィンドウ コンテンツの後にペイントを延期する機能を設定します。

Use Aplication Menu Stack

false に設定すると、メニューのライフタイムを自分で制御することができます。

OnGetMenuContent

ポップアップをカスタマイズできるようにします。これは、関数またはプロパティを、ポップアップを表示するときに呼び出される OnGetMenuContent Event にバインドして行います (以下参照)。

OnGetUserMenuContent

ポップアップをカスタマイズできるようにします。これは、関数またはプロパティを、ポップアップを表示するときに呼び出される OnGetUserMenuContent イベントにバインドして行います。

OnMenuOpenChanged

ポップアップをカスタマイズできるようにします。これは、関数またはプロパティを、メニューの開いた状態が変更されるときに呼び出される OnMenuOpenChanged イベントにバインドして行います。

OnGetMenuContent イベントと OnGetUserMenuContent イベントでは、[Details] パネルから直接関数を作成し、バインドできます。これは、メニュー アンカーが呼び出されるたびに呼び出されます。これにより、ポップアップメニューの作成で機能を追加できます。例えば、以下ではプレイヤーが In Battle (戦闘中) であるかを判断するチェックを実行し、In Battle でなければ、ポップアップメニューにアクセスできるようにします。In Battle ならば、ポップアップメニューにアクセスできないようにします。

ExampleGetMenu.png

ブループリント関数

Menu Anchor ウィジェットには以下で説明するスクリプトを介して呼び出し可能ないくつかのウィジェット特有の関数があります。

MenuAnchorNodes.png

オプション

説明

Close

現在開いていればメニューを閉じます。

Fit in Window

ウィンドウでのアンカー メニューのフィッティングを設定します。

Get Menu Position

ワールド空間でメニューの位置を戻します。

Has Open Sub Menus

メニューがサブメニューを持つかどうかを戻します。

Is Open

ターゲットのメニューアンカーが現在開いているかをチェックし、Boolean を戻します。

Open

現在閉じていればメニューを開きます。

Set Placement

作成したウィジェットの位置を決めるために使用する配置オプションを設定します。

Should Open Due to Click

クリックによってメニューを開くことができるかどうかを戻します。

Toggle Open

メニューのオープン状態を切り替えます。開/閉の代わりに使用できます。

使用例

以下の例のようにインベントリ メニューを作成し、プレイヤーがアイテムをクリックしたときにポップアップを表示させるとします。

最初にやることは、ポップアップ メニューの外観を作成することです。

PopUpDesigner.png

上の画像では、縦方向ボックス (Vertical Box) 内に 3 つのボタンがある MenuPopUp と呼ばれる単純な Widget ブループリント を作成しました。

次にインベントリ メニューでもうひとつ Widget ブループリントを作成する必要があります。これは以下で HUD と呼んでいるものです。

MakeInventoryMenu.png

インベントリ メニューを作成したら Menu Anchor ウィジェット (Primitive の配下にあります) も追加します。

AddMenuAnchor.png

次に表示させたい場所にメニュー アンカーを配置します。ここでは、右/中央位置に配置し固定しました。

PlacedAnchor.png

メニュー アンカーの [Details (詳細)] パネルで Menu Class (またはスポーンする Widget ブループリント) とその配置オプションを設定します。

MenuAnchorDetails.png

グラフ タブで各ボタンに OnClick Event を追加し、Menu Anchor ウィジェット内にドラッグします。

Menu Anchor からドラッグし、Open 関数を呼び出し、指定したメニュー クラスを開き表示することができます。

HUD_Graph.png

Open ノードの Focus Menu オプションにチェックを入れて、Menu Anchor ウィジェットにフォーカスを適用します。この場合、メニューからフォーカスを外すと (どこか別の場所をクリックすると外れます) Menu Anchor ウィジェットは自動的に終了します。これは、ユーザーが画面の他の領域を操作したときにメニューを閉じる方法です。

インベントリ メニューを作成したら、そのメニューをゲーム内で何らかの方法で呼び出す必要があります。

これは Level ブループリント または (この例では) Default Pawn Class (MyCharacter を使用するように設定されています) を介して行うことができます。

DisplayingInventoryMenu.png

上の画像の MyCharacter ブループリントでは、ゲームが開始すると HUD ウィジェットを作成し、それを HUDWidget と呼ばれる変数として格納し、後でアクセスできるようにします。次に I を設定して Add to ViewportRemove from Parent を切り替えて、インベントリ メニューを表示または削除します。また、インベントリ メニューを開くか開かないかに基づき、Show Mouse Cursor を有効または無効にします。

最後に MenuPopUp ブループリント (ポップアップ メニュー) 内で、プレイヤーがポップアップ メニューのボタンを押したときにメニュー アンカーを Close (閉じる) スクリプトを追加します。以下ではポップアップが構築されたときに、MyCharacter ブループリントへの参照を得ます。これは MyCharacterCasting to し、それを MyCharacterReference と呼ばれる変数に昇格させることで行います。この参照があると、 HUD にアクセスできます。

PopUpMenuNetwork.png

ポップアップの各ボタンに押下時に何かを行う (画面に表示する代わりに) 何らかの機能を追加したいかもしれません。例えば、最初のボタンはインベントリのアイテムを「使用」し、2 つめはアイテムを「ドロップ」し、3 つめは「キャンセル」し、プレイヤーをインベントリ メニューに戻します。

これはほんの一例にすぎません。何がメニュー アンカーが開く原因になるかを変更することもできます。ボタン押下の代わりに IsHovered 関数を使用して、オブジェクト上にカーソルが乗っているかを判断し、メニュー アンカーとポップアップ ウィンドウを開きツールチップや他の何らかの通知フォームを表示します。いずれの場合でも、これでスクリプトを通してメニュー アンカーの使用を開始し、ポップアップ ウィジェットを表示 / 削除します。

Unreal Engine のドキュメントを改善するために協力をお願いします!どのような改善を望んでいるかご意見をお聞かせください。
調査に参加する
キャンセル