天天看点

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

作者:飞行小鱼

目标:UE5在Runtime下现实加载PNG,JPG等图片资源

先看效果:

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

步骤1. 创建UE5工程

新建UE5的C++空白项目TestPicturePro,记得选择C++,初学者包可以根据自己需要选择是否勾选。

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

步骤2. 创建空白插件,命名为SimplePictureTools

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

插件创建成功后可以看到如下目录:

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

步骤3. 创建的蓝图静态方法类

C++文件夹下右击,创建C++类

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

选择蓝图静态方法类,点击下一步

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

修改文件文件夹路径,我们这里修改到新创建的插件文件夹下

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

技巧:选择公共的话,UE会把头文件放到public文件夹下面,cpp文件放到Private文件夹下面,如果选择私有的话,UE会把头文件+cpp文件都放到Private文件夹下面。

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

同样创建成功后会出现

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

步骤4. 在SimplePictureToolsLibrary.h定义LoadImageToTexture2D方法

public:
   UFUNCTION(BlueprintCallable, Category="Picture Tool")
   static bool LoadImageToTexture2D(const FString& ImagePath, UTexture2D* &InTexture, float& Width, float& Height);           

据说UTexture2D是一个指针,我们需要把他传到蓝图中,所以需要添加引用&InTexture

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

在LoadImageToTexture2D方法中添加用于:取出ImagePath文件的二进制数据的代码

// 取出ImagePath文件的二进制数据
TArray<uint8> ImageResultData;
FFileHelper::LoadFileToArray(ImageResultData,*ImagePath);           

加载图片处理模块

// 加载图片处理模块
// 使用模块管理器的带有检测功能的模块加载方法LoadModuleChecked
IImageWrapperModule& ImageWrapperModule = FModuleManager::LoadModuleChecked<IImageWrapperModule>("ImageWrapper");           

找到runtime下的ImageWrapper模块的方法如下:

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

模块名

并且要在TestPicturePro.Build.cs中添加模块ImageWrapper。

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

根据不同的文件格式创建不同的文件处理类

TSharedPtr<IImageWrapper> ImageWrapper= ImageWrapperModule.CreateImageWrapper(EImageFormat::BMP);           

UE目前支持的格式如下:

enum class EImageFormat : int8
{
   /** Invalid or unrecognized format. */
   Invalid = -1,

   /** Portable Network Graphics. */
   PNG = 0,

   /** Joint Photographic Experts Group. */
   JPEG,

   /** Single channel JPEG. */
   GrayscaleJPEG, 

   /** Windows Bitmap. */
   BMP,

   /** Windows Icon resource. */
   ICO,

   /** OpenEXR (HDR) image file format. */
   EXR,

   /** Mac icon. */
   ICNS,
   
   /** Truevision TGA / TARGA */
   TGA,

   /** Hdr file from radiance using RGBE */
   HDR,

   /** Tag Image File Format files */
   TIFF,
};           

判断传进来的文件格式,获取文件名后缀,判断文件格式,并且传给图片处理类

//获取文件名后缀,判断文件格式
FString Ex =FPaths::GetExtension(ImagePath,false);
EImageFormat ImageFormat = EImageFormat::Invalid;
if (Ex.Equals(TEXT("jpg"),ESearchCase::IgnoreCase)
   || Ex.Equals(TEXT("jpeg"),ESearchCase::IgnoreCase))
{
   ImageFormat = EImageFormat::JPEG;
}
else if(Ex.Equals(TEXT("png"),ESearchCase::IgnoreCase))
{
   ImageFormat = EImageFormat::PNG;
}
else if(Ex.Equals(TEXT("bmp"),ESearchCase::IgnoreCase))
{
   ImageFormat = EImageFormat::BMP;
}

// 加载图片处理模块
// 使用模块管理器的带有检测功能的模块加载方法LoadModuleChecked
IImageWrapperModule& ImageWrapperModule = FModuleManager::LoadModuleChecked<IImageWrapperModule>("ImageWrapper");
// 根据不同文件格式创建不同的文件处理类
TSharedPtr<IImageWrapper> ImageWrapper= ImageWrapperModule.CreateImageWrapper(ImageFormat);           

根据压缩文件,解析图片

// 根据压缩文件,解析图片
if (ImageWrapperPtr.IsValid()
   && ImageWrapperPtr->SetCompressed(ImageResultData.GetData(),ImageResultData.Num()))
{
}           

内存分配的时候

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

,也可以把ImageResultDataNum()换成ImageResultData.GetAllocatedSize()

接下来去获取BGRA的颜色数据

TArray<uint8> OutRawData;   // 此数据跟格式无关
ImageWrapperPtr->GetRaw(ERGBFormat::BGRA, 8,OutRawData);           

最后把颜色数据拷贝到需要的贴图中

// 最后把颜色数据拷贝到需要的贴图中
Width = ImageWrapperPtr->GetWidth();
Height = ImageWrapperPtr->GetHeight();
InTexture = UTexture2D::CreateTransient(Width,Height, PF_B8G8R8A8);
if (InTexture)
{
   //数据拷贝时候,如果是多线程的话,不加锁可能会引起崩溃哦
			// 加锁,LOCK_READ_WRITE可读可写
			void* TextureData = InTexture->PlatformData->Mips[0].BulkData.Lock(LOCK_READ_WRITE);
			// 赋值,把OutRawData颜色数据赋值给到InTexture
			FMemory::Memcpy(TextureData, OutRawData.GetData(), OutRawData.Num());
			//解锁
			InTexture->PlatformData->Mips[0].BulkData.Unlock();
			// 刷新资源
			InTexture->UpdateResource();
			return true;
}           

到此,LoadImageToTexture2D函数功能已经写完,编译运行

步骤5. 创建UI进行测试

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

创建4个按钮,用来分别测试不同图片

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

使用蓝图定义函数BP_LoadImageToTexture2D,定义4个按钮事件,分别调用BP_LoadImageToTexture2D测试JPG,PNG,BMP等图片

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

好了,最近这一节这么多了,大家课后自己尝试其他类型图片,希望今天的内容对你有所帮助! 最后效果如下:

UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片
UE5开发室内设计软件RunTime资源加载:第1篇——加载图片

继续阅读