对于非游戏开发团队来讲,在面向非游戏领域的UE项目中嵌入Web页面并实现交互无疑能充分利用现有开发资源和流程,WebUI插件能提供完整的Web页面加载及交互手段,让团队中的UE开发工程师和Web开发工程师能够各司其职、紧密配合。


WebUI的安装配置过程可详细参考官方文档。


1.配置WebUI

​### 1.1创建控件蓝图类
选择“添加-用户界面-控件蓝图”,命名为WebInterface。

打开蓝图编辑器,修改控件布局。

​1.2创建HUD蓝图类

创建HUD蓝图类,命名为WebHUD,此蓝图类将作为Web加载交互的核心。

打开蓝图编辑器进行配置,目标是得到类似下方的蓝图。

详细过程参考官方文档。

​1.3创建GameMode蓝图类

创建蓝图类,选择“GameModeBase”类作为父类,命名为WebGameMode,使用蓝图编辑器配置如下。

​1.4修改世界场景设置

打开关卡,修改“世界场景设置”。

2.UE与Web交互

​2.1透明穿透设置

​2.2Web调用UE方法

在Web页面调用Javascript方法ue.interface.broadcast,在UE项目的WebHUD蓝图中配置OnBroadcast方法,用于监听Web页面传输的方法名及方法参数。

ue.interface.broadcast方法包含两个参数,第一个参数为方法名name,格式为字符串,第二个参数为方法参数data,格式为json字符串。​

​2.3UE调用Web方法

在UE项目的WebHUD蓝图中配置Call方法,用于调用Web页面中定义的Javascript函数,被调用的函数需要提前在ue.interface对象上定义,参数同样为json字符串。

2.4开发调试

启动UE项目,确保选中Web元素,使用CTRL+SHIFT+I调试浏览器,打开浏览器工具栏,可以像常规Web页面一样进行调试运行。

如何在UnrealEngine虚幻引擎中加载Web页面相关推荐

  1. 如何在UnrealEngine虚幻引擎中进行版本管理

    项目团队中的分工协作必不可少,在UE项目中进行版本控制非常必要.UE支持使用Perforce和SVN进行版本管理,此处选用自己比较熟悉的SVN. 1.使用SVN进行源码管理 通过编辑器偏好设置窗口(编 ...

  2. QWidget中加载QML页面并设置透明背景

    要在QWidget中加载QML页面首先要用到一个很重要的类QQuickWidget 示例: m_pQuickWidget = new QQuickWidget(this);m_pQuickWidget ...

  3. app中加载h5页面白屏问题

    一.问题描述:通过原生检查日志在网络不好的情况下,由于vue打包后的第三方js包加载失败导致h5页面白屏. 二.解决方案: 1.减少第三方依赖:在package.json中把不需要的包删除. 2.组件 ...

  4. html中设置页面正在加载,在加载Web页面时显示正在等待的窗体

    1.在css样式表里加入 /* 页面加载特效 */ .Loading { font-size: 12px; font-family: 宋体; width: 100pt; height: 14pt; p ...

  5. WebKit如何加载web页面

    转自http://blog.csdn.net/keensword007/archive/2010/09/03/5860837.aspx 在WebKit能够渲染web页面之前,它必须从网络加载页面和子资 ...

  6. iframe中加载html,在iframe中加载外部html并访问内容

    我只需要提供src属性即可加载外部页面时,我需要知道如何访问iframe内容.在iframe中加载外部html并访问内容 我正在使用iframe在jquery对话框中加载HTML页面.在这里,我不能修 ...

  7. Android加载web页时有的手机会弹出手机自带的浏览器解决方法

    今天有用户反映说浏览资料时,会弹出需要选择手机里自带的浏览器查看,这是什么情况呢??然后我们就测试,大部分手机还是不会出现这种情况的,但是公司里也有手机出现这种情况了,于是乎bug修复,代码呈上 we ...

  8. Android加载H5页面手机的返回操作

    最近接了一个新项目,项目说是混合开发,其实就是原生给个壳,实现全是前端的同学做的,接到项目后,领导说了很多bug,其中这个比较有趣,所以在这个记录一下,还原一下: 当我们登录成功后进入首页,然后再首页 ...

  9. 如何在Author中加载SDE栅格图层?

    如何在Author中加载SDE栅格图层? 版本: ArcIMS  9.1 在Author中加载SDE栅格图层,并保存AXL文件. 过程描述 1.使用ArcIMS Author工具正常的连接ArcSDE ...

最新文章

  1. PHP面试内容 整理搜集 PHP面试涉及技术 一文回顾全部 主要含PHP面试命令列表 方法列表...
  2. 羡慕嫉妒!看了腾讯月收入 8 万 的支出账单不恨了 | 每日趣闻
  3. 力扣: 88. 合并两个有序数组
  4. 二叉树、二叉排序树及其遍历
  5. 2016 年Adobe设计成就奖作品征集
  6. ASP.NET MVC5+EF6+EasyUI 后台管理系统(1)-前言与目录(持续更新中...)
  7. [ESC] EnTT 学习记录 2
  8. vue_devtools的安装及资源(chrome and edge上的安装)
  9. eggjs增删改查MySQL_egg-sequelize 实现 增删改查
  10. 十个提升你Emacs生产力的高招
  11. Oracle临时库数据数据量过大,Oracle临时表空间过大问题解决
  12. 项目经理的第二手准备-坚强的挺着(4)
  13. 51nod 1105 第K大的数 【双重二分/二分套二分/两数组任意乘积后第K大数】
  14. 《剑指offer》面试题22——栈的压入、弹出序列(C++)
  15. python简明教程_03
  16. 高级软件工程第三次作业 赵坤黄亦薇
  17. 媒体查询@media
  18. 高效能人士的七个习惯-第四章-阅读
  19. Polar SC的C++实现
  20. mail在linux的端口,linux 上mailx通过465端口发送邮件

热门文章

  1. 时间-判断两个时间相差多少天
  2. ZOJ:1203 Swordfish
  3. HALCON学习-下载、安装
  4. 怎么制作网站?手把手教你10个网站建设的步骤!
  5. 《初级会计电算化应用教程(金蝶KIS专业版)》——1.2 会计电算化发展概况
  6. 浅析网络编程之AF_INET和PF_INET
  7. Machine Learning学习笔记(四)EML极限学习机
  8. “信息科技“ 纳入义务教育,少儿编程程首选项
  9. Python框架——最详细的Django框架入门
  10. 栈的基本操作及其应用