Timeline の作成

このドキュメントは、ブループリントで **Timeline** ノードを作成する方法の概要です。

実装方法を選んでください。

Blueprints

C++

タイムラインを作成する

以下の手順に従って、Actor ブループリントに独自の Timeline Component を作成することができます。

  1. コンテンツ ブラウザ を開いて、[Add+] > [Blueprint Class] の順に選択し、BP_TimelineActor という名前の Actor Blueprint を新規作成します。[Pick Parent Class] ダイアログが表示されます。

    ![](01_AddBPActorClass.png)

  2. クラス デフォルトで、イベント グラフ を右クリックし、[Blueprint Context Menu] を表示して [Add Timeline (タイムラインを追加)] を検索して選択します。

    ![](02_AddTimelineNode.png)

イベントグラフに新しい Timeline ノードが表示されます。

![](03_TimelineNode.png)

Blueprint クラスに Timeline が追加されると、[My Blueprint] タブのリストで確認することができます。

![](04_TimeLineComponent.png)

Timeline Variables

作成された Timeline は、[My Blueprint] タブで変数として利用できるようになっています。それにより Timeline コンポーネントに参照が提供されるので、Timeline ノードを利用しなければいけない時に特に便利です。これらのノードは、再生レートなどの Timeline の一定の機能へアクセスするために存在します。

![](05_GetTimeLineNode.png)

たとえば、 Get Timeline 0 変数を使って、そのタイムラインの現在の Play Rate 値をクエリします。

![](06_BPScript1.png)

これらの様々なノードを使って、値をクエリし Timeline ノードの動作を制御することができます。利用可能な Timeline ノードおよびその機能の一覧は、「Timeline ノード」をご覧ください。

Timeline イベントを作成する

Timeline イベント は、Timeline Component にイベントを処理する機能を提供します。以下の手順は、独自のイベントを追加する方法の例です。

  1. BP_TimelineActor を開いて、Begin Play実行ピン を引き出して、Add Timeline を検索して選択します。

    Copy Node Graph

    ![](07_BPScript2.png)

  2. Timeline_0 ノードの Finished ピンを引き出して Print String ノードを検索して追加します。テキスト フィールド に文字列「Timeline Finished」を入力します。

    Copy Node Graph

    ![](08_BPScript3.png)

  3. 最終的なブループリント スクリプトは次のようになります。

    Copy Node Graph

    ![](09_BPScript4.png)

  4. [Compile (コンパイル)][Save (保存)] ボタンを順にクリックします。

    ![](10_SaveCompileButton.png)

  5. ブループリント エディタ を閉じて、コンテンツ ブラウザ に移動します。BP_TimelineActor を見つけて レベル へドラッグします。

    ![](11_DragBPTimelineActor.png)

  6. [Play (プレイ)] ボタンをクリックして結果を確認します。

    ![](12_FinalResult.png)

    デフォルトのタイムライン 長 である 5 秒後に、テキスト "Timeline Finished" がビューポートの左上隅に表示されます。

タイムラインの名前を変更する

ブループリントで複数のタイムラインを使用する場合は、それぞれのタイムラインに適切な名前を付けることが重要です。すべてのタイムラインはデフォルトでは、 "Timeline_n" (n は連番) という名前になります。タイムラインの名前変更は、[Graph] タブまたは [My Blueprint] タブ内でタイムラインを右クリックするか、[Rename (名前を変更)] を選択します。

![](13_Renaming.png)

Opening the Timeline Editor

タイムラインの作成は、何かパフォーマンスで設定しないと意味がないかもしれません。詳細は「タイムラインの編集ページ」を参照してください。

タイムラインを作成する

