Language:
Page Info
Engine Version:
The translation of this page is out of date. Please see the English version for the latest version of the page.

5.セカンド メニューを構築する

  1. コンテンツブラウザ で以前に作成済みの "NewGameMenu" アセットを検索して開きます。このメニューには、名前を入力する テキストボックス、名前を入力するまでクリックできないゲームプレイ用の ボタン、メインメニューに戻るボタンがあります。

  2. 名前の入力欄を作成するには、Text Box ( Text Block ではありません) をレイアウトへドラッグします。

    CreateTextEntryBox.png

  3. Text Box は以下の値で設定します。

    • [NameTextEntry] の名前を変更します。

    • Position は (325, 200) に設定。この値に設定することで、Text Block を Text Box の左に配置するための余白ができます。

    • [Size] は 250x40 に設定。

    • ([Style] ヘッダの下) の [Font size] は 20 に設定。

    TextBoxDetails.png

  4. 前回のメニューに作成したボタンと同じ方法で Text Block ラベルを使用してプレイゲーム ボタンを作成することができます。

    • Button の設定値PlayGameButton 名を変更し、[Position (位置)] を 200 と 300、Size を 200, 100 に設定します。

    • Text Block の設定値PlayGameText 名を変更し、Visibility (ビジビリティ) を [Hit Test Visible] にして、PlayGameButton 上にドラッグします。

  5. プレイゲーム ボタンには特別な機能があります。これは、Text Box に入力した名前が空白でない場合のみ有効になります。Unreal Motion Graphics (UMG) のバインド機能を使って [Is Enabled] フィールド ([Behavior (ビヘイビア)] セクション配下) に新機能を作成することができます。

    PlayGameButtonDetails.png

    ゲームで有効なプレイヤー名であることを判断するために複雑なルールがある場合、またはプレイヤー名を C++ 変数に保存する必要がある場合は、Game ModeUFUNCTION として公開するか、プロジェクト内のどこかで静的関数として公開します。ただし、名前文字列が空白ではないことだけが重要であるため、ここで ウィジェット にスクリプトを記述することができます。

  6. Text Box が空白でない場合に限りボタンを有効にするために、Text Box のテキストを文字列に変換し、その後文字列の長さがゼロ以上であることを確認します。ロジックはこのように表示されます。

    PlayGameButtonEnableFunction.png

  7. ボタンをもう一つ追加して、メニューをキャンセルしたり、メニューへ戻れるようにしましょう。メイン メニューの [Play Game] ボタンと同じですが、左上ではなく右下の隅に対して相対的な位置に置かれます。これを実現するためには、Button 用の [Details (詳細)] パネル[Anchors (アンカー)] ドロップダウン メニューをクリックして、ポップアップ メニューから適切なグラフィック表示を検索します。

    • [MainMenuButton] の名前を変更します。

    • Position を ( -400, -200) に設定します。

    • Size を 200x100 に設定します。

    SelectAnchor.png

    右下隅にアンカーを配置するとサイズと位置の値を変えても変わりません。そのため、スクリーン上に存在するためには位置を負の値にする必要があります。サイズの値は正のままです。

  8. OnClicked Event を再度追加して、新規ボタンにスクリプトを追加していきます。Main Menu Button は単に Main Menu Widget を再ロードするだけですが、Play Game Button は ChangeMenuWidget 関数の呼び出しに新規ウィジェットを使用せずにメニュー全体を非アクティブにします。実際のクラスやアセット名の代わりに、Select Class と表示して表されます。

    NewGameButtonBPs.png

    Play Game Button でメニューを非アクティブにしたら、ゲーム内でそれ以上何かをすることはできません。この時点で、一般的に最初のレベルをロードし、紹介カットシーンを再生、または ポーン をスポーンしたり、所有したりします。

  9. だいたい以下の 2 つの画面のようになるはずです。

    FinalScreen.png

    FinalScreen2.png

完成コード

HowTo_UMG.Build.cs

// Copyright 1998-2017 Epic Games, Inc. All Rights Reserved.

