CryENGINE3系列总结教程之UI/HUD(一)制作生命条弹药条Flash部分

网上的一位朋友在写UI部分遇到了点问题，本着俺不入地狱谁入地狱的大无畏奉献精神，我提前啃起了CE3的UI部分。今天就来通过一个简单的示例----制作生命条、丹药条来大概捋捋CE3是的UI/HUD是如何使用的。一下内容大部分选自《CryENGINE3 GameDevelopm Beginner Guide》，但是因为本书年代有点久远，版本已经跟不上时代了，所以里面有一些内容比如节点名称、位置，控制台命令等都已经变动，我是用的是算是最新版3.11，应该可以和大部分人使用的版本差不多，然后主要是把有变化的地方为大家指出来，使大家可以更方便快速的创建自己的UI/HUI。

好了，废话不多说，直接进入主题。

（一）创建生命条、丹药条

首先先把那先乱七八糟的概念省掉，直接按步骤来创建，稍后再把一些概念性质的尝试贴出来。

1.FLASH部分--ActionScript2

因为我本身没有专门学过Flash，所以就没有用最新版，而是选取了和教程上一样的版本：Flash CS5.5，大家如果对这部分比较熟悉，可以按照自己的想法来。

（1）建立AS2项目，设置脚本为2.0，播放器为Flash8，尺寸为1280*720（16:9）

（2）为了能更好的控制一些按钮，可以进入游戏，截图作为参考，截图后可以使用PS保证图片为1280*720尺寸

截图时，可以按快捷键~（1左边的那个）唤出控制台，输入控制台命令:

r_DisplayInfo 0 （禁用右上角信息）

hud_hide 1(禁用Demo的HUD。注意，这里和书上的说法不一样。这个指令在不同的版本中，用法不同：

3.6版本以后都是hud_hide 1；3.3以前都是cl_hud；其他都是书上说的那个：g_showhud）

（3）然后把图片导入到库，并用PS绘制两个进度条，分别表示生命条和丹药条，同样导入到库。

（3）制作健康条

a.新建影片剪辑，库中右键，新建元件，命名为HealthBar；

b.从库中将greenBar元件拖放到HealthBar影片剪辑的舞台中；

c在时间轴中选择layer并复制图层

d重命名这些图层为：BarEmpty和BarFilled。（右键属性，改名字）

e.确保BarFilled在BarEmpty上面

g.选择MASK图层的第一帧，解锁这个图层，移动矩形到左侧，这样矩形的右侧边界和绿色调的左侧编辑匹配

再次锁定MASK图层，在时间轴中移动滑动条查看结果，如下图

h.最后：

h.影片剪辑部分就做完了，现在回到场景一，把两个影片剪辑拖到舞台，并给他们实例名：ammoMC，和healthMC。

11.我们需要两个函数：如下定义

setAmmo：设置当前弹药

setCurrentWeapon：设置当前武器

function setAmmo(currAmmo:Number,maxAmmo:Number)
{if(maxAmmo>0)//normal weapon{ammoMC.currAmmo.text = currAmmo + "/" + maxAmmo;ammoMC.gotoAndStop(Math.floor((currAmmo / maxAmmo)*99)+1);}else //melee weapon{ammoMC.currAmmo.text = "-";ammoMC.gotoAndStop(100);}}
function setCurrentWeapon(weaponName:String,ammoName:String)
{ammoMC.currAmmoName.text = ammoName;ammoMC.currWeaponName.text = weaponName;}

12.保存这个NewHUD.fla文件，发布swf文件。选择文件|发布，或者快捷键Alt+Shift+F12

好了，到目前为止，我们已经完成了简单swf的制作，剩下的工作就是把swf导入到CE3，写脚本关联代码，实现生命条，和弹药条。最后在说明一下，因为我也不是很懂Flash，所以只能跟着教程一步一步来，这片总结中用到了大量原教材的图片，在flash制作之部分，教材中没有出现错误，只是因为教材中的图片不是很清晰，我又重新做了一遍，给大家截了清晰的图。还是那句话，如果大家有问题，可以再下面留言，我们可以等着大神来为我们解答~

好大的工作量，最后给大家来一张顺利导入CE3的图吧！

CryENGINE3系列总结教程之UI/HUD(一)制作生命条弹药条Flash部分相关推荐

CryENGINE3系列总结教程之UI/HUD(二）Flash资源导入CE3
紧接上回,既然我们已经成功做好了生命条和弹药条的动画,并且已经发布,那么就是时候导入到ce3了,好了废话不多说,直接进入步骤. (一)创建xml文件 1.在<engine root>\G ...
NVIDIA Jetson TX1 系列开发教程之二：刷机与开发前准备
NVIDIA Jetson TX1 系列开发教程之二:刷机与开发前准备转载请注明作者和出处:http://blog.csdn.net/u011475210 嵌入式平台:NVIDIA Jetson T ...
狂神说Java系列视频教程之docker(记录到swarm安装)
狂神说B站视频地址–基础狂神说B站视频地址–进阶安装docker #1.卸载旧版本yum remove docker \docker-client \docker-client-latest \d ...
micropython教程nucleo-f767zi开发板_Micropython教程之TPYBoard开发板制作电子时钟（萝卜学科编程教育）...
1.实验目的 1. 学习在PC机系统中扩展简单I/O?接口的方法. 2. 什么是SPI接口. 3. 学习TPYBoard I2C接口的用法. 4. 学习LCD5110接线方法. 5. 设定时钟并将当前 ...
linux使用安卓厨房,【图片】【教程】进阶教程之“使用安卓厨房制作/修改ROM包”【联想a798t吧】_百度贴吧...
该楼层疑似违规已被系统折叠隐藏此楼查看此楼 4．然后是美化不喜欢或者不懂美化的同学可以绕过这一步了.这一步骤是毕竟比较难的,整个制作过程中涉及到手动反编译的就在这里. 美化主要是弄以下方面,修改s ...
android 布局可大可小,UI设计教程之：ios与android ui适配（将IOS UI转换成Android经验畅谈）...
内容提要:这是UI设计系列教程之ios与android ui适配经验畅谈.文章作者介绍了自己将IOS UI转换成Android经验,包括:不要直接转换.了解单位和组件缩放格式.屏幕尺寸DP和像素的换算 ...
java jdbc 教程_java JDBC系列教程之JDBC类的简析与JDBC的基础操作
什么是JDBC? 概念:JAVA Database Connectivity Javas数据库连接,Java语言操作数据库接口,然后由各个数据库厂商去实现这个接口,提供数据库驱动java包,我们可以使 ...
w3cschool教程之jQuery UI 教程概述
w3cschool教程之jQuery UI 教程概述链接地址: http://www.w3cschool.cc/jqueryui/jqueryui-tutorial.html w3cschool教程 ...
乐鑫代理-启明云端分享ESP32系列教程之二：Linux搭建esp-idf环境
提示:此教程依据乐鑫官方的ESP32入门教程总结而来,仅供个人参考学学习,如有错误,欢迎批评指正.乐鑫官方参考: 乐鑫官方文档地址 1.搭建esp-idf环境 1.1安装虚拟机与Ubuntu 未安装请 ...

CryENGINE3系列总结教程之UI/HUD(一)制作生命条弹药条Flash部分

CryENGINE3系列总结教程之UI/HUD(一)制作生命条弹药条Flash部分相关推荐

最新文章

热门文章