Choose your operating system:
Windows
macOS
Linux
実装方法を選んでください。
Blueprints
C++
このドキュメントでは、接触時にカラーが変化し、ゆっくりと消えていく Light アクタの設定方法について説明します。
この設定は、オーバーラップ トリガーとして機能する Box コンポーネントと Point Light アクタを操作する Timeline コンポーネントを含む Point Light コンポーネント を使用して行います。
Fading Light アクタを作成する
-
まずは [New (新規)] > [Games (ゲーム)] > [Blank (空白)] > [Blueprint (ブループリント)] と移動し、 「FadingLights」 という名前のプロジェクトを作成します。
-
[Add/Import (追加 / インポート)] ボタンをクリックして新規ブループリントの Actor クラスを 「BP_LightActor」 という名前で作成します。
-
コンテンツ ブラウザで BP_LightActor をダブルクリックしてブループリント エディタで開き、 [Class Defaults (クラスのデフォルト)] を開きます。
-
[Add Component (コンポーネントを追加)] をクリックしてドロップダウン メニューの [Box Collision (ボックス コリジョン)] を選択し、名前を 「OverlapCollision」 に変更します。
-
[Components (コンポーネント)] タブでオーバーラップ コリジョンを選択して [DefaultSceneRoot] にドラッグし、OverlapCollision を新規ルート コンポーネントにします。
-
[Add Component (コンポーネントを追加)] をクリックし、 「Point Light」 を検索して選択します。
-
イベント グラフ を開いてグラフを右クリックし、 ブループリントのコンテキスト メニュー から [Add Timeline (タイムラインを追加する)] を選択します。タイムラインの名前を 「PointLightTimeline」 にします。
-
[My Blueprint (マイ ブループリント)] タブに移動し、 [Variables (変数)] カテゴリの [+ Variable] ボタンをクリックして新しい Float 型の変数を追加します。この変数の名前を 「BrightnessMultiplier」 にしてコンパイルし、 [Default Value (デフォルト値)] を 「20.0」 に設定します。
-
コンパイル して 保存 します。
Brightness トラックを設定する
プレイヤーが Light アクタの Box コンポーネントの境界に重なる場合、Timeline コンポーネントでは Point Light コンポーネントの輝度の値を操作するための Float カーブが必要になります。
明るさの初期値は「5,000」で、5 秒間で「0」まで減少します。
-
PointLightTimeline ノード をダブルクリックしてタイムライン エディタを開き、Float カーブ トラックを追加します。
-
Float カーブ トラックに 「LightBrightnessFloatTrack」 という名前を付け、Shift ボタンを押しながらクリックして 2 つのキーをトラックに追加します。1 つのキーに時間の値「(0,5000)」を、もう 1 つ のキーに時間の値「(5,0)」を割り当てます。
-
出来上がった LightBrightnessFloat トラックが次のように表示されます。
Color トラックを設定する
プレイヤーが Light アクタの Box コンポーネントの境界に重なる場合、PointLight タイムラインでは Point Light コンポーネントのカラー プロパティを操作するための線形カラー カーブ トラックが必要になります。
-
タイムライン エディタ からカラー カーブ トラックを追加します。
-
新しいカラー トラックに 「LightLinearColorTrack」 という名前を付けます。
-
最初のカラー キーをダブルクリックして時間を 0 に、 RGB の値を ( R :1、 G: 0.665、 B :0.015) に変更します。
-
次のカラー キーの時間を 5 に、 RGB の値を( R :0、 G :0、 B :0) に変更します。
-
ブループリントを コンパイル して、 保存 します。
-
出来上がったカラー トラックが次のように表示されます。
作成中のブループリント
コリジョン オーバーラップ イベントと更新ロジックを作成する
Box コンポーネントには、アクタがコリジョンの境界を入力する時に TimelineComponent をトリガーする機能が必要です。
また、PointLightTimeline ではその明るさとカラーを変更するための更新ロジックが必要です。
-
BP_LightActor のブループリント エディタにある [Components (コンポーネント)] タブに移動して OverlapCollision Box コンポーネントを選択します。[Details (詳細)] パネルで [Events (イベント)] カテゴリまでスクロールして、 On Component Begin Overlap イベントの隣にある [+] アイコンをクリックします。
-
On Component Begin Overlap(OverlapCollision) ノードをドラッグして PointTimelineComponent ノードの Play ピンに接続します。
-
[Components (コンポーネント)] タブで PointLight コンポーネントを選択して イベント グラフ にドラッグします。
-
PointLight のピンをドラッグし、アクションのメニュー検索から Set Intensity を選択します。
-
PointLightTimeline ノードの Light Brightness Float Track ピンをドラッグし、アクションのメニュー検索から float * float を選択します。
-
[My Blueprint (マイ ブループリント)] タブから BrightnessMultiplier の Float 型変数をイベント グラフにドラッグします。次に Get Brightness Multiplier を選択したら、 float * float ノードに接続します。
-
Update Execution ピンを Set Intensity ノードに接続し、次に float * float ノードの結果を New Intensity の入力ピンに接続します。
-
PointLight ノードをドラッグし、アクションのメニュー検索から Set Light Color を選択します。
-
PointLightTimeline ノードの Light Linear Color Track ピンをドラッグして、 Set Light Color ノードの New Light Color ピンに接続します。次に、 Set Intensity ノードの 実行ピン を Set Light Color ノードに接続します。
-
コンパイル して 保存 します。
完成したブループリント
レベル設定
作成したコードの機能を最善の状態で実行するには、レベルからすべての光源を削除する必要があります。
-
まず、レベルに BP_LightActor のインスタンスを配置します。
-
アウトライナー に移動して Atmospheric Fog アクタを選択します。[Details] パネルから [Sun] カテゴリに移動し、[Default Brightness] の値を 「0」** に設定します。
-
ワールド アウトライナーから Sky Sphere アクタを削除します。
-
また、ワールド アウトライナーの Light Source アクタ も削除します。
-
ツールバー に移動し、 [Build (ビルド)] を選択してレベルのライティングを再ビルドします。
-
ライティングのビルドが完了すると、レベルは次の画像のようになります。
最終結果
これで、Light アクタとレベルを設定できました。 [PIE] をクリックすると観戦者のポーンの所有権が自動的に得られます。
観戦者のポーンを制御し、Light アクタの Box コンポーネントの境界に移動することができます。
Timeline コンポーネントの Play 関数がトリガーされると、ライトのカラーおよび明るさは 5 秒間で変化していきます。
このドキュメントでは、接触時にカラーが変化し、ゆっくりと消えていく Light アクタの設定方法について説明します。
この設定は、オーバーラップ トリガーとして機能する Box コンポーネントと Point Light アクタを操作する Timeline コンポーネントを含む Point Light コンポーネント を使用して行います。
Fading Light アクタを作成する
-
まずは [New (新規)] > [Games (ゲーム)] > [Blank (空白)] > [C++] と移動し、 「FadingLights」 という名前のプロジェクトを作成します。
-
C++ Class Wizard で LightActor という名前の Actor クラスを新規作成します。
-
LightActor.h
ファイルに移動して次のように宣言します。#include "Components/TimelineComponent.h"
-
次に、
LightActor
クラスの定義に次のコードを追加します。public: UPROPERTY(EditAnywhere) UCurveFloat* PointLightFloatCurve; UPROPERTY(EditAnywhere) UCurveLinearColor* PointLightColorCurve; protected: //TimelineComponent to animate the point light component. UPROPERTY(VisibleAnywhere, BlueprintReadWrite) UTimelineComponent* LightTimelineComp; //BoxComponent which will be used as our proximity overlap volume. UPROPERTY(EditAnywhere, BlueprintReadWrite) class UBoxComponent* LightOverlapVolume; UPROPERTY(EditAnywhere,BlueprintReadWrite) class UPointLightComponent* PointLightComp; //Track used for Pointlight brightness FOnTimelineFloat UpdateBrightnessTrack; //Track used for Pointlight color FOnTimelineLinearColor UpdateColorTrack; //Function to Update Light's brightness relative to UpdateBrightnessTrack UFUNCTION() void UpdateLightBrightness(float BrightnessOutput); //Function to Update Light's color relative to UpdateColorTrack UFUNCTION() void UpdateLightColor(FLinearColor ColorOutput); UPROPERTY(EditDefaultsOnly) float BrightnessMultiplier;
-
LightActor.cpp
に移動し、次のクラス ライブラリを追加します。#include "Components/BoxComponent.h" #include "Components/PointLightComponent.h"
-
ALightActor::ALightActor のコンストラクタで、次のように宣言します。
//Create our Default Components PointLightComp = CreateDefaultSubobject<UPointLightComponent>(TEXT("PointLightComp")); LightTimelineComp = CreateDefaultSubobject<UTimelineComponent>(TEXT("LightTimelineComp")); LightOverlapVolume = CreateDefaultSubobject<UBoxComponent>(TEXT("LightOverlapVolume")); //Setup our Attachments RootComponent = LightOverlapVolume; PointLightComp->AttachToComponent(LightOverlapVolume,FAttachmentTransformRules::KeepRelativeTransform); //Initialize Brightness Multiplier BrightnessMultiplier = 20.0f;
-
次に、Point Light コンポーネントの UFunction メソッドを実装します。
void ALightActor::UpdateLightBrightness(float BrightnessOutput) { PointLightComp->SetLightBrightness(BrightnessOutput * 20.0f); } void ALightActor::UpdateLightColor(FLinearColor ColorOutput) { PointLightComp->SetLightColor(ColorOutput); }
-
BeginPlay メソッドで以下のコードを追加します。
//Binding our float and color track to their respective functions UpdateBrightnessTrack.BindDynamic(this, &ALightActor::UpdateLightBrightness); UpdateColorTrack.BindDynamic(this, &ALightActor::UpdateLightColor); //If we have a float curve, bind it's graph to our update function if (PointLightFloatCurve) { LightTimelineComp->AddInterpFloat(PointLightFloatCurve, UpdateBrightnessTrack); } //If we have a linear color curve, bind it's graph to our update function if (PointLightColorCurve) { LightTimelineComp->AddInterpLinearColor(PointLightColorCurve, UpdateColorTrack); }
-
コードをコンパイルします。
-
コンテンツ ブラウザで 「C++ Classes」フォルダ に移動します。
-
LightActor クラスを右クリックして [Create Blueprint Class based on LightActor (LightActor に基づいてブループリント クラスを作成する)] を選択し、Blueprint アクタの名前を 「BP_LightActor」 にします。
BP_LightActor のクラスのデフォルトが、次のように表示されます。
Work-In-Progress Code
LightActor.h
//Copyright 1998-2021 Epic Games, Inc.All Rights Reserved.
#pragma once
#include "CoreMinimal.h"
#include "GameFramework/Actor.h"
#include "Components/TimelineComponent.h"
#include "LightActor.generated.h"
UCLASS()
class FADINGLIGHTS_API ALightActor : public AActor
{
GENERATED_BODY()
public:
// Sets default values for this actor's properties
ALightActor();
UPROPERTY(EditAnywhere)
UCurveFloat* PointLightFloatCurve;
UPROPERTY(EditAnywhere)
UCurveLinearColor* PointLightColorCurve;
protected:
// Called when the game starts or when spawned
virtual void BeginPlay() override;
//TimelineComponent to animate the point light component.
UPROPERTY(VisibleAnywhere, BlueprintReadWrite)
UTimelineComponent* LightTimelineComp;
//BoxComponent which will be used as our proximity overlap volume.
UPROPERTY(EditAnywhere, BlueprintReadWrite)
class UBoxComponent* LightOverlapVolume;
UPROPERTY(EditAnywhere,BlueprintReadWrite)
class UPointLightComponent* PointLightComp;
//Track used for Pointlight brightness
FOnTimelineFloat UpdateBrightnessTrack;
//Track used for Pointlight color
FOnTimelineLinearColor UpdateColorTrack;
//Function to Update Light's brightness relative to UpdateBrightnessTrack
UFUNCTION()
void UpdateLightBrightness(float BrightnessOutput);
//Function to Update Light's color relative to UpdateColorTrack
UFUNCTION()
void UpdateLightColor(FLinearColor ColorOutput);
UPROPERTY(EditDefaultsOnly)
float BrightnessMultiplier;
public:
// Called every frame
virtual void Tick(float DeltaTime) override;
}
LightActor.cpp
//Copyright 1998-2021 Epic Games, Inc.All Rights Reserved.
#include "LightActor.h"
#include "Components/PointLightComponent.h"
#include "Components/BoxComponent.h"
// Sets default values
ALightActor::ALightActor()
{
// Set this actor to call Tick() every frame.必要のない場合はオフにできます。パフォーマンスが改善します。
PrimaryActorTick.bCanEverTick = true;
//Create our Default Components
PointLightComp = CreateDefaultSubobject<UPointLightComponent>(TEXT("PointLightComp"));
LightTimelineComp = CreateDefaultSubobject<UTimelineComponent>(TEXT("LightTimelineComp"));
LightOverlapVolume= CreateDefaultSubobject<UBoxComponent>(TEXT("LightOverlapVolume"));
//Setup our Attachments
RootComponent = LightOverlapVolume;
PointLightComp->AttachToComponent(LightOverlapVolume,FAttachmentTransformRules::KeepRelativeTransform);}
// Called when the game starts or when spawned
void ALightActor::BeginPlay()
{
//Binding our float and color track to their respective functions
UpdateBrightnessTrack.BindDynamic(this, &ALightActor::UpdateLightBrightness);
UpdateColorTrack.BindDynamic(this, &ALightActor::UpdateLightColor);
//If we have a float curve, bind it's graph to our update function
if (PointLightFloatCurve)
{
LightTimelineComp->AddInterpFloat(PointLightFloatCurve, UpdateBrightnessTrack);
}
//If we have a linear color curve, bind it's graph to our update function
if (PointLightColorCurve)
{
LightTimelineComp->AddInterpLinearColor(PointLightColorCurve, UpdateColorTrack);
}
}
void ALightActor::UpdateLightBrightness(float BrightnessOutput)
{
PointLightComp->SetLightBrightness(BrightnessOutput * 20.0f);
}
void ALightActor::UpdateLightColor(FLinearColor ColorOutput)
{
PointLightComp->SetLightColor(ColorOutput);
}
// Called every frame
void ALightActor::Tick(float DeltaTime)
{
Super::Tick(DeltaTime);
}
コリジョン オーバーラップ イベントを作成してバインディングする
Box コンポーネントには、アクタがコリジョンの境界を入力する時に TimelineComponent をトリガーする機能が必要です。
-
LightActor.h
ファイルのクラス定義に移動し、BrightnessMultiplier
の下で次のように宣言します。UFUNCTION() void OnOverlapBegin(class UPrimitiveComponent* OverlappedComp, class AActor* OtherActor, class UPrimitiveComponent* OtherComp, int32 OtherBodyIndex, bool bFromSweep, const FHitResult& SweepResult);
-
次に、
LightActor.cpp
ファイルに移動してOnOverlapBegin
関数を実装します。void ALightActor::OnOverlapBegin(class UPrimitiveComponent* OverlappedComp, class AActor* OtherActor, class UPrimitiveComponent* OtherComp, int32 OtherBodyIndex, bool bFromSweep, const FHitResult& SweepResult) { LightTimelineComp->Play(); }
-
BeginPlay メソッドで Overlap 関数をバインドします。
//Binding our Box Component to our Light Actor's Overlap Function LightProxVolume->OnComponentBeginOverlap.AddDynamic(this, &ALightActor::OnOverlapBegin);
-
コードをコンパイルします。
完成コード
LightActor.h
// Fill out your copyright notice in the Description page of Project Settings.
#pragma once
#include "CoreMinimal.h"
#include "GameFramework/Actor.h"
#include "Components/TimelineComponent.h"
#include "LightActor.generated.h"
UCLASS()
class FADINGLIGHTS_API ALightActor : public AActor
{
GENERATED_BODY()
public:
// Sets default values for this actor's properties
ALightActor();
protected:
// Called when the game starts or when spawned
virtual void BeginPlay() override;
public:
UPROPERTY(EditAnywhere)
UCurveFloat* PointLightFloatCurve;
UPROPERTY(EditAnywhere)
UCurveLinearColor* PointLightColorCurve;
protected:
//TimelineComponent to animate the point light component.
UPROPERTY(VisibleAnywhere, BlueprintReadWrite)
UTimelineComponent* LightTimelineComp;
//BoxComponent which will be used as our proximity overlap volume.
UPROPERTY(EditAnywhere, BlueprintReadWrite)
class UBoxComponent* LightOverlapVolume;
UPROPERTY(EditAnywhere, BlueprintReadWrite)
class UPointLightComponent* PointLightComp;
//Track used for Pointlight brightness
FOnTimelineFloat UpdateBrightnessTrack;
//Track used for Pointlight color
FOnTimelineLinearColor UpdateColorTrack;
//Function to Update Light's brightness relative to UpdateBrightnessTrack
UFUNCTION()
void UpdateLightBrightness(float BrightnessOutput);
//Function to Update Light's color relative to UpdateColorTrack
UFUNCTION()
void UpdateLightColor(FLinearColor ColorOutput);
UPROPERTY(EditDefaultsOnly)
float BrightnessMultiplier;
UFUNCTION()
void OnOverlapBegin(class UPrimitiveComponent* OverlappedComp, class AActor* OtherActor, class UPrimitiveComponent* OtherComp, int32 OtherBodyIndex, bool bFromSweep, const FHitResult& SweepResult);
public:
// Called every frame
virtual void Tick(float DeltaTime) override;
};
LightActor.cpp
// Fill out your copyright notice in the Description page of Project Settings.
#include "LightActor.h"
#include "Components/BoxComponent.h"
#include "Components/PointLightComponent.h"
// Sets default values
ALightActor::ALightActor()
{
// Set this actor to call Tick() every frame.必要のない場合はオフにできます。パフォーマンスが改善します。
PrimaryActorTick.bCanEverTick = true;
//Create our Default Components
PointLightComp = CreateDefaultSubobject<UPointLightComponent>(TEXT("PointLightComp"));
LightTimelineComp = CreateDefaultSubobject<UTimelineComponent>(TEXT("LightTimelineComp"));
LightOverlapVolume = CreateDefaultSubobject<UBoxComponent>(TEXT("LightOverlapVolume"));
//Setup our Attachments
RootComponent = LightOverlapVolume;
PointLightComp->AttachToComponent(LightOverlapVolume, FAttachmentTransformRules::KeepRelativeTransform);
//Initialize Brightness Multiplier
BrightnessMultiplier = 20.0f;
}
void ALightActor::UpdateLightBrightness(float BrightnessOutput)
{
PointLightComp->SetLightBrightness(BrightnessOutput * 20.0f);
}
void ALightActor::UpdateLightColor(FLinearColor ColorOutput)
{
PointLightComp->SetLightColor(ColorOutput);
}
void ALightActor::OnOverlapBegin(class UPrimitiveComponent* OverlappedComp, class AActor* OtherActor, class UPrimitiveComponent* OtherComp, int32 OtherBodyIndex, bool bFromSweep, const FHitResult& SweepResult)
{
LightTimelineComp->Play();
}
// Called when the game starts or when spawned
void ALightActor::BeginPlay()
{
Super::BeginPlay();
//Binding our float and color track to their respective functions
UpdateBrightnessTrack.BindDynamic(this, &ALightActor::UpdateLightBrightness);
UpdateColorTrack.BindDynamic(this, &ALightActor::UpdateLightColor);
//If we have a float curve, bind it's graph to our update function
if (PointLightFloatCurve)
{
LightTimelineComp->AddInterpFloat(PointLightFloatCurve, UpdateBrightnessTrack);
}
//If we have a linear color curve, bind it's graph to our update function
if (PointLightColorCurve)
{
LightTimelineComp->AddInterpLinearColor(PointLightColorCurve, UpdateColorTrack);
}
//Binding our Box Component to our Light Actor's Overlap Function
LightOverlapVolume->OnComponentBeginOverlap.AddDynamic(this, &ALightActor::OnOverlapBegin);
}
// Called every frame
void ALightActor::Tick(float DeltaTime)
{
Super::Tick(DeltaTime);
}
Brightness トラックを設定する
プレイヤーが Light アクタの Box コンポーネントの境界に重なる場合、Timeline コンポーネントでは Point Light コンポーネントの輝度の値を操作するための Float カーブが必要になります。
明るさの初期値は「5,000」で、5 秒間で「0」まで減少します。
-
コンテンツ ブラウザ から、 [Add/Import] > [Miscellaneous] > [Curve] の順に選択します。
-
[CurveFloat] を選択してアセットの名前を 「BrightnessCurveFloat」 にします。
-
[BrightnessCurveFloat] をダブルクリックして タイムライン エディタ を開きます。
-
2 つのキーを Float カーブに追加し、1 つのキーに時間の値「(0,5000)」を、もう 1 つ のキーに時間の値「(5,0)」を割り当てます。
-
BrightnessCurveFloat を保存してから コンテンツ ブラウザ に戻り、 [BP_LightActor] をダブルクリックして [Class Defaults (クラスのデフォルト)] を開きます。
-
[Details (詳細)] パネルに移動し、 [Point Light Float Curve (ポイント ライトの Float カーブ)] のドロップダウン メニューから [Brightness Curve Float (輝度のカーブの Float)] を選択します。
-
コンパイル して 保存 します。
Color トラックを設定する
プレイヤーが Light アクタの Box コンポーネントの境界に重なる場合、PointLight タイムラインでは Point Light コンポーネントのカラー プロパティを操作するための線形カラー カーブ トラックが必要になります。
-
コンテンツ ブラウザ から、 [Add/Import] > [Miscellaneous] > [Curve] の順に選択します。
-
[CurveLinearColor] を選択してアセットの名前を 「LinearColorCurve」 にします。
-
[LinearColorCurve] をダブルクリックして タイムライン エディタ を開きます。
-
最初のカラー キーの時間の値を「0」に、RGB の値を「( R :1, G: 0.665, B :0.015)」に変更します。また、2 つ目のカラー キーの時間を「5」に、RGB の値を「( R :0, G :0, B :0)」に変更します。
-
[LinearColorCurve] を保存してからコンテンツ ブラウザに戻り、 BP_LightActor をダブルクリックして [Class Defaults] を開きます。
-
[Details] パネルに移動し、 [Point Light Float Curve] のドロップダウン メニューから [Brightness Curve Float] を選択します。
-
コンパイル して 保存 します。
レベル設定
作成したコードの機能を最善の状態で実行するには、レベルからすべての光源を削除する必要があります。
-
まず、レベルに BP_LightActor のインスタンスを配置します。
-
アウトライナー に移動して Atmospheric Fog アクタを選択します。[Details] パネルから [Sun] カテゴリに移動し、[Default Brightness] の値を 0** に設定します。
-
ワールド アウトライナーから Sky Sphere アクタを削除します。
-
また、ワールド アウトライナーの Light Source アクタ も削除します。
-
ツールバー に移動し、 [Build (ビルド)] を選択してレベルのライティングを再ビルドします。
-
ライティングのビルドが完了すると、レベルは次の画像のようになります。
最終結果
これで、Light アクタとレベルを設定できました。 [PIE] をクリックすると観戦者のポーンの所有権が自動的に得られます。
観戦者のポーンを制御し、Light アクタの Box コンポーネントの境界に移動することができます。
Timeline コンポーネントの Play 関数がトリガーされると、ライトのカラーおよび明るさは 5 秒間で変化していきます。