开启辅助访问
 找回密码
 注册帐号

扫一扫,访问微社区

蛮牛译馆

关注:514

当前位置:游戏蛮牛 技术专区 蛮牛译馆

查看: 1795|回复: 10

[Unreal教程] UE4 UMG教程——游戏关卡选择菜单

[复制链接]  [移动端链接]
排名
7281
昨日变化
9

136

主题

169

帖子

1036

积分

Rank: 15Rank: 15Rank: 15Rank: 15Rank: 15Rank: 15

UID
159865
好友
9
蛮牛币
1853
威望
0
注册时间
2016-8-1
在线时间
497 小时
最后登录
2017-3-29

蛮牛译员

发表于 2016-12-1 15:10:47 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?注册帐号

x
本帖最后由 manew_JR 于 2016-12-1 15:12 编辑

UE4 UMG教程——关卡选择菜单

1.png
本教程将要创建关卡选择界面,这次我们将创建:
     
关卡标签的UMG
关卡预览的UMG
主菜单UMG 控件来显示关卡选择屏幕
更新关卡数据结构
之前的教程中我已经使用C++创建了关卡的数据结构,现在加载两个新的变量到结构体中
    ID (int),
    isUnlocked (bool),
本教程中我将不会使用isUnlocked 这个变量,这将在以后的教程中才会被用到
加载一个关卡到游戏实例中
2.jpg
打开你的游戏实例类,然后从关卡数据结构中创建名称为Levels的变量,并将变量设置为数组,在数组中添加三个变量
大体上,每一个关卡应该有不同的标签,在初始的飞船菜单界面上以及当鼠标移动到标签时会在界面的右上角背景上显示关卡预览及相关游戏信息。
创建关卡标识
这一步特别的简单—打开每一个关卡的游戏然后截图作为你的关卡标签封面。分辨率油腻自己决定,子在这里我们设置为200x114.
3.png
将这个截图导入到内容浏览器中并且创建为材质,命名为M_Level0_Icon
4.jpg
为了让游戏UI效果更好,我需要做一个飞船的光环贴图而不需要使用materials,如下图:
5.jpg
创建关卡背景
你可以采用和标签同样的截图,但是使用更好地分辨率。因为这样会让实现起来更简单,我设置为606x346.创建Level0_Background_Mat material:

6.jpg
同样的,这也可以使用ps就可以完成而不需要使用材质
创建飞船贴图
我将使用框架材质来满足充满设计感的透视飞船结构图作为我的UI的屏幕背景。你可以在这里下载这个插件以及导入FBX到你的内容浏览器中(因为这个插件是在Unity中使用的,所以不能直接在Unreal中使用这个插件,只能导入FBX)。剩下的标签以及背景我将使用上述创建的资源。
创建一个materials。在这里我们需要设置为网格线框
7.jpg
将飞船放置在你的关卡中然后分配材质,        创建一个1024x1024的屏幕截图。
8.png
现在从名字为ShipIcon_Mat的贴图中创建一个新的材质
9.jpg
现在你就可以创建你的关卡选择UMG了,将之前创建的标签背景等材质拖入到文章最开始创建的关卡数组中!在这里我创建三个UMG标签,但是他们都链接在一个游戏关卡下,这样也会节省很多的时间。
创建关卡标签Widget
现在来玩儿真正的东西了!创建用户界面里的Widget并命名为UI_LEVELICON
这里是视频网址:
打开我们之前做好的标签图片材质,添加如下变量:
Level Data (Level Data Structure),
isSelected (bool),
LevelID (int, editable),
并使用线性数据结构的输入添加命名为Onselected的调度函数
创建新的Custom Event名称为setDefaults,这样就将标签链接到我们的关卡界面中
11.jpg
创建另一个custom event命名为GetLevelInfoFromID
12.jpg
这个功能就是在关卡数组中使用ID号来寻找关卡,如果有相同ID的关卡被找到将会存储关卡的信息被以后使用
接下来就是在事件结构中调用刚才建立的两个函数
13.jpg
因为UMG不包含当鼠标停留或者是移动到按钮时触发的功能,所以我们需要使用全局变量。为了实现这个功能,我们需要覆写OnMouseEnter以及 OnMouseLeave 函数:
14.jpg
15.jpg
按以上连接并编译后会发现有以下的动画效果。当鼠标移动到标签或者是停留时,标签就会放大,这样就有了我们第一个UI的效果
16.gif
现在就是要做下一件事情了,当我们的鼠标点击标签时,飞船UI界面上会在右上角显示关卡背景以及此关卡的相关信息
创建两个custom事件:SetSelected以及SetNotSelected:
17.jpg
现在为刚才标签按钮设置onclicked是的事件,创建新的custom事件命名为MakeDefaultButton:
18.jpg
为什么设置默认按钮时必要的呢?例如,我如果想在关卡选择UI界面上选择打开第一关关卡,我单击第一关上的标签时,也会调用OnSelected事件,所以需要设置默认的按钮事件。
创建可动文本控件

创建一个新的用户界面控件蓝图并命名为Widget_AnimatedText
这个蓝图只包含文字(对variable标签打勾)而不需要使用画布
添加如下变量:
Text (string),
TextChar (string array),
Speed (float, default: 0,02, editable),
Counter (int),
AccumulatedDelay (float)
创建新的custom事件命名为PrintText:
19.jpg

