UE5 アセットのサムネイルを変更してみる

概要

UnrealEngine5のアセットのサムネイルについてのメモです。

更新履歴

日付	内容
2025/08/04	初版

参考

以下を参考にさせて頂きました、ありがとうございます。
[UE4]サムネで時短！

環境

Windows10
Visual Studio 2022
UnrealEngine 5.6

関連ソース

"Engine\Source\Runtime\CoreUObject\Public\UObject\Package.h"
"Engine\Source\Runtime\CoreUObject\Public\UObject\UObjectBaseUtility.h"

サムネイルのキャプチャ

アセットファイルを右クリック -> [アセットアクション] -> [サムネイルをキャプチャ] を選ぶと現在ビューポートに写っている画面をキャプチャしてサムネイルに設定できます。

以下のようになります。

サムネイル編集モード

メッシュを保持しているアセットはコンテンツブラウザの右上の設定から[サムネイル編集モード]のチェックを入れると3D環境のサムネイルをドラッグして編集することができます。

回転/拡大縮小などができます。見やすいように調整すると良いかと思います。

任意の画像ファイルをサムネイルにする

任意の画像ファイルをサムネイルとして設定もできます。パッケージからサムネイルマップにアクセスして差し替えるようです。以下サンプルコード

サンプルコード

#include "IImageWrapper.h"
#include "IImageWrapperModule.h"
#include "Modules/ModuleManager.h"
#include "Misc/FileHelper.h"
#include "Misc/ObjectThumbnail.h"
#include "UObject/Package.h"
#include "AssetRegistry/AssetRegistryModule.h"

bool SetAssetThumbnailFromImage(UObject* _TargetAsset, const FString& _ImageFilePath)
{
    if (!_TargetAsset){
        return false;
    }

    // ファイル読み込み
    TArray<uint8> FileData;
    if (!FFileHelper::LoadFileToArray(FileData, *_ImageFilePath)){
        UE_LOG(LogTemp, Error, TEXT("Failed to load image file: %s"), *_ImageFilePath);
        return false;
    }

    // 画像デコード
    IImageWrapperModule& ImageWrapperModule = FModuleManager::LoadModuleChecked<IImageWrapperModule>("ImageWrapper");
    EImageFormat _ImageFormat = ImageWrapperModule.DetectImageFormat(FileData.GetData(), FileData.Num());
    if (_ImageFormat == EImageFormat::Invalid){
        UE_LOG(LogTemp, Error, TEXT("Invalid image format: %s"), *_ImageFilePath);
        return false;
    }

    TSharedPtr<IImageWrapper> _ImageWrapper = ImageWrapperModule.CreateImageWrapper(_ImageFormat);
    if (!_ImageWrapper.IsValid() || !_ImageWrapper->SetCompressed(FileData.GetData(), FileData.Num())){
        UE_LOG(LogTemp, Error, TEXT("Failed to decode image: %s"), *_ImageFilePath);
        return false;
    }

    TArray<uint8> _UncompressedRGBA;
    if (!_ImageWrapper->GetRaw(ERGBFormat::RGBA, 8, _UncompressedRGBA)){
        UE_LOG(LogTemp, Error, TEXT("Failed to get raw RGBA data: %s"), *_ImageFilePath);
        return false;
    }

    int32 _Width = _ImageWrapper->GetWidth();
    int32 _Height = _ImageWrapper->GetHeight();

    // サムネイル作成
    FObjectThumbnail _NewThumbnail;
    _NewThumbnail.SetImageSize(_Width, _Height);
    _NewThumbnail.AccessImageData() = MoveTemp(_UncompressedRGBA);

    // パッケージ取得
    UPackage* _Package = _TargetAsset->GetOutermost();
    if (!_Package){
        return false;
    }

	// サムネイルマップがないときの対処
	if (!_Package->HasThumbnailMap()){
		FThumbnailMap _Map;
		_Package->SetThumbnailMap(MakeUnique<FThumbnailMap>(_Map));
	}

    // サムネイル登録
    FThumbnailMap& ThumbnailMap = _Package->AccessThumbnailMap();
    ThumbnailMap.Add(FName(_TargetAsset->GetFullName()), _NewThumbnail);

    // 更新
    _Package->MarkPackageDirty();
    _TargetAsset->PostEditChange();
    _TargetAsset->Modify();
    _TargetAsset->MarkPackageDirty();

    return true;
}

使用するには以下のようになります。 EditorUtilityWidget 等を使ってインターフェイスを整えたり、コマンドレットとして作成するとより良いかと思います。

使用例

	// サムネイルを設定するアセット
	_AssetPath = FString(TEXT("/Game/TestBP.TestBP"));
	// サムネイルPNG画像
    _ImagePath = FString(TEXT("C:/Users/{ユーザー名}/Pictures/TestImage.png"));
	
	// アセットをロード
	UObject* _TargetAsset = LoadObject<UObject>(nullptr, _AssetPath.GetCharArray().GetData(), nullptr, LOAD_None, nullptr);
	// サムネイルを設定
	SetAssetThumbnailFromImage(_TargetAsset, _ImagePath);

実行結果

黒背景に白文字[てすと]と書かれたPNG画像を用意して設定を行った結果、以下のようになります。

Dirtyマークがつかない問題

上記コードだとなぜかサムネイルを変更したアセットに Ditryマーク（未保存時の編集済マーク）がつきませんでした。
どうやら MarkPackageDirty() はエディタ時のロードでのダーティマークは付けないように仕様が変わったようです。（ただしコマンドレット時は可能）

代わりにセーブ処理をする場合は以下のようなサンプルコードになるかと思います。

アセットのセーブ処理

#include "UObject/SavePackage.h"

bool SetAssetThumbnailFromImage(UObject* _TargetAsset, const FString& _ImageFilePath)
{
...省略...

	// 保存パスを取得
	FString _PackageFileName = FPackageName::LongPackageNameToFilename(_Package->GetName(), FPackageName::GetAssetPackageExtension());

	// SavePackageArgs 設定
	FSavePackageArgs _SaveArgs;
	_SaveArgs.TopLevelFlags = RF_Standalone;
	_SaveArgs.Error = GError;
	_SaveArgs.bWarnOfLongFilename = false;
	_SaveArgs.SaveFlags = SAVE_None;

	// パッケージのセーブ処理実行
	bool bSuccess = UPackage::SavePackage(
		_Package,
		nullptr,
		_PackageFileName.GetCharArray().GetData(),
		_SaveArgs
	);

	return(bSuccess);
}

UPackage::SetDirtyFlag(bool) を使う事でエディタロード中でもダーティマークを付けることは可能なようです。

まとめ

コンテンツブラウザのアセットが多い場合に少しでも見やすくするためにサムネイルを設定してみたのですが、表示タイプがグリッドではない場合は小さくて見づらいですね。