(UE4 4.20)UE4 TimeLine(UTimelineComponent)

藍圖TimeLine

在UE4中，實現一段時間內數值呈現自定義變化的功能，可以用來藍圖節點的TimeLine 功能，

如下所示：

 

雙擊TimeLine節點能定義各種自定義的數值變化曲線, X軸是時間，Y軸是值，如下所示：

UTimeLineComponent 和 UCurveFloat(或者UCurveVector, UCurveLinearColor)

那麼如何用UE4 C++實現藍圖節點的TimeLine 功能呢，我找到資料可以用UTimeLineComponent元件(不可掛載)

看原始碼：

/** 
 * TimelineComponent holds a series of events, floats, vectors or colors with associated keyframes.
 * Events can be triggered at keyframes along the timeline. 
 * Floats, vectors, and colors are interpolated between keyframes along the timeline.
 */
UCLASS(MinimalAPI)
class UTimelineComponent : public UActorComponent
{
	GENERATED_UCLASS_BODY()

private:
	/** The actual timeline structure */
	UPROPERTY(ReplicatedUsing=OnRep_Timeline)
	FTimeline	TheTimeline;

	/** True if global time dilation should be ignored by this timeline, false otherwise. */
	UPROPERTY()
	uint32 bIgnoreTimeDilation : 1;

UTimeLineComponent封裝了FTimeLine, 提供了對應於藍圖節點的各種功能(Play, PlayFromStart, Reverse等等)，看下面

	UFUNCTION(BlueprintCallable, Category="Components|Timeline")
	ENGINE_API void Play();

	/** Start playback of timeline from the start */
	UFUNCTION(BlueprintCallable, Category="Components|Timeline")
	ENGINE_API void PlayFromStart();

	/** Start playback of timeline in reverse */
	UFUNCTION(BlueprintCallable, Category="Components|Timeline")
	ENGINE_API void Reverse();

	/** Start playback of timeline in reverse from the end */
	UFUNCTION(BlueprintCallable, Category="Components|Timeline")
	ENGINE_API void ReverseFromEnd();

	/** Stop playback of timeline */
	UFUNCTION(BlueprintCallable, Category="Components|Timeline")

下面是用UTimeLineComponent 和 函式數值曲線 實現的一段演示

#pragma once

#include "CoreMinimal.h"
#include "GameFramework/Actor.h"
#include "TestActor.generated.h"
class UCurveFloat;
class UTimelineComponent;

UCLASS()
class MYPROJECT_API ATestActor : public AActor
{
	GENERATED_BODY()
	
public:	
	// Sets default values for this actor's properties
	ATestActor();

	UPROPERTY(EditAnywhere)
		UCurveFloat* CurveFloat;

	UPROPERTY()
		UTimelineComponent* timeLineComponent;

protected:
	// Called when the game starts or when spawned
	virtual void BeginPlay() override;

private:

	UFUNCTION()
	void OnTimelineCallBack(float value);

	UFUNCTION()
	void OnTimelineFinishedCallback();
	
};

 

#include "TestActor.h"
#include "Components/TimelineComponent.h"
#include "Engine/Engine.h"


// Sets default values
ATestActor::ATestActor()
{
 	// Set this actor to call Tick() every frame.  You can turn this off to improve performance if you don't need it.
	PrimaryActorTick.bCanEverTick = true;

}

// Called when the game starts or when spawned
void ATestActor::BeginPlay()
{
	Super::BeginPlay();

	timeLineComponent = NewObject<UTimelineComponent>(this);
	timeLineComponent->RegisterComponent();
	timeLineComponent->CreationMethod = EComponentCreationMethod::UserConstructionScript;
	this->BlueprintCreatedComponents.Add(timeLineComponent);
	timeLineComponent->SetIsReplicated(false);
	timeLineComponent->SetPropertySetObject(this);
	timeLineComponent->SetLooping(false);
	timeLineComponent->SetTimelineLength(5.0f);
	//timeLineComponent->SetNewTime(5.0f);
	timeLineComponent->SetTimelineLengthMode(ETimelineLengthMode::TL_TimelineLength);
	timeLineComponent->SetPlaybackPosition(0.0f, false);
	timeLineComponent->SetDirectionPropertyName(FName("TimelineDirection"));

	FOnTimelineFloat onTimelineCallBack;
	FOnTimelineEventStatic onTimelineFinishedCallback;
	onTimelineCallBack.BindUFunction(this, FName{ TEXT("OnTimelineCallBack") });
	onTimelineFinishedCallback.BindUFunction(this, FName{ TEXT("OnTimelineFinishedCallback") });
	timeLineComponent->AddInterpFloat(CurveFloat, onTimelineCallBack);
	timeLineComponent->SetTimelineFinishedFunc(onTimelineFinishedCallback);
	timeLineComponent->Play();
	
}



void ATestActor::OnTimelineCallBack(float value)
{
	GEngine->AddOnScreenDebugMessage(-1, 2.0f, FColor::Red, FString::Printf(TEXT("%f"), value));
	UE_LOG(LogTemp, Warning, TEXT("%f"), value);
}

void ATestActor::OnTimelineFinishedCallback()
{
	GEngine->AddOnScreenDebugMessage(-1, 2.0f, FColor::Red, FString("Finish"));
	UE_LOG(LogTemp, Warning, TEXT("Finish"));
}

採用的函式曲線：

我們的 TimeLine 為 5s

執行結果：

 

這裡比較注意的是 UTimeLineComponent 的 介面 SetTimelineLengthMode 對應於 藍圖Timeline 編輯曲線的  

“Use LastKeyFrame” , 其他的對應介面差不多命名都一樣。                      

 

參考資料

【1】https://wiki.unrealengine.com/Timeline_in_c%2B%2B