Unreal Engine 4 Radiant UI 插件入门教程(二)
本篇章前提要求:在UE4上安装了Radiant UI插件。如果没有安装,请找其它教程(或者是笔者的其它的教程,目前正在写)。
本教程的目的:探讨如何从网页元素中调用蓝图中的内容:
第一步:
写一个网页,大致内容为:
<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>T</title> <!--Mark-->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"><!--这个不是必要的,这个是bootstrap样式-->
<!--an-->
<script type="text/javascript" src="js/createjs-2015.11.26.min.js"></script><!--这个的必要性没有考究-->
<!--an-->
<script type="text/javascript" src="js/radiantui-null.js"></script><!--原来这个也是不必要的-->
<!--Mark end--> <script type="text/javascript">
function HW(){
RadiantUI.TriggerEvent('HelloW');
}
</script>
</head>
<body>
<button type="button" onclick="HW()">nihao</button>
</body>
</html>
其中的Mark所标注的内容请注意,不一定都需要的!但是注意其中的radiantui-null.js是必要的【修正:已经证实这个不必要了,可以无视】,这个文件如果没有写的话,请自己声明,因为它的内容很短,如下:
var RadiantUI;
if (!RadiantUI) {
RadiantUI = {};
RadiantUI.TriggerEvent = function() {}
RadiantUI.SetCallback = function() {}
RadiantUI.RemoveCallback = function() {}
}
对的,先摆上去再说,createjs-2015.11.26.min.js这个文件可以搜一搜,以网络资源的形式包含进来即可。逻辑上的内容是那个按钮,按钮调用了HW()函数,而这个函数里的唯一一句代码是RadiantUI.TriggerEvent("HelloW"),这是指什么呢?先放一放。
在UE4中,声明一个RadiantUIElement
双击并在其中的url中写入这个html文件的相对位置(注意将这个文件放在合适的地方)。然后写上HelloW函数。
新建一个RadiantHUD,然后绑上上述的这个元素(我这里的起名是RUIElem_Lobby)
最后放置在gamemode中,然后运行:
可能描述不太清晰,不明白请留言。
原创声明:本文系小江村儿的文杰原创,若有参考的资料必在本文中给出。
Unreal Engine 4 Radiant UI 插件入门教程(二)的更多相关文章
- Unreal Engine 4 Radiant UI 插件入门(三)——从蓝图中调用JS
不知道大家有没有混淆.这篇教程说的是从蓝图中调用JS的功能(以改变H5内的内容). 在安装了UE4和RadiantUI的前提下学习这篇教程.本篇教程接着上一篇教程,建议请先看上一篇. 第一步:在网页中 ...
- Unreal Engine 4 Radiant UI 入门教程(一)制作Radiant HUD
请注意:本篇教程的编号是从零开始的,如果没有看第零篇教程,请前往学习. 本教程介绍如何制作Radiant HUD,这是指将网页元素直接加入到HUD中,效果为: 对应的网页元素为: 第一步: 将之前下载 ...
- Unreal Engine 4 Radiant UI 入门教程(零)在场景中摆放网页
相关的学习资源: https://forums.unrealengine.com/showthread.php?12097-PLUGIN-RadiantUI-SDK-UIs-HUDs-Interact ...
- SpringBoot入门教程(二)CentOS部署SpringBoot项目从0到1
在之前的博文<详解intellij idea搭建SpringBoot>介绍了idea搭建SpringBoot的详细过程, 并在<CentOS安装Tomcat>中介绍了Tomca ...
- JasperReports入门教程(二):中文打印
JasperReports入门教程(二):中文打印 背景 在上一篇中我们介绍了JasperReport的基本入门,也展示了一个报表.但是我们的示例都是使用的英文,如果我们把需要打印的数据改为中文会怎么 ...
- 无废话ExtJs 入门教程二十一[继承:Extend]
无废话ExtJs 入门教程二十一[继承:Extend] extjs技术交流,欢迎加群(201926085) 在开发中,我们在使用视图组件时,经常要设置宽度,高度,标题等属性.而这些属性可以通过“继承” ...
- 无废话ExtJs 入门教程二十[数据交互:AJAX]
无废话ExtJs 入门教程二十[数据交互:AJAX] extjs技术交流,欢迎加群(521711109) 1.代码如下: 1 <!DOCTYPE html PUBLIC "-//W3C ...
- 无废话ExtJs 入门教程二[Hello World]
无废话ExtJs 入门教程二[Hello World] extjs技术交流,欢迎加群(201926085) 我们在学校里学习任何一门语言都是从"Hello World"开始,这里我 ...
- mongodb入门教程二
title: mongodb入门教程二 date: 2016-04-07 10:33:02 tags: --- 上一篇文章说了mongodb最基本的东西,这边博文就在深入一点,说一下mongo的一些高 ...
随机推荐
- OpenCV探索之路(十五):角点检测
角点检测是计算机视觉系统中用来获取图像特征的一种方法.我们都常说,这幅图像很有特点,但是一问他到底有哪些特点,或者这幅图有哪些特征可以让你一下子就识别出该物体,你可能就说不出来了.其实说图像的特征,你 ...
- WPF自动更新程序
WPF AutoUpdater 描述: WPF+MVVM实现的自动更新程序 支持更新包文件验证(比较文件MD5码) 支持区分x86与x64程序的更新 支持更新程序的版本号 支持执行更新策略 截图: 使 ...
- SmartCoder每日站立会议07
站立会议内容 基本框架已出,首页地图功能还没有接入完全. 1.站立会议照片: 2.任务展板 3.燃尽图
- Drools 6.5 Final 入门
Drools 6.5 Final学习笔记 最近项目中要涉及到使用规则对数据进行操作,想到自己实现一个完整且能灵活满足业务需求的规则系统太难了,就想了解一下有没有开源的规则引擎可以使用,后来发现Droo ...
- hdu_A Walk Through the Forest ——迪杰特斯拉+dfs
A Walk Through the Forest Time Limit : 2000/1000ms (Java/Other) Memory Limit : 65536/32768K (Java/ ...
- ThinkPHP5.0更改框架的验证方法对象->validate(true)->save();
我们更希望看到: // 新增对象至数据表 $result = $Teacher->validate(true)->save(); 而不是: // 新增对象至数据表 $result = $T ...
- JVM-8.性能监控与故障处理工具
一.JDK的命令行工具 1.jdk/bin下面有非常多工具:这些工具大多数是用Java实现(jdk/lib/tools.jar) 2.jps:类似于Linux中的ps,显示Hotspot虚拟机进程 3 ...
- Python中的模块介绍和使用
在Python中有一个概念叫做模块(module),这个和C语言中的头文件以及Java中的包很类似,比如在Python中要调用sqrt函数,必须用import关键字引入math这个模块,下面就来了解一 ...
- dede系统自定义变量删除方法
之前添加了个联系电话的系统变量,忘记写描述,结果就显示个冒号,很难看.这样的就要删除了重来,那么织梦怎么删除添加的变量呢?其实很简单.两种方法: 第一种:执行SQL语句.在织梦后台执行-系统-SQL命 ...
- 记一次调试串口设备Bug的经历
最近花了差不多1天的时间在折腾一个Bug,该Bug的表象如下: 这个Bug还特别独特,在开发电脑中无提示,在终端用户那里每次使用软件的时候都报这个.仔细思考了一下最近在源码中新添加的功能,没发现有啥特 ...