以下の手順に従って、Actor クラスに独自の Timeline Component を作成およびインスタンス化することができます。

  1. C++ クラス フォルダ へ移動し [Add+ (追加+)] をクリックします。ドロップダウン メニューから [New C++ class] を選択します。

    ![](01_AddCppActorClass.png)

  2. アクタ クラスを 親クラス として選択します。

    クリックしてフルサイズで表示

  3. 作成さしたアクタに「Timeline Actor」という名前をつけます。

    クリックしてフルサイズで表示

  4. TimelineActor.h」ファイルへ移動し、以下の TimelineComponent クラスをインクルードします。

    TimelineActor.h

    #include "Components/TimelineComponent.h"
  5. TimelineActor クラス定義内で以下のクラス宣言を実装します。

    TimelineActor.h

    protected:
    
        UPROPERTY(EditAnywhere, BlueprintReadWrite)
        UTimelineComponent* ExampleTimelineComp;

    このコード サンプルでは、プロパティ指定子タグ、EditAnywhereBlueprintReadWrite を使用します。

  6. TimelineActor.cpp」ファイルへ移動し、以下のコードを TimelineActor コンストラクタ`ATimelineActor::ATimelineActor()` に追加します。

    TimelineActor.cpp

    ATimelineActor::ATimelineActor()
    {
        // このアクターは、毎フレームTick()を呼び出すように設定します。必要ない場合は、パフォーマンスを向上させるためにこれをオフにすることができます。
        PrimaryActorTick.bCanEverTick = true;
        ExampleTimelineComp = CreateDefaultSubobject<UTimelineComponent>(TEXT("TimelineComponent"));
    }
  7. コードを コンパイル します。

  8. C++ クラス フォルダ へ移動し TimelineActor を右クリックし、TimelineActor クラスからブループリントを派生させ、「Bp_TimelineActor」と名前を付けます。

    ![](04_CreateBPBased.png)

  9. TimelineActor ブループリントが作成されると、Class Defaults を表示することができます。 [Components] タブで Example Timeline Component を確認することができます。

    ![](05_ExampleTimelineComp.png)

作業中のコード

TimelineActor.h

#pragma once
#include "Components/TimelineComponent.h"
#include "CoreMinimal.h"
#include "GameFramework/Actor.h"
#include "TimelineActor.generated.h"

UCLASS()
class CPPTIMELINE_API ATimelineActor : public AActor
{
    GENERATED_BODY()
public:

    // このアクタのプロパティのデフォルト値を設定する
    ATimelineActor();

protected:
    // ゲームが開始またはスポーンされると呼び出される
    virtual void BeginPlay() override;

public:
    // フレームごとに呼び出される
    virtual void Tick(float DeltaTime) override;

protected:
    UPROPERTY(EditAnywhere, BlueprintReadWrite)
    UTimelineComponent* ExampleTimelineComp;
};

TimelineActor.cpp

#include "TimelineActor.h"

// デフォルト値を設定する
ATimelineActor::ATimelineActor()
{
    // このアクターは、毎フレームTick()を呼び出すように設定します。必要ない場合は、パフォーマンスを向上させるためにこれをオフにすることができます。
    PrimaryActorTick.bCanEverTick = true;
    ExampleTimelineComp = CreateDefaultSubobject<UTimelineComponent>(TEXT("TimelineComponent"));
}

// ゲームが開始またはスポーンされると呼び出される
void ATimelineActor::BeginPlay()
{
    Super::BeginPlay();
}

// フレームごとに呼び出される
void ATimelineActor::Tick(float DeltaTime)
{
    Super::Tick(DeltaTime);
}

タイムライン変数

UProperty Specifiers 指定子を使って C++ にタイムライン コンポーネントを作成すると、[Component] タブで変数として使用することができるようになります。デザイナーがブループリント スクリプティングを介して TimelineComponent へのイタレーションを継続したい場合、 これは便利な場合があります。

ExamplePlayRate.png

上の画像では、ネイティブ C++ タイムライン変数を使って、ブループリントで Timeline の Current Play Rate 値を取得します。

利用可能な Timeline ノード、およびその機能の一覧は、「Timeline ノード」を参照してください。

FTimeLineEvent を作成する

