400-650-7353
您所在的位置:首頁(yè) > IT干貨資料 > unity > 【Unity基礎知識】UMG的基本使用

【Unity基礎知識】UMG的基本使用

  • 來(lái)源:Unity干貨資料
  • 2023-08-09 14:50:00
  • 閱讀()
  • 分享
  • 手機端入口

在任何游戲和應用中,User Interface(以下簡(jiǎn)稱(chēng)UI)是必不可少的一部分。同樣在UE4中UI也是必不可少的內容,接下來(lái)我們看一下UE4中是如何創(chuàng )建和使用UI的。

Unreal Motion Graphics UI Designer(以下簡(jiǎn)稱(chēng)UMG)是UE4提供的一種可視化的解決方案,主要用來(lái)創(chuàng )建UI元素,如游戲中的HUD(Heads-Up Display),菜單和其他想要呈現給用戶(hù)的UI元素。

UMG的核心是Widget,這些Widget是一些提前寫(xiě)好的函數庫,主要用來(lái)創(chuàng )建UI元素,如按鈕,勾選框,滑動(dòng)條以及進(jìn)度條等?梢允褂肳idget藍圖進(jìn)行編輯,不僅可以編輯UI,還可以編寫(xiě)UI的交互邏輯,對應的Widget藍圖包含兩個(gè)部分,Designer窗口主要用于編輯UI層級并設置UI元素的自適應;Graphics窗口主要處理UMG的數據綁定和對應的邏輯,如點(diǎn)擊按鈕加載場(chǎng)景等等。

接下來(lái)我們簡(jiǎn)單講解一下UMG的基本使用。

一、UMG的創(chuàng )建

UMG屬于UE4的一種自帶資源,所以我們需要在Content Browser中創(chuàng )建。這里有兩種方式:

1)點(diǎn)擊Content Browser左上角的”Add New”;

2)直接在Content Browser中右鍵點(diǎn)擊;

在彈出來(lái)的菜單中選擇User Interface->Widget Blueprint,創(chuàng )建完成之后進(jìn)行重命名,此處筆者命名為WBP_Main,讀者可以根據自己的需要進(jìn)行命名。

雙擊即可打開(kāi),打開(kāi)之后界面如下圖所示。接下來(lái)簡(jiǎn)單介紹一下界面中的各個(gè)部分。

1:工具欄,主要存放常用的工具,如Compile(編譯)、Save(保存)、Browse(在Content Browser中顯示)等。

2:控制板:主要存放系統和自定義的UI元素,如按鈕、圖片等。

3:層級:主要存放和展示當前Canvas中使用的UI元素及其層級關(guān)系。

4:視圖:用于創(chuàng )建和調節各個(gè)UI,以及UI之間的邏輯操作。

5:細節:顯示當前所選UI的屬性。

6:動(dòng)畫(huà):用于創(chuàng )建和編輯動(dòng)畫(huà)。

基本界面已經(jīng)熟悉了,我們接下來(lái)創(chuàng )建一個(gè)按鈕。從控制板中拖拽Button到視圖中,適當調整大小和位置,拖動(dòng)Text作為Button的子物體,并將Text對應的文字改為“Start Game”,具體效果如下圖所示。

接下來(lái)為為按鈕添加點(diǎn)擊事件。

選擇按鈕,在細節面板中點(diǎn)擊OnClicked后面的加號,如下圖所示。

點(diǎn)擊完之后會(huì )自動(dòng)跳轉到藍圖界面。編寫(xiě)按鈕對應的關(guān)卡跳轉邏輯,如下圖所示,創(chuàng )建OpenLevel節點(diǎn)并將要跳轉的關(guān)卡名稱(chēng)填寫(xiě)在Leve Name參數中。

UMG已經(jīng)創(chuàng )建完成,別忘了點(diǎn)擊Compile和Save。

二、UMG的顯示

我們到目前為止只是創(chuàng )建了UI,想要在游戲運行過(guò)程中顯示UI,需要執行額外的步驟,接下來(lái)一起看一下。

打開(kāi)關(guān)卡藍圖,在EventBeginPlay節點(diǎn)(沒(méi)有的畫(huà)可以手動(dòng)創(chuàng )建)之后連接CreateWidget和AddToViewport節點(diǎn),并在CreateWidget節點(diǎn)的Class參數中指定為WBP_Main。

運行游戲發(fā)現無(wú)法顯示鼠標,所以我們需要再添加兩個(gè)節點(diǎn),如下圖所示。

最終運行效果如下圖所示,點(diǎn)擊左上方按鈕可以實(shí)現場(chǎng)景的跳轉。

文章“【Unity基礎知識】UMG的基本使用”已幫助

更多內容

>>本文地址:http://www.76097.cn/zhuanye/2023/72219.html

THE END  

聲明:本站稿件版權均屬中公教育優(yōu)就業(yè)所有,未經(jīng)許可不得擅自轉載。

1 您的年齡

2 您的學(xué)歷

3 您更想做哪個(gè)方向的工作?

獲取測試結果
  • 大前端大前端
  • 大數據大數據
  • 互聯(lián)網(wǎng)營(yíng)銷(xiāo)互聯(lián)網(wǎng)營(yíng)銷(xiāo)
  • JavaJava
  • Linux云計算Linux
  • Python+人工智能Python
  • 嵌入式物聯(lián)網(wǎng)嵌入式
  • 全域電商運營(yíng)全域電商運營(yíng)
  • 軟件測試軟件測試
  • 室內設計室內設計
  • 平面設計平面設計
  • 電商設計電商設計
  • 網(wǎng)頁(yè)設計網(wǎng)頁(yè)設計
  • 全鏈路UI/UE設計UI設計
  • VR/AR游戲開(kāi)發(fā)VR/AR
  • 網(wǎng)絡(luò )安全網(wǎng)絡(luò )安全
  • 新媒體與短視頻運營(yíng)新媒體
  • 直播帶貨直播帶貨
  • 智能機器人軟件開(kāi)發(fā)智能機器人
 

快速通道fast track

近期開(kāi)班時(shí)間TIME