ue5.2 数字孪生(11)——Web_UI插件网页通信

打印 上一主题 下一主题

主题 554|帖子 554|积分 1662

Web_UI插件下载安装:



  • https://github.com/tracerinteractive/UnrealEngine/releases
    下载对应Ue版本的Web_UI插件以及相关的Json、Http库;

  • 将插件安装到引擎根目次

Ue链接Web:



  • 在项目中启用插件并重启项目;

  • 创建基于Web的用户界面Umg_Web;
    添加Web_Interface网页控件,提升为变量并设置不透明度;

  • 在玩家控制器中创建Umg_Web控件并添加到视口;
    获取控件中的Web_Interface变量绑定On Interface 事件;
    加载网页;

  • 测试用的网页代码:
    1. <html>
    2. <head>
    3. <!--网页编码方式-->
    4. <meta charset="UTF-8">
    5. <!--前端和Ue通信-->
    6. <script src="https://code.jquery.com/jquery-2.2.4.min.js"> </script>
    7. <!--Ue和前端通信JS代码-->
    8. <script>
    9.     "object" != typeof ue && (ue = {}), uuidv4 = function () { return "10000000-1000-4000-8000-100000000000".replace(/[018]/g, function (t) { return (t ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> t / 4).toString(16) }) }, ue5 = function (r) { return "object" != typeof ue.interface || "function" != typeof ue.interface.broadcast ? (ue.interface = {}, function (t, e, n, o) { var u, i; "string" == typeof t && ("function" == typeof e && (o = n, n = e, e = null), u = [t, "", r(n, o)], void 0 !== e && (u[1] = e), i = encodeURIComponent(JSON.stringify(u)), "object" == typeof history && "function" == typeof history.pushState ? (history.pushState({}, "", "#" + i), history.pushState({}, "", "#" + encodeURIComponent("[]"))) : (document.location.hash = i, document.location.hash = encodeURIComponent("[]"))) }) : (i = ue.interface, ue.interface = {}, function (t, e, n, o) { var u; "string" == typeof t && ("function" == typeof e && (o = n, n = e, e = null), u = r(n, o), void 0 !== e ? i.broadcast(t, JSON.stringify(e), u) : i.broadcast(t, "", u)) }); var i }(function (t, e) { if ("function" != typeof t) return ""; var n = uuidv4(); return ue.interface[n] = t, setTimeout(function () { delete ue.interface[n] }, 1e3 * Math.max(1, parseInt(e) || 0)), n });
    10. </script>
    11. <!--前端To UE-->
    12. <script>
    13.     //前端传数据给UE     接口事件:fun01
    14.     function callUEFunc() {
    15.         ue5("fun01", "雷猴啊");
    16.     }
    17. </script>
    18. <!-- UE to前端 -->
    19. <script>
    20.     //显示游戏帧率
    21.     ue.interface.Show_Fps = function (fps) {
    22.         $("#fpsMeter").text(fps.toFixed(2)+"FPS");
    23.     };
    24.     //显示命中Actor
    25.      ue.interface.Click_Actor = function (str) {
    26.         $("#fa").text("被点击的物体名称:"+str);
    27.     };
    28. </script>
    29. </head>
    30. <body>
    31. <button id="button" onclick="callUEFunc()">Web To UE</button>
    32. <br/>-------------------------------<br/>
    33. <p id="fpsMeter">00  FPS</p>
    34. <p id="fa">被点击的物体名称:</p>
    35. </body>
    36. </html>
    复制代码
  • Ue接收网页消息:

  • Ue发消息给网页:


免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

李优秀

金牌会员
这个人很懒什么都没写!
快速回复 返回顶部 返回列表