请注意:本篇教程的编号是从零开始的,如果没有看第零篇教程,请前往学习。

本教程介绍如何制作Radiant HUD,这是指将网页元素直接加入到HUD中,效果为:

对应的网页元素为:

第一步:

将之前下载的工程中的WebUI文件夹拷贝到我们自己的工程(LearnRUI)的同位置下:

复制到:

第二步:

创建一个蓝图(RadiantWebViewHud)

创建一个新的Gamemode,将这个HUD放进去:

在worldsettings中放置这个Gamemode:

第三步:

创建蓝图(RadiantWebViewHUDElement)

第四步:

打开刚刚新建的HUDElement(我起名为MyWebHUDOverlay),URL处写:

这个地址是指这个网页元素:

注意配置输入模式为noinput(若此值为mouse and keyboard,那么将会消耗移动输入,人物就无法移动):

Tip:projected cursor是指显示光标(如果输入的话就隐藏的意思)。将此值设置为false,就只显示普通的光标。

第五步:

在刚刚创建的HUD中加入上述元素

第六步:

在gamemode中记得配置这个HUD,如果配置了之后还是不给力,那么就打开mygamemode蓝图(第一篇教程中介绍了要新建一个gamemode,起名为mygamemode),配置好后点击编译保存,再在worldsettings中选择这个gamemode,启动游戏即可看到效果。

下一篇见。

——原创自小江村儿的文杰,2017年7月5日16:03:32

Unreal Engine 4 Radiant UI 入门教程(一)制作Radiant HUD的更多相关文章

  1. Unreal Engine 4 Radiant UI 入门教程(零)在场景中摆放网页

    相关的学习资源: https://forums.unrealengine.com/showthread.php?12097-PLUGIN-RadiantUI-SDK-UIs-HUDs-Interact ...

  2. UI入门教程

    常常会听到这么一些忠告“多看 多想 多做”   你有没有发现一个问题,每天都在看各种设计作品,真到自己做的时候,一下子全都忘记了,脑子短路傻逼了.之前看到那么多好的设计作品也都白看了,人家的还是人家的 ...

  3. Unreal Engine 4 蓝图完全学习教程(五)—— 关于数组

    Ⅰ.数组的含义及使用 数组是能统一保存若干数值的特殊变量.数组可以指定编号.运用其中的值,因此能够有序地管理大量的数据. 首先试图将上次创建的msg变量修改成数组,在细节栏点击修改: 并选择“修改变量 ...

  4. Unreal Engine 4 蓝图完全学习教程(四)—— 变量与计算

    Ⅰ.值的基础类型 ①文本.字符串(Text.String):文本类型的值. ②整型.浮点型(Int.Float):数字类型的值. ③布尔型(Bool):表示“真或假”二者选其一的状态. Ⅱ.加法运算 ...

  5. Unreal Engine 4 蓝图完全学习教程(三)—— 节点的基本知识

    Ⅰ.节点的种类 ①标题:在节点的上方显示着节点的标题,标题部分会根据节点类型显示不同的颜色. ②输入:用于从其他节点接收数据以获取必要的数值. ③输出:将这个节点计算出结果用于传递数值到其他节点. ( ...

  6. Unreal Engine 4 蓝图完全学习教程(二)—— 初步尝试

    本篇尝试使用蓝图.蓝图是使用专门的编辑器进行编程. Ⅰ.3类蓝图 ①关卡蓝图:前面提到过,关卡是指在UE中制成的游戏场景.关卡蓝图是用于制作当前游戏场景的程序.在UE中进行编程就是在创建关卡蓝图. ② ...

  7. Unreal Engine 4 蓝图完全学习教程(一)—— 简要介绍

    首先启动UE4: 新建项目类型为游戏: 选择空项目Blank: 项目设置选项: 点击创建项目: 打开后的窗口称为:“关卡编辑器”,由多个面板组成.在UE中,设计3D场景的空间称为“关卡”. 简单介绍一 ...

  8. Unreal Engine 4 中的 UI 优化技巧

    转自:https://mp.weixin.qq.com/s/bybEHM9tF-jBPxxqXfrPOQ## Unreal Open Day 2017 活动上 Epic Games 开发者支持工程师郭 ...

  9. Unreal Engine 4 Radiant UI 插件入门教程(二)

    本篇章前提要求:在UE4上安装了Radiant UI插件.如果没有安装,请找其它教程(或者是笔者的其它的教程,目前正在写). 本教程的目的:探讨如何从网页元素中调用蓝图中的内容: 第一步: 写一个网页 ...

随机推荐

  1. hql学习记录

    ` String hql = "from SysUser o join o.set where owner_id = :newName"; Query query = this.g ...

  2. Centos6.5下ElasticSearch1.4.4的安装

    1.下载ElasticSearch 官网地址 https://www.elastic.co/ 2.安装elasticsearch-1.4.4.tar.gz tar -zxvf elasticsearc ...

  3. firefox和chrome实现页面打印自动分页

    在Firefox和chrome中直接调用打印功能的js方法是 window.print(); 但是如果页面很长,那么就需要分页,这时只需要在页面中添加css属性即可,如果想自动分页,则如下所示 < ...

  4. Phoenix性能优化

    目录: 1.建表优化 2.二级索引 3.并行处理 1.建表优化 Salting 翻译成中文是加盐的意思,本质是在hbase的rowkey的byte数组的第一个字节位置设定一个系统生成的byte值, 这 ...

  5. Java -- 数据库 多表操作,1对多,多对多,1对1。 基于dbutils框架

    1. 1对多,部门--员工 为例, 多的一方建外键. domain,建立bean对象 public class Department { private String id; private Stri ...

  6. Codeforces Round #285 (Div. 2) A, B , C 水, map ,拓扑

    A. Contest time limit per test 1 second memory limit per test 256 megabytes input standard input out ...

  7. Asp.net 检测到有潜在危险的 Request.From值

    因为Asp.net对客户端提交的数据进行了基本的安全验证,检测是否有最基础的 sql注入 或者 xss跨站脚本攻击代码. 如果你提交了:</div><script type=&quo ...

  8. SQL Server 删除默认值

    alter table st_FuelConvertPatternSetting alter column tank_max_size decimal(5,2) not null declare @c ...

  9. 【.Net】调用Web API的几种方式

    引言 记录一下调用Web API的几种方式,以调用百度API为例. HttpWebRequest HttpWebRequest位于System.Net命名空间,是常用的调用Web API类库. str ...

  10. android中shape的属性

    <shape> <!– 实心 –> <solid android:color=”#ff9d77″/> <!– 渐变 –> <gradient an ...