タイムライン イベント (FOnTimelineEvent) は、Timeline Component にイベントを処理する機能を提供する 動的デリゲート です。 以下の手順に従って、使用する FTimeLineEvent の完成した機能に結合される FTimeLineEvent を作成します。

  1. TimelineActor.h」ファイルの クラス定義 から、以下を宣言します。

    TimelineActor.h

    protected:
    
        //Finished イベントを処理する関数のデリゲートシグネチャです。
    
        FOnTimelineEvent TimelineFinishedEvent;
        UFUNCTION()
        void TimelineFinishedFunction();
  2. Navigate to TimelineActor.cpp and implement the following code:

    TimelineActor.cpp

     void ATimelineActor::TimelineFinishedFunction()
     {
        UE_LOG(LogTemp, Warning, TEXT("Finished Event Called."));
     }
  3. Navigate to ATimelineActor::BeginPlay() method, and implement the following code:

    TimelineActor.cpp

     // ゲームが開始またはスポーンされると呼び出される
    
    void ATimelineActor::BeginPlay()
    {
        Super::BeginPlay();
    TimelineFinishedEvent.BindUFunction(this, FName("TimelineFinishedFunction"));
    
        ExampleTimelineComp->SetTimelineFinishedFunc(TimelineFinishedEvent);
        ExampleTimelineComp->PlayFromStart();
    }

    これで TimelineFinished イベントをカスタムした TimelineFinished 関数に結合することができました。

  4. コードをコンパイルします。エディタ を開いて、コンテンツ ブラウザ に移動します。BP_TimelineActor を見つけて レベル へドラッグします。

    ![image alt text](07_DragBPTimelineActor.png)

  5. [Play (プレイ)] ボタンを押します。[Output Log] ウィンドウに以下のメッセージが表示されます。

    ![image alt text](08_OutputMessage.png)

    完成したコード

TimelineActor.h

#pragma once
#include "Components/TimelineComponent.h"
#include "CoreMinimal.h"
#include "GameFramework/Actor.h"
#include "TimelineActor.generated.h"

UCLASS()
class CPPTIMELINE_API ATimelineActor : public AActor
{
    GENERATED_BODY()
    public:

    // このアクタのプロパティのデフォルト値を設定する
    ATimelineActor();

protected:
    // ゲームが開始またはスポーンされると呼び出される
    virtual void BeginPlay() override;

public: 
    // フレームごとに呼び出される
    virtual void Tick(float DeltaTime) override;

protected:
    UPROPERTY(EditAnywhere, BlueprintReadWrite)
    UTimelineComponent* ExampleTimelineComp;

protected:

    //Delegate signature for the function which will handle our Finished event.
    FOnTimelineEvent TimelineFinishedEvent;

    UFUNCTION()
    void TimelineFinishedFunction();
};

TimelineActor.cpp

#include "TimelineActor.h"

// Sets default values
ATimelineActor::ATimelineActor()
{
    // このアクターは、毎フレームTick()を呼び出すように設定します。必要ない場合は、パフォーマンスを向上させるためにこれをオフにすることができます。
    PrimaryActorTick.bCanEverTick = true;
    ExampleTimelineComp = CreateDefaultSubobject<UTimelineComponent>(TEXT("TimelineComponent"));
}

//  ゲームが開始またはスポーンされると呼び出される
    void ATimelineActor::BeginPlay()

{
    Super::BeginPlay();

    TimelineFinishedEvent.BindUFunction(this, FName("TimelineFinishedFunction"));
    ExampleTimelineComp->SetTimelineFinishedFunc(TimelineFinishedEvent);
    ExampleTimelineComp->PlayFromStart();
}

// フレームごとに呼び出される
void ATimelineActor::Tick(float DeltaTime)
{
    Super::Tick(DeltaTime);
}

void ATimelineActor::TimelineFinishedFunction()
{
    UE_LOG(LogTemp, Warning, TEXT("Finished Event Called."));
}
Unreal Engine のドキュメントを改善するために協力をお願いします!どのような改善を望んでいるかご意見をお聞かせください。
調査に参加する
キャンセル