如果想具体学习如何加载可动文本,参考如下教程:
创建新的custom事件命名为AnimText并连接Get Character Array from string
20.jpg
这样就会触发动画并且确保变量被重置
创建关卡选择UMG
现在就剩下最后一步了,做屏幕上的关卡选择UI
21.png
打开我们创建的飞船骨骼材质控件蓝图并添加如下变量
SelectedLevelData (Level Data Structure)
首先设置第一关链接的按钮,如下:
22.jpg
创建新的custom事件,并命名为UpdateLevelData
23.jpg
以上的蓝图实现了收集SelectedLevelData结构体的信息并且更新所有的控件。触发文本动画并且改变背景标签
这就是本节所有的教程内容!测试你加入的控件最好的方法就是在关卡蓝图中加载下面的部件:
26.jpg
启动时你就可以测试你建立的UI是否可以正常使用。
30.png








     蛮牛译林军福利多多哦!
155547iluo7umxezrb2ekr.png



更多图片 小图 大图
组图打开中,请稍候......

回复

使用道具 举报

5熟悉之中
867/1000
排名
44798
昨日变化
55

0

主题

489

帖子

867

积分

Rank: 5Rank: 5

UID
63377
好友
0
蛮牛币
0
威望
0
注册时间
2014-12-24
在线时间
376 小时
最后登录
2017-3-29
发表于 2016-12-1 22:43:51 | 显示全部楼层
好厉害啊啊啊

回复

使用道具 举报

4四处流浪
447/500
排名
3223
昨日变化
1

0

主题

21

帖子

447

积分

Rank: 4

UID
159672
好友
0
蛮牛币
947
威望
0
注册时间
2016-7-30
在线时间
124 小时
最后登录
2017-3-2
发表于 2016-12-2 07:51:38 | 显示全部楼层
信息量很大呀

回复

使用道具 举报

4四处流浪
474/500
排名
4816
昨日变化
7

4

主题

147

帖子

474

积分

Rank: 4

UID
175029
好友
5
蛮牛币
964
威望
0
注册时间
2016-10-12
在线时间
131 小时
最后登录
2017-3-14
发表于 2016-12-2 09:40:25 | 显示全部楼层
66666666666666
[发帖际遇]: 一个袋子砸在了 上善若水jf 头上,上善若水jf 赚了 1 蛮牛币. 幸运榜 / 衰神榜

回复

使用道具 举报

排名
14692
昨日变化
7

0

主题

16

帖子

57

积分

Rank: 2Rank: 2

UID
176515
好友
0
蛮牛币
72
威望
0
注册时间
2016-10-18
在线时间
16 小时
最后登录
2017-3-25
发表于 2016-12-2 14:08:08 | 显示全部楼层
666666666666666666666

回复 支持 反对

使用道具 举报

5熟悉之中
714/1000
排名
2197
昨日变化
9

0

主题

41

帖子

714

积分

Rank: 5Rank: 5

UID
148134
好友
0
蛮牛币
1030
威望
0
注册时间
2016-5-10
在线时间
227 小时
最后登录
2017-3-29
QQ
发表于 2016-12-3 09:07:36 | 显示全部楼层
堡垒说的对,很好很强大!
[发帖际遇]: harytian 在网吧通宵,花了 2 蛮牛币. 幸运榜 / 衰神榜

回复 支持 反对

使用道具 举报

6蛮牛粉丝
1413/1500
排名
946
昨日变化
2

0

主题

384

帖子

1413

积分

Rank: 6Rank: 6Rank: 6

UID
111260
好友
0
蛮牛币
4519
威望
0
注册时间
2015-6-30
在线时间
223 小时
最后登录
2017-3-29
发表于 2016-12-3 09:54:31 | 显示全部楼层
堡垒说的对,很好很强大!

回复 支持 反对

使用道具 举报

排名
13055
昨日变化
5

0

主题

21

帖子

69

积分

Rank: 2Rank: 2

UID
101550
好友
1
蛮牛币
27
威望
0
注册时间
2015-5-19
在线时间
16 小时
最后登录
2017-1-9
发表于 2016-12-4 22:21:45 | 显示全部楼层

好厉害啊啊啊
[发帖际遇]: 余帥哥 乐于助人,奖励 3 蛮牛币. 幸运榜 / 衰神榜

回复

使用道具 举报

4四处流浪
444/500
排名
3847
昨日变化
3

0

主题

59

帖子

444

积分

Rank: 4

UID
118728
好友
0
蛮牛币
1828
威望
0
注册时间
2015-8-18
在线时间
135 小时
最后登录
2017-3-17
发表于 2016-12-6 09:54:13 | 显示全部楼层
不会用啊

回复

使用道具 举报

4四处流浪
348/500
排名
4645
昨日变化
41

1

主题

46

帖子

348

积分

Rank: 4

UID
169367
好友
0
蛮牛币
1073
威望
0
注册时间
2016-9-20
在线时间
97 小时
最后登录
2017-3-29
发表于 2016-12-8 10:00:38 | 显示全部楼层
UE4 好学吗 好像unity更加普及是吗  他们两个有什么联系吗
[发帖际遇]: Root915 乐于助人,奖励 1 蛮牛币. 幸运榜 / 衰神榜

回复 支持 反对

使用道具 举报

5熟悉之中
834/1000
排名
1975
昨日变化
5

0

主题

79

帖子

834

积分

Rank: 5Rank: 5

UID
92111
好友
0
蛮牛币
1181
威望
0
注册时间
2015-4-14
在线时间
265 小时
最后登录
2017-3-29
发表于 昨天 16:06 | 显示全部楼层
不得不留下点什么

回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册帐号

本版积分规则

快速回复 返回顶部 返回列表