using UnrealBuildTool;

public class HowTo_UMG :ModuleRules
{
    public HowTo_UMG(TargetInfo Target)
    {
        PublicDependencyModuleNames.AddRange(new string[] { "Core", "CoreUObject", "Engine", "InputCore", "UMG" });

        //PrivateDependencyModuleNames.AddRange(new string[] {  });

        // Uncomment if you are using Slate UI (スレート UI を使用している場合はコメント行を外します)
        PrivateDependencyModuleNames.AddRange(new string[] { "Slate", "SlateCore" });

        // Uncomment if you are using online features (オンライン機能を使用している場合はコメント行を外します)
        // PrivateDependencyModuleNames.Add("OnlineSubsystem");
        // if ((Target.Platform == UnrealTargetPlatform.Win32) || (Target.Platform == UnrealTargetPlatform.Win64))
        // {
        //      if (UEBuildConfiguration.bCompileSteamOSS == true)
        //      {
        //          DynamicallyLoadedModuleNames.Add("OnlineSubsystemSteam");
        //      }
        // }
    }
}

HowTo_UMGGameMode.h

// Copyright 1998-2017 Epic Games, Inc. All Rights Reserved.

#pragma once

#include "Blueprint/UserWidget.h"
#include "GameFramework/GameModeBase.h"
#include "HowTo_UMGGameMode.generated.h"

/**
    * 
    */
UCLASS()
class HOWTO_UMG_API AHowTo_UMGGameMode : public AGameModeBase
{
    GENERATED_BODY()

public:
    /** 現在のメニューウィジェットを取り除き、指定されたクラスがあればそこから新しいものを作成します */
    UFUNCTION(BlueprintCallable, Category = "UMG Game")
    void ChangeMenuWidget(TSubclassOf<UUserWidget> NewWidgetClass);

protected:
    /** Called when the game starts. (ゲーム開始時に呼び出されます) */
    virtual void BeginPlay() override;

    /** ゲーム開始時にメニューとして使用するウィジェット クラスです */
    UPROPERTY(EditAnywhere, BlueprintReadOnly, Category = "UMG Game")
    TSubclassOf<UUserWidget> StartingWidgetClass;

    /** メニューとして使用するウィジェット インスタンスです */
    UPROPERTY()
    UUserWidget* CurrentWidget;
};

HowTo_UMGGameMode.cpp

// Copyright 1998-2017 Epic Games, Inc. All Rights Reserved.

#include "HowTo_UMG.h"
#include "HowTo_UMGGameMode.h"

void AHowTo_UMGGameMode::BeginPlay()
{
    Super::BeginPlay();
    ChangeMenuWidget(StartingWidgetClass);
}

void AHowTo_UMGGameMode::ChangeMenuWidget(TSubclassOf<UUserWidget> NewWidgetClass)
{
    if (CurrentWidget != nullptr)
    {
        CurrentWidget->RemoveFromViewport();
        CurrentWidget = nullptr;
    }
    if (NewWidgetClass != nullptr)
    {
        CurrentWidget = CreateWidget<UUserWidget>(GetWorld(), NewWidgetClass);
        if (CurrentWidget != nullptr)
        {
            CurrentWidget->AddToViewport();
        }
    }
}

HowTo_UMGPlayerController.h

// Copyright 1998-2016 Epic Games, Inc. All Rights Reserved.

#pragma once

#include "GameFramework/PlayerController.h"
#include "HowTo_UMGPlayerController.generated.h"

/**
    * 
    */
UCLASS()
class HOWTO_UMG_API AHowTo_UMGPlayerController : public APlayerController
{
    GENERATED_BODY()

public:
    virtual void BeginPlay() override;
};

HowTo_UMGPlayerController.cpp

// Copyright 1998-2016 Epic Games, Inc. All Rights Reserved.

#include "HowTo_UMG.h"
#include "HowTo_UMGPlayerController.h"

void AHowTo_UMGPlayerController::BeginPlay()
{
    Super::BeginPlay();
    SetInputMode(FInputModeGameAndUI());
}