Unreal Engine 5 ドキュメントは Epic Developer Community に移動しました

一時停止メニューを作成する

ゲームの Pause (一時停止) メニューの作成およびスクリプティング方法について説明します。

Choose your operating system:

Windows

macOS

Linux

この操作ガイドでは、ゲームの [Pause (一時停止)] メニューの作成およびスクリプティング方法について説明します。

「 UMG UI クイック スタート ガイド 」および「 メイン メニューを作成するための操作ガイド 」を使用して操作を開始する場合、この操作ガイドでも同じプロジェクトを使用できます。

ゲーム内の一時停止メニューを作成する

このセクションでは、基本的な Pause (一時停止) メニューのビジュアル レイアウトを作成します。

  1. Pause Menu ウィジェット ブループリントを開きます。

  2. [Designer (デザイナ)] タブで、 [Palette (パレット)] から [Hierarchy (階層)] にウィジェットをドラッグ＆ドロップして以下のように設定します。

    Pause1.png

    キャンバス パネル には、 テキスト 付き Vertical Box が 1 つ、およびそれぞれ テキスト を持つ 2 つの ボタン を含む Border が 1 つあります。

  3. [Designer (デザイナ)] ウィンドウで、 Border をサイズ調整して点線のウィンドウ全体を占める (画面全体を占める) ようにします。

    InGamePause_5.3.png

    [Details (詳細)] パネ内の [Brush Color] オプションから色を変更することもできます。

    InGamePause_5.3.2.png

    色の [A (アルファ)] を「 0.5 」に設定して、やや透明にします。ゲームプレイ中に [Pause (一時停止)] メニューが開くと、ボーダーが画面全体に表示されますが、やや透明にすることでバックグラウンドでゲームを表示することができます。

  4. [Details (詳細)] パネルの [Border (ボーダー)] で、画面を全体を占めるアンカーを使用するようにしてください。

    InGamePause_5.4.png

    これにより、画面サイズに関係なく Border が画面を満たすようになります。

  5. [Hierarchy (階層)] の [Vertical Box] を選択してから、 [Details (詳細)] パネルで水平方向および垂直方向の両方でセンタリングします。

    InGamePause_5.5.png

  6. [Vertical Box] の下にある [Text] を選択して、 [Details (詳細)] パネルの [Content (コンテンツ)] で「 Pause Menu 」と入力します。

    InGamePause_5.6.png

  7. 他の 2 つの テキスト ブロックに「 Resume 」と「 Quit 」と入力します。

    Pause7.png

  8. Ctrl キーを押しながら、 [Hierarchy (階層)] にある両方の Button を選択します。次に [Details (詳細)] パネルの [Style (スタイル)] で [Hovered] に対して色を割り当てます。

    InGamePause_5.8.png

  9. [Details (詳細)] パネルで Button の名前を「 Resume 」と「 Quit 」にそれぞれ変更します。

    InGamePause_5.9.png

一時停止メニュー機能のスクリプティング

