天天看點

ue4學習之嵌入H5網頁(web Brower)

五一放假,在家看了一波UE4的視訊,也動手寫了一點簡單的東西。

UE4裡面可玩的東西很多,但是我沒時間一個一個的去學去看,是以,我将會針對平時的項目需求去學習一些實用性的東西。

今天,就記錄一下,在UE4裡面如何添加外部H5程式。

1.添加webbrowser插件

打開項目模闆這些就不說了,稍微看下教程就會了。

編輯-->插件:

ue4學習之嵌入H5網頁(web Brower)

搜尋-->web...-->點選開啟

ue4學習之嵌入H5網頁(web Brower)

開啟之後,右下角會有一個詢問是否重新開機的選項,點選 Restart Now。

2.建立widget

ue4學習之嵌入H5網頁(web Brower)

在内容浏覽視窗建立一個檔案夾(名稱随意)來存放自己寫的東西

ue4學習之嵌入H5網頁(web Brower)

空白處右鍵建立一個widget藍圖,然後取個名字,我這裡叫menu了,然後打開

ue4學習之嵌入H5網頁(web Brower)

如圖所示,拖一個web browser插件到右邊,在右邊詳情面闆設定相關參數

ue4學習之嵌入H5網頁(web Brower)

設定結束,左上角編譯,儲存

3.在藍圖中設定添加該widget

打開關卡藍圖

ue4學習之嵌入H5網頁(web Brower)

空白處右鍵查找begin

ue4學習之嵌入H5網頁(web Brower)
ue4學習之嵌入H5網頁(web Brower)

點選拖拽,查找create Widget

ue4學習之嵌入H5網頁(web Brower)

選擇剛才建立的widget(我這裡叫menu)

ue4學習之嵌入H5網頁(web Brower)

add to viewport

ue4學習之嵌入H5網頁(web Brower)

target和return 連線

ue4學習之嵌入H5網頁(web Brower)

左上角編譯,儲存

4.檢視運作效果

ue4學習之嵌入H5網頁(web Brower)
ue4學習之嵌入H5網頁(web Brower)
ue4學習之嵌入H5網頁(web Brower)