1. 程式人生 > >UE4-利用UMG動畫製作場景切換Loading進度條

UE4-利用UMG動畫製作場景切換Loading進度條

首先要說明一點,目前市面上的遊戲絕大多數的Loading進度條,除了0%和100%的中間過程都是假的。也就是說中間的載入期間只是播放了一個進度條的動畫而已。在UE4中想要實現一個真的Loading進度條也是十分困難的,因為在場景切換的過程中,你是無法得到在前一個場景得到新場景載入相關資訊的,據說有國外的大神做了一個外掛來實現真的Loading進度條,但是我沒有找到。此文介紹的也是我用UMG動畫實現的
一個假的Loading進度條。

GameInstance設定

UE4在執行場景切換的時候,GameMode也是會相應的銷燬和新建的,所以我們控制Loading進度的變數不能存在GameMode中,在此我選擇在GameInstance中來儲存Loading進度的控制變數。新建兩個float變數:LoadingPerc和LoadingTime,其中LoadingTime初始值為0.8。
先建立一個widget名為LoadingScreen,兩個場景:Battle和Home。然後在GameInstance中寫載入LoadingScreen和場景切換的事件。
這裡寫圖片描述

UMG製作

現在我們來製作LoadingScreen這個UMG。
在Designer中加入一張圖片覆蓋整個螢幕,再加入Text和一個Circular Throbber,最下方是一個ProgressBar。
這裡寫圖片描述
接下來在設計視窗最下方新增一個動畫名為LoadingAni,新增進度條0進度到0秒的關鍵幀,0.8進度到1秒的關鍵幀。
這裡寫圖片描述
如何製作UMG動畫可以參考官方文件:
https://docs.unrealengine.com/latest/CHN/Engine/UMG/UserGuide/Animation/index.html

切換到Graph視窗,我們開始寫LoadingScreen的動畫播放邏輯:
這裡寫圖片描述

此處播放動畫LoadingAni的時候,起始點和播放時間就是由GameInstance中定義的兩個變數控制的,而且播放之後還會重新set這兩個變數的值,上圖稍微有點亂=。=

新場景的場景藍圖設定

最後我們來帶Battle場景的場景藍圖,新增如下程式碼:
這裡寫圖片描述

按本例所做,進度條的前80%已經在Openlevel之前播放,此處是用來播放後20%的。至此,假Loading進度條的功能已經全部實現,讀者可以在home中通過按鍵或者點選UMG按鈕來觸發場景切換,就能看到我們的Loading進度條功能成功實現了。

NOTES

筆者在使用OpenLevel切換場景的時候遇到了一些問題,因為OpenLevel執行時會清視口,所以前面不加delay的話,我們的loadingScreen就無法顯示出來。