ビジュアルを設定したら、次にスクリプト化した機能を Pause (一時停止) メニューに設定します。

  1. [Widget Blueprint Editor] ウィンドウの右上隅にある [Graph (グラフ)] ボタンをクリックします。

  2. [My Blueprint (マイ ブループリント)] ウィンドウの [Graph (グラフ)] タブで、 [QuitButton] をクリックして、 [Details (詳細)] パネルで [OnClicked] を追加します。

    PauseMenuFunctionality_5.2.png

  3. [ResumeButton] にも OnClicked イベントを追加します。

  4. [Graph (グラフ)] ウィンドウで 右クリック し、 Get Player Controller ノードを追加します。

    PauseScript2.png

  5. Get Player Controller からピンを引き出して、 Set Input Mode Game Only を使用し、 Get Player Controller から再度ピンを引き出し、 Set Show Mouse Cursor を使用して False に設定してから、 Remove from Parent と Set Game Paused を以下のように使用します。

    PauseMenuFunctionality_5.5.png

    Resume Button をクリックすると、入力モードはゲームのみになり、一時停止メニューが有効な時に表示されるカーソルが取り除かれます。 Set Game Paused ノードを使用して Paused をオフにして、一時停止状態を解除する前に、 Remove from Parent ノードを使用して、実際の Pause (一時停止) メニュー ウィジェットを取り除きます。

  6. Remove HUD という新しい 関数 を作成します。

    PauseMenuFunctionality_5.6.png

    一時停止メニューが有効になると、これを使用してプレイヤーのビューから HUD を取り除きます。

  7. この関数内で Get Player Character ノードを追加して、 Return Value から、 Cast ToFirstPersonCharacter ノードを追加します。

    ScriptPauseMenu_5.7.png

    これで、プレイヤーが使用する Character ブループリントとプレイヤーが使用しているゲームの HUD にアクセスできます。

  8. 以下の画面のように As First Person Character からピンを引き出して Get HUD Reference を使用して、次に Remove from Parent を使用します。

    PauseScript6.png

    これでプレイヤー キャラクターが使用する HUD にアクセスし、ゲームをやめるときにビューポートから取り除きます。

  9. Event Graph (イベント グラフ) で Get Player Controller からピンを引き出して、 True に設定された Set Show Mouse Cursor ノードを使用します。

    ScriptPauseMenu_5.9.png

    [Quit (終了)] をクリックすると、メイン メニューに戻る際にメニューを移動するためにマウス カーソルがオンになります。

  10. 上記で作成した Remove HUD 関数を追加し、その後に Open Level ( Main または独自のメイン メニューを含むレベルの名前に設定) を追加し、以下のように接続します。

    PauseMenuFunctionality_5.10.png

    クリックしてフルサイズで表示 ボタンを両方とも設定できたので、最後に実行しなければならないのはプレイヤーが Pause (一時停止) メニューを呼び出し、ゲームを停止できるようにすることです。

  11. コンテンツ ブラウザ で「 Content/FirstPersonBP/Blueprints 」を選択して、 FirstPersonCharacter ブループリントを開きます。

    PauseScript9.png

  12. グラフ内で M Key Event と Create Widget ノード ( Pause Menu に設定) を追加し、その Return Value を変数に昇格します。

    PauseMenuFunctionality_5.12.png

    一時停止メニューを表示させるために M Key を入力として使用しましたが、どのキーでもご利用いただけます。昇格した変数に対して、作成した一時停止メニューへの参照を格納するため変数 Pause Menu Reference を呼び出しました。

  13. Ctrl キーを押しながら [MyBlueprint (マイ ブループリント)] ウィンドウから変数をドラッグして IsValid ノードに接続します。

    PauseMenuFunctionality_5.13.png

    ここでは、Pause (一時停止) メニュー ウィジェットが作成され、この変数に格納されたかを確認しています。

  14. Is Not Valid ピンを Create PauseMenu_C Widget に接続します。

    PauseScript12.png

  15. 右クリック して、 Get Player Controller ノードを追加し、次に Set Show Mouse Cursor を追加し、 True に設定します。

  16. Get Player Controller ノードから再度引き出し、 Get Player Controller Set Input Mode UI Only から引き出して、これらのノードを以下のように接続します。

    PauseMenuFunctionality_5.16.png

    M を押すと、一時停止メニューに以前アクセスしたことがあれば、再度作成する必要なく、変数にアクセスします。Pause (一時停止) メニューに初めてアクセスする場合は、Pause (一時停止) メニューを作成して、変数として格納して後でアクセスできるようにします。いずれの場合も、Pause (一時停止) メニューを表示する (これは以下で行います) 前は、入力モードは UI のみに設定されます。

  17. Pause Menu Reference 変数から Add to Viewport ノードを使用して、次に Set Game Paused ( Paused を True に設定) を使用します。

    PauseScript14.png

    クリックしてフルサイズで表示 Pause (一時停止) メニューを設定できたので、今度はこのメニューをテストします。

  18. [Compile (コンパイル)] ボタンと [Save (保存)] ボタンをクリックします。次に、エディタで再生するために [Play (プレイ)] ボタンをクリックします。

ゲーム内で、 M Key (または割り当てた任意のキー) を押すと、ゲームが一時停止し、一時停止メニューが表示されるのがわかります。ここから Resume ボタンでゲームプレイを再開するか、 Quit ボタンを使用して終了してメインメニューに戻ります。

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