如何在UnrealEngine虚幻引擎中加载Web页面

这篇具有很好参考价值的文章主要介绍了如何在UnrealEngine虚幻引擎中加载Web页面。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

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


WebUI的安装配置过程可详细参考官方文档。
如何在UnrealEngine虚幻引擎中加载Web页面


1.配置WebUI

​### 1.1创建控件蓝图类
选择“添加-用户界面-控件蓝图”,命名为WebInterface。
如何在UnrealEngine虚幻引擎中加载Web页面

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

如何在UnrealEngine虚幻引擎中加载Web页面

​1.2创建HUD蓝图类

创建HUD蓝图类,命名为WebHUD,此蓝图类将作为Web加载交互的核心。
如何在UnrealEngine虚幻引擎中加载Web页面

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

如何在UnrealEngine虚幻引擎中加载Web页面

详细过程参考官方文档。

​1.3创建GameMode蓝图类

创建蓝图类,选择“GameModeBase”类作为父类,命名为WebGameMode,使用蓝图编辑器配置如下。
如何在UnrealEngine虚幻引擎中加载Web页面

​1.4修改世界场景设置

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

如何在UnrealEngine虚幻引擎中加载Web页面

2.UE与Web交互

​2.1透明穿透设置

如何在UnrealEngine虚幻引擎中加载Web页面

​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页面一样进行调试运行。文章来源地址https://www.toymoban.com/news/detail-462942.html

到了这里,关于如何在UnrealEngine虚幻引擎中加载Web页面的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【虚幻引擎】UE4 同步和异步资源加载(软引用)

    虚幻引擎给我们提供了两种引用,一个是硬引用。软引用通常是仅储存资源对象的资源路径没有与资源产生耦合关系的引用(软引用加载到内存中,引用对象不会被加载到内存中,只有在需要的时候才会被加载进内存中)。硬引用则是拥有资源对象实际成员变量,直接与资源对

    2024年02月01日
    浏览(100)
  • 【虚幻引擎UE】UE5 Pak资源分包加密打包与加载(安卓篇)

    【虚幻引擎UE】UE5 Pak分包加密及热更新(安卓篇) 相关文章: 1.介绍了安卓项目打包的基本操作: 【虚幻引擎UE】UE5仅需5个步骤快速实现AR项目调试与打包(安卓篇) https://tjgzs.blog.csdn.net/article/details/126097508 2.介绍了PAK加载的基本操作: 【虚幻引擎UE】UE5 热更新动态PAK资源加

    2024年02月08日
    浏览(50)
  • 虚幻引擎集成web前端<二>:UE4 像素流 与 web 通信

    Vue 和 Unreal Engine (UE) 之间的通信可以通过多种方式实现。以下是一些建议的方法: 使用 Websockets:Websockets 是一种在客户端和服务器之间进行双向通信的技术。在 Vue 端,你可以使用一个 Websockets 库(如 socket.io)来与 UE 服务器建立连接。在 UE 端,你可以创建一个 Websockets 服务

    2024年02月09日
    浏览(42)
  • 如何在虚幻引擎中渲染动画?

    大家好,今天我将展示如何在虚幻引擎中渲染动画,以及虚幻引擎渲染动画怎么设置的方法步骤。 需要提前了解: 渲云云渲染 支持虚幻引擎离线渲染,可 批量渲染,批量出结果 ,根据需求选择合适的配置,效率更高。 还使用 赞奇超高清云工作站 ,即使本地普通的电脑也

    2024年02月07日
    浏览(42)
  • 什么是站内搜索引擎?如何在网站中加入站内搜索功能?

    在当今数字时代,用户体验对于网站的成功起着至关重要的作用。提升用户体验和改善整体网站性能的一种方法是引入站内搜索引擎。站内搜索引擎是一种强大的工具,它的功能类似于Google或Bing等流行搜索引擎,但它专注于实施自己网站上的内容。用户可以在网站内搜索特定

    2024年02月03日
    浏览(75)
  • 虚幻引擎游戏开发过程中,游戏鼠标如何双击判定?

    UE虚幻引擎对于游戏开发者来说都不陌生,市面上有47%主机游戏使用虚幻引擎开发游戏。作为是一款游戏的核心动力,它的功能十分完善,囊括了场景制作、灯光渲染、动作镜头、粒子特效、材质蓝图等。本文介绍了虚幻引擎游戏开发过程中游戏鼠标双击判定,一起来看看吧

    2024年02月13日
    浏览(45)
  • 版本控制 | 如何使用虚幻引擎的多用户编辑(MUE)功能

    随着现代虚拟制作技术的发展,电影制片厂不再需要完全依赖实际场景,而是可以在拍摄期间就让虚拟制作设计团队将实景与计算机生成的虚拟内容融合在一起。虚幻多用户编辑(Unreal Multi-User Editing,简称MUE)可以帮助简化这个过程。本篇文章将解释什么是虚幻多用户编辑,

    2024年02月02日
    浏览(37)
  • 虚幻引擎nDisplay教程:如何同步nDisplay节点与Switchboard + Helix Core

    对于使用大型LED屏幕进行拍摄的虚拟制作团队来说,虚幻(Unreal)的nDisplay是一个重要的工具。但是,在nDisplay中将正确版本的文件发送到每个节点会非常耗时。立即阅读本文,您将了解到如何使用Perforce Helix Core版本控制设置虚幻总机(Unreal Switchboard),快速轻松地将您的项目同

    2024年01月21日
    浏览(43)
  • 虚幻引擎集成web前端<一>:win环境UE4.27导出像素流并集成到vue2环境(附案例)

     本案例附件:https://download.csdn.net/download/rexfow/88303544 -AudioMixer -PixelStreamingIP=localhost -PixelStreamingPort=8888 1、执行run_local.bat: SamplesPixelStreamingWebServersSignallingWebServerplatform_scriptscmd F:UEpackageUE4271WindowsNoEditorSamplesPixelStreamingWebServersSignallingWebServerplatform_scriptscmd 运行后

    2024年02月09日
    浏览(38)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包