Code Timelines Plugin Documentation

In case you’re reading this page then you are likely interested in purchasing my Code Timelines Plugin for Unreal Engine 4, so thank you for that! This plugin offers a fast and easy way to play any timeline in your c++ code. Moreover, you can assign your own functions that execute in each tick of the active timeline.

Documentation Version: 1

Latest Plugin Version: 1

This document covers the functionality of the plugin. Specifically, it covers the following topics:

Integrating the plugin in your project
Supported Curves
Plugin Usage for all the available Curves
How to add multiple curves in a single timeline
How to execute your own code in each timeline tick

[button size=”big” color=”black” link=”https://github.com/orfeasel/Code-Timelines”]See sample uses of the plugin on my github repo[/button]

Here is a video demonstrating the use of the plugin:

Integrating the plugin in your project

After the installation of the plugin, make sure to add the following line on your .Build.cs file:

PublicDependencyModuleNames.AddRange(new string[] { "CppTimelinePlugin" });

This step is essential so your project can find the header files that come inside the plugin.

Supported Types

The supported curve types that you can play with this plugin are the following:

FloatCurve
VectorCurve
LinearColorCurve

In the following section we will see how to use the plugin with each curve.

1. Plugin Usage

All the functionality of the plugin resides in the TimelineHandleComponent.h. You need to include this file before the .generated.h include in order to handle any timelines.

In order to play any curve you need to do the following steps:

Declare the component in your class.
Add a curve to the component.
Create a function in your class that will fire in each timeline tick.

The previous steps are necessary in all use cases of the plugin. Let’s explore how easy it is to play any timeline!

1.1 Plugin Usage – FloatCurves

In this section, we’re going to see how to play a timeline with a float curve and interpolate between different types based on our needs. In the following code, I have created an Actor with the following declarations in its header file:

private:

	/** The function that fires in every timeline tick */
	UFUNCTION()
	void TickTimeline(float NewFloatValue);

protected:

	/** The curve we want to play */
	UPROPERTY(EditAnywhere)
	UCurveFloat* FloatCurve;

	/** The plugin's component that handles all the timelines */
	UPROPERTY(VisibleAnywhere)
	UTimelineHandleComponent* TimelineHandleComp;

private:

/** The function that fires in every timeline tick */

UFUNCTION()

void TickTimeline(float NewFloatValue);

protected:

/** The curve we want to play */

UPROPERTY(EditAnywhere)

UCurveFloat* FloatCurve;

/** The plugin's component that handles all the timelines */

UPROPERTY(VisibleAnywhere)

UTimelineHandleComponent* TimelineHandleComp;

Inside the constructor of your actor, create the TimelineHandleComponent using the following syntax:

TimelineHandleComp = CreateDefaultSubobject<UTimelineHandleComponent>(FName("TimelineHandleComp"));

Then, override the BeginPlay function as follows:

void AFloatActor::BeginPlay()
{
	Super::BeginPlay();

	//Add a new curve to the timeline handle comp
	TimelineHandleComp->AddCurve(FloatCurve);

	//Set an initial and target value. These values are used in the interpolation that the component
	//handles by itself. In this case, we're going to "elevate" our actor by 100 units
	TimelineHandleComp->SetInitialAndTargetValues(GetActorLocation().Z, GetActorLocation().Z + 100);

	//Bind the function that gets called in each timeline tick
	TimelineHandleComp->OnFloatCurveFloatTickFunction.AddDynamic(this, &AFloatActor::TickTimeline);

	//Play the timeline from start
	TimelineHandleComp->PlayTimelineFromStart();
}

void AFloatActor::BeginPlay()

{

Super::BeginPlay();

//Add a new curve to the timeline handle comp

TimelineHandleComp->AddCurve(FloatCurve);

//Set an initial and target value. These values are used in the interpolation that the component

//handles by itself. In this case, we're going to "elevate" our actor by 100 units

TimelineHandleComp->SetInitialAndTargetValues(GetActorLocation().Z, GetActorLocation().Z + 100);

//Bind the function that gets called in each timeline tick

TimelineHandleComp->OnFloatCurveFloatTickFunction.AddDynamic(this, &AFloatActor::TickTimeline);

//Play the timeline from start

TimelineHandleComp->PlayTimelineFromStart();

}

Then, provide the following implementation of the TickTimeline function:

void AFloatActor::TickTimeline(float NewFloatValue)
{
	FVector NewLoc = GetActorLocation();
	NewLoc.Z = NewFloatValue;

	SetActorLocation(NewLoc);
}

void AFloatActor::TickTimeline(float NewFloatValue)

{

FVector NewLoc = GetActorLocation();

NewLoc.Z = NewFloatValue;

SetActorLocation(NewLoc);

}

That’s the whole code you need to play any timeline! The NewFloatValue is the interpolated value between the values we’ve entered in line 10 inside the BeginPlay function!

Compile your code, assign a curve to your Blueprint and play in the Editor to see your actor rise!

1.2 Plugin Usage – Available Interpolation for Float Curves

In the previous section, we saw how to interpolate between float points and call our own function that takes the interpolated float as a parameter.

The plugin contains three more callbacks that you can use in your code:

OnFloatCurveVectorTickFunction, which is the delegate that takes a function with a FVector parameter.
OnFloatCurveRotatorTickFunction, which is the delegate tha takes a function with a FRotator parameter.
OnFloatCurveQuatTickFunction, which is the delegate that takes a function with a FQuat parameter.

Here is an example code for each callback:

//Assigning FVector values for interpolation
TimelineHandleComp->SetInitialAndTargetValues(GetActorLocation(), GetActorLocation() + GetActorForwardVector() *100);

//Binding...
TimelineHandleComp->OnFloatCurveVectorTickFunction.AddDynamic(this, &AVectorActor::MoveActor);

//-------------------------------------------------------------------------------------------------------------------

// MoveActor Implementation - Moves the actor in each timeline tick
The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.
void AVectorActor::MoveActor(FVector NewLocation)
{
	SetActorLocation(NewLocation);
}

//Assigning FVector values for interpolation

TimelineHandleComp->SetInitialAndTargetValues(GetActorLocation(), GetActorLocation() + GetActorForwardVector() *100);

//Binding...

TimelineHandleComp->OnFloatCurveVectorTickFunction.AddDynamic(this, &AVectorActor::MoveActor);

//-------------------------------------------------------------------------------------------------------------------

// MoveActor Implementation - Moves the actor in each timeline tick

The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.

void AVectorActor::MoveActor(FVector NewLocation)

{

SetActorLocation(NewLocation);

}

//Assigning FRotator values for interpolation
TimelineHandleComp->SetInitialAndTargetValues(GetActorRotation(), TargetValue);

//Function binding...
TimelineHandleComp->OnFloatCurveRotatorTickFunction.AddDynamic(this, &ARotatorActor::RotateActor);

//-----------------------------------------------------------------------------------------------

// RotateActor Implementation - Rotates the actor in each timeline tick
The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.
void ARotatorActor::RotateActor(FRotator NewRotator)
{
	SetActorRotation(NewRotator);
}

//Assigning FRotator values for interpolation

TimelineHandleComp->SetInitialAndTargetValues(GetActorRotation(), TargetValue);

//Function binding...

TimelineHandleComp->OnFloatCurveRotatorTickFunction.AddDynamic(this, &ARotatorActor::RotateActor);

//-----------------------------------------------------------------------------------------------

// RotateActor Implementation - Rotates the actor in each timeline tick

The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.

void ARotatorActor::RotateActor(FRotator NewRotator)

{

SetActorRotation(NewRotator);

}

//Assigning FQuat values for interpolation
TimelineHandleComp->SetInitialAndTargetValues(InitialQuat, TargetQuat);

//Function binding...
TimelineHandleComp->OnFloatCurveQuatTickFunction.AddDynamic(this, &ARotatorActor::RotateActor);

//-----------------------------------------------------------------------------------------------

// RotateActor Implementation - Rotates the actor in each timeline tick
The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.
void ARotatorActor::RotateActor(FQuat NewQuat)
{
	SetActorRotation(NewQuat);
}

//Assigning FQuat values for interpolation

TimelineHandleComp->SetInitialAndTargetValues(InitialQuat, TargetQuat);

//Function binding...

TimelineHandleComp->OnFloatCurveQuatTickFunction.AddDynamic(this, &ARotatorActor::RotateActor);

//-----------------------------------------------------------------------------------------------

// RotateActor Implementation - Rotates the actor in each timeline tick

The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.

void ARotatorActor::RotateActor(FQuat NewQuat)

{

SetActorRotation(NewQuat);

}

Tip: Use the FQuat implementation when rotating in 3 Axis to avoid gimbal lock.

1.2.1 Plugin Usage – Same values warning

In case you’ve assigned the same initial and target values by mistake, the plugin will report the following warning inside your editor:

To solve this issue, assign different values inside the SetInitialAndTargetValues function.

1.3 Plugin Usage – Vector Curves

To play a Vector Curve in the TimelineHandleComponent, create the following property in your actor:

/** Vector Curve reference */ 
UPROPERTY(EditAnywhere) 
UCurveVector* VectorCurve;

/** Vector Curve reference */

UPROPERTY(EditAnywhere)

UCurveVector* VectorCurve;

Then, inside the begin play function, type in the following code:

//This code goes into the begin play...

//Adding the vector curve in the component
TimelineHandleComp->AddCurve(VectorCurve);

//Binding the function that will get called in each timeline tick
TimelineHandleComp->OnVectorCurveTickFunction.AddDynamic(this, &AVectorCurveActor::MoveActor);

//Play the timeline from start
TimelineHandleComp->PlayTimelineFromStart();

//--------------------------------------------------------------------------------------------

//The implementation of the bound function. The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.
void AVectorCurveActor::MoveActor(FVector NewVectorValue)
{
	SetActorLocation(NewVectorValue);
}

//This code goes into the begin play...

//Adding the vector curve in the component

TimelineHandleComp->AddCurve(VectorCurve);

//Binding the function that will get called in each timeline tick

TimelineHandleComp->OnVectorCurveTickFunction.AddDynamic(this, &AVectorCurveActor::MoveActor);

//Play the timeline from start

TimelineHandleComp->PlayTimelineFromStart();

//--------------------------------------------------------------------------------------------

//The implementation of the bound function. The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.

void AVectorCurveActor::MoveActor(FVector NewVectorValue)

{

SetActorLocation(NewVectorValue);

}

1.4 Plugin Usage – LinearColor Curves

To play a Linear Curve in the TimelineHandleComponent, create the following property in your actor:

/** LinearColor Curve reference */
UPROPERTY(EditAnywhere)
UCurveLinearColor* LinearColorCurve;

/** LinearColor Curve reference */

UPROPERTY(EditAnywhere)

UCurveLinearColor* LinearColorCurve;

Then, inside the begin play function, type in the following code:

//This section goes into the BeginPlay

//Adding the curve
TimelineHandleComp->AddCurve(LinearColorCurve);

//Binding the desired function
TimelineHandleComp->OnLinearColorCurveTickFunction.AddDynamic(this, &ALinearColorActor::ChangeColor);

//-----------------------------------------------------------------------------------------------------

//ChangeColor function implementation. The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.

void ALinearColorActor::ChangeColor(FLinearColor NewColorValue)
{
	//Get the 1st material from the static mesh of the actor
	UMaterialInstanceDynamic* Mat = SM->CreateAndSetMaterialInstanceDynamic(0);

	//Change the parameter's color to the new value. This line assumes that your material contains
	//a vector property, named BaseColor
	Mat->SetVectorParameterValue(FName("BaseColor"), NewColorValue);
}

//This section goes into the BeginPlay

//Adding the curve

TimelineHandleComp->AddCurve(LinearColorCurve);

//Binding the desired function

TimelineHandleComp->OnLinearColorCurveTickFunction.AddDynamic(this, &ALinearColorActor::ChangeColor);

//-----------------------------------------------------------------------------------------------------

//ChangeColor function implementation. The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.

void ALinearColorActor::ChangeColor(FLinearColor NewColorValue)

{

//Get the 1st material from the static mesh of the actor

UMaterialInstanceDynamic* Mat = SM->CreateAndSetMaterialInstanceDynamic(0);

//Change the parameter's color to the new value. This line assumes that your material contains

//a vector property, named BaseColor

Mat->SetVectorParameterValue(FName("BaseColor"), NewColorValue);

}

1.5 Plugin Usage – Play options

The plugin offers the following playing options / functions:

//Play the timeline from start
TimelineHandleComp->PlayTimelineFromStart();

//Play the timeline from start and set a looping function as well
TimelineHandleComp->PlayTimelineFromStart(true);

//Set a new play time in the timeline
TimelineHandleComp->SetNewPlayTime(5.f); //where 5 is the new play time

//Play the timeline from the current point
//This function acts the same with the PlayTimelineFromStart if the current point is set to 0
TimelineHandleComp->Play();

//Stop the timeline
TimelineHandleComp->StopTimeline();

//Reverse the timeline from the current point
TimelineHandleComp->ReverseTimeline();

//Reverse the timeline from the end
TimelineHandleComp->ReverseTimelineFromEnd();

//Play the timeline from start

TimelineHandleComp->PlayTimelineFromStart();

//Play the timeline from start and set a looping function as well

TimelineHandleComp->PlayTimelineFromStart(true);

//Set a new play time in the timeline

TimelineHandleComp->SetNewPlayTime(5.f); //where 5 is the new play time

//Play the timeline from the current point

//This function acts the same with the PlayTimelineFromStart if the current point is set to 0

TimelineHandleComp->Play();

//Stop the timeline

TimelineHandleComp->StopTimeline();

//Reverse the timeline from the current point

TimelineHandleComp->ReverseTimeline();

//Reverse the timeline from the end

TimelineHandleComp->ReverseTimelineFromEnd();

1.6 Plugin Usage – Multiple Curves

You can assign multiple curves in a single timeline. To do so, declare two curves in your header file:

UPROPERTY(EditAnywhere)
UCurveFloat* FloatCurve;

UPROPERTY(EditAnywhere)
UCurveVector* VectorCurve;

UPROPERTY(EditAnywhere)

UCurveFloat* FloatCurve;

UPROPERTY(EditAnywhere)

UCurveVector* VectorCurve;

Then, inside the begin play:

//Adding the float curve...
TimelineHandleComp->AddCurve(FloatCurve);

//Adding the vector curve...
TimelineHandleComp->AddCurve(VectorCurve);

//Setting up the inital and target values for interpolation in the float curve
TimelineHandleComp->SetInitialAndTargetValues(GetActorRotation(), GetActorRotation() + FRotator(180,0,180));

//Binding the functions that will get called in each timeline tick
TimelineHandleComp->OnFloatCurveVectorTickFunction.AddDynamic(this, &AVectorActor::RotateActor);
TimelineHandleComp->OnVectorCurveTickFunction.AddDynamic(this, &AVectorActor::MoveActor);

//Play the timeline with the bound curves from start
TimelineHandleComp->PlayTimelineFromStart();

//Adding the float curve...

TimelineHandleComp->AddCurve(FloatCurve);

//Adding the vector curve...

TimelineHandleComp->AddCurve(VectorCurve);

//Setting up the inital and target values for interpolation in the float curve

TimelineHandleComp->SetInitialAndTargetValues(GetActorRotation(), GetActorRotation() + FRotator(180,0,180));

//Binding the functions that will get called in each timeline tick

TimelineHandleComp->OnFloatCurveVectorTickFunction.AddDynamic(this, &AVectorActor::RotateActor);

TimelineHandleComp->OnVectorCurveTickFunction.AddDynamic(this, &AVectorActor::MoveActor);

//Play the timeline with the bound curves from start

TimelineHandleComp->PlayTimelineFromStart();

Here is the implementation of the bound functions:

// RotateActor Implementation - Rotates the actor in each timeline tick
The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.
void ADummyActor::RotateActor(FRotator NewRotator)
{
	SetActorRotation(NewRotator);
}

//MoveActor Implementation - Moves the actor in each timeline tick
The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.
void ADummyActor::MoveActor(FVector NewLocation)
{
	SetActorLocation(NewLocation);
}

// RotateActor Implementation - Rotates the actor in each timeline tick

The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.

void ADummyActor::RotateActor(FRotator NewRotator)

{

SetActorRotation(NewRotator);

}

//MoveActor Implementation - Moves the actor in each timeline tick

The function MUST BE MARKED AS UFUNCTION() IN YOUR HEADER FILE.

void ADummyActor::MoveActor(FVector NewLocation)

{

SetActorLocation(NewLocation);

}

1.7 Plugin Usage – Finish Function

The plugin offers an easy way to call your own function when the timeline finishes. To do so, declare the following function in your header file:

//This goes into your header file...
//The function MUST BE MARKED AS UFUNCTION()
UFUNCTION()
void FinishedFunc();

//Implementation...
void ADummyActor::FinishedFunc()
{
	GLog->Log("Timeline Finished!");
}

//Binding the finished func...
//The first parameter is the object that contains the function
//and the second one is the function's name
TimelineHandleComp->BindTimelineFinishedFunc(this, FName("FinishedFunc"));

//This goes into your header file...

//The function MUST BE MARKED AS UFUNCTION()

UFUNCTION()

void FinishedFunc();

//Implementation...

void ADummyActor::FinishedFunc()

{

GLog->Log("Timeline Finished!");

}

//Binding the finished func...

//The first parameter is the object that contains the function

//and the second one is the function's name

TimelineHandleComp->BindTimelineFinishedFunc(this, FName("FinishedFunc"));

Thank you for reading my documentation!

In case you have any problems with my plugin, do not hesitate to contact me!