一 UE4中开启Web UI插件

二

1. 创建.html文件

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
</head>
<body>
    <button onclick = "bindTest()"> 绑定测试 </button>
	<button onclick = "callUE4Func()"> callUE4Func </button>
	<script>
	
	// create the global ue4(...) helper function
    // 帮助函数
	"object"!=typeof ue||"object"!=typeof ue.interface?("object"!=typeof ue&&(ue={}),ue.interface={},ue.interface.broadcast=function(e,t){if("string"==typeof e){var o=[e,""];void 0!==t&&(o[1]=t);var n=encodeURIComponent(JSON.stringify(o));"object"==typeof history&&"function"==typeof history.pushState?(history.pushState({},"","#"+n),history.pushState({},"","#"+encodeURIComponent("[]"))):(document.location.hash=n,document.location.hash=encodeURIComponent("[]"))}}):function(e){ue.interface={},ue.interface.broadcast=function(t,o){"string"==typeof t&&(void 0!==o?e.broadcast(t,JSON.stringify(o)):e.broadcast(t,""))}}(ue.interface),(ue4=ue.interface.broadcast);

    // 绑定测试
	function bindTest()
	{
		
		ue.testobject.bindtestfunction("helle bind").then(function(ReturnValue){
		alert("hello bind.  " + ReturnValue);
		});
	}
    // js调用UE4中函数
	function callUE4Func()
	{
		ue4("callUE4Func", "Param test");
		
		alert("callUE4Func.");
	}
    // UE4中调用js函数
	ue.interface.UE4CallFunc = function(Json)
	{
		alert("UE4CallFunc:  "+ Json);
	}
	
	</script>
</body>
</html>

2. 蓝图中创建UMG,添加Web Ui组件


绑定对应js调用UE4函数

UE4调用js函数

按钮调用函数 传入参数可为空

参考:

【UE4】在Html中用JS访问UE中对象数据_哔哩哔哩_bilibili

(72条消息) 【UE4】一个实现Web穿透,用HTML开发UI的方式——WebUI的用法_DvLee1024的博客-CSDN博客_unreal web

Logo

DAMO开发者矩阵,由阿里巴巴达摩院和中国互联网协会联合发起,致力于探讨最前沿的技术趋势与应用成果,搭建高质量的交流与分享平台,推动技术创新与产业应用链接,围绕“人工智能与新型计算”构建开放共享的开发者生态。

更多推荐