将FariyGUI的运行库导入至Unity项目中,废话不说咱们直接开始
FairyGUI运行库:
下文用到的图片素材:
将该压缩包内文件解压,路径结构如图
制作游戏大厅面板的UI,打开FGUI将新项目默认带有的两个东西改名(如图)
【PS:本文章会以一个游戏DEMO带大家慢慢深入游戏,但不代表之后你只能做这个类型的游戏】
LobbyBasis为一个包(包的概念主要是为了方便管理UI资源)
LobbyPanel为一个面板(可以简单理解为游戏中的一个页面)
双击打开LobbyPanel在右上角检查器设置尺寸720*1280
右键LobbyBasis包新建两个文件夹(如图)
Images用于将来存放一些图片资源
Widgets用来存放一些UI小部件
将下载的图片资源拖入Images文件夹
将lobby_bg拖入LobbyPanel中,并点击侧片栏制作一个文本控件,命名与参数如图
3、制作第一个按钮(游戏中最常用到的控件之一)
在Widgets文件下点击头部栏第四个按钮(如图),创建一个按钮,参数如下,点击创建
删除控制器(控制器是FariyGUI很重要的一个功能,后面再说,暂时不需要)
按钮参数修改(尺寸和按下效果)
将按钮内自带的东西全删了,然后将blue_btn拖入,设置位置为0,0
【 至此你可以点击头部栏的播放按钮,进行点击测试,按钮是不是已经可以点击,并且有一个缩放的效果了】
好像还缺了啥?
按钮要有一个文本,文本的创建方式上面已经有提及,就不再赘述
文本取名为title(划重点,后面再说为什么)
按钮制作完成,拖入LobbyPanel看看效果,记得给按钮取好名,后面要用代码获取
4、导入Unity
UI部分大功告成,接下来就是让它在Unity中显示出来了
上方工具栏进入发布设置,设置好对应的发布路径(如图),然后点击发布
可以看到Unity对应的文件夹下多出了这两份文件
右键红框区域-Create-C# Script创建第一个C#脚本:Main.cs 【这将会是游戏后续的代码逻辑入口】
删除Directional Light 然后右键创建Create Empty(创建完后重命名为Main)用于挂载Main脚本
把Main脚本拖到箭头的方向即可
选择MainCamera,去处CullingMask中的UI勾选
如图,选择一下Unity的窗口尺寸,点击+号,然后新增一个720*1280的(与我们的UI尺寸一致),并选中
现在要设置一下Unity和Rider的关联,在Unity左上方的工具栏中Edit-Preferences中选择Rider
双击Main即可使用Rider打开Main.cs脚本,终于可以开始写代码了~
运行Unity,画面成功出现了,并且按钮也可以点击,只是目前还没有任何反应
现在我们来给这个按钮增加,每点击一次,对应显示点击次数的文本就刷新的功能
运行游戏,发现每一次点击按钮已经能够有反应了,大功告成~