Thursday, December 15, 2016

Unreal.js!!

Unreal Engine 也可以使用 javascript 喔! 這是由 NCSoft 開放出來一個稱 Unreal.js 的 plugin,除了 github 上提供的範例以外,Michael Chang 在 Beyond Tellerrand Conference 2016 有一個蠻有趣的展示


Unreal.js 裡其實只會看到一個展示用的 unreal 專案,真正的實作部份在 Unreal.js-core,還會需要 V8 LIB 可以在 (https://github.com/ncsoft/Unreal.js-core/releases) 下載到預先 build 好的檔案,或是執行 Unreal.js-core 下的 install-v8-libs.bat 會自動找出所需要的版本然後下載,但是可能是因為網路關係,執行了幾次都下載不完全就斷掉,後來就是直接下載 built 好的版本來使用。
裝好後, 啟動 unreal 就會看到以下的視窗



代表有成功的執行,之後就可以來測試附帶的範例程式了,快速看完一輪後發現有些跟我一開始想像不太一樣的東西,Unreal.js 基本上是將 unreal 做一層包裝讓使用者可以用 javascript 的語法來實作 unreal 相關的功能,例如可以使用像

UMG(Button,    
{
    WidgetStyle: style.GetButtonStyle("Credits.Button"),
    OnClicked: _ => {
        JavascriptProcess.LaunchURL(homepageUrl)
        }
    },
    UMG.text({Font:font},"Visit project page")
),

來實現一個按鈕,或是
class MySMA extends StaticMeshActor {
    ctor() {
        let smc = this.StaticMeshComponent
        let mtrl = GWorld.CreateDynamicMaterialInstance(Material.Load('/Game/Color.Color'))
        mtrl.SetVectorParameterValue('Color',{G:1,A:1})
        smc.SetStaticMesh(StaticMesh.Load('/Engine/BasicShapes/Cube.Cube'))
        smc.SetMaterial(0,mtrl)
    }
}

擴展一個 StaticMeshActor 等,遊戲的邏輯可以直接使用 javascript 來實作,例如知名的 2048,



當然還可以配合各式個樣的 javascript module 來做出更複雜的功能,例使用 ConvNetJS 做 Deep Learning



不過當我想試看看dat.GUI 時就沒辦法了,因為這個 module 原本是設計在 web browser 裡使用,直接帶入就會拋出錯誤訊息。

Unreal.js 目前還在持續的開發中,目前的版本已經有很多很有潛力的應用出現,像是展示裡的程序化建築或是快速測試的功能等,前提是要會 javascipt~~ :D,很多 javascript 的寫法看起來還是需要一點時間才能熟悉它. 

No comments: