Unity跨平台UI解决方案:可能是最全的FairyGUI系列教程-第八天

简介: 众所周知,人生是一个漫长的流程,不断克服困难,不断反思前进的过程。在这个过程中会产生很多对于人生的质疑和思考,于是我决定将自己的思考,经验和故事全部分享出来,以此寻找共鸣!!!

👉即将学会

从头到尾了解并学习FairyGUI在Unity平台的应用

👉背景

Unity 2019.x系列

FairyGUI 2021.2系列

👉实践过程

窗口

窗口花样百出,可以设置任意组件作为她的显示内容,且窗口支持拖动。

窗口样式内容你需要在FairyGUI中提前编辑好,制作好后,需要在Unity中用代码进行管理。

Window win = new Window();

GRoot里提供了一些窗口管理的常用API。

  1. BringToFront 把窗口提到所有窗口的最前面。
  2. CloseAllWindows 隐藏所有窗口。注意不是销毁。
  3. CloseAllExceptModals 隐藏所有非模态窗口。
  4. GetTopWindow 返回当前显示在最上面的窗口。
  5. hasModalWindow 当前是否有模态窗口在显示。

动效-重点

又是一个重点,FairyGUi除了静态UI外,动效UI做起来也很轻松

在上面讲编译器主页面的时候就说过了动效。更多图文并茂参考官方文档。

适配

做过Android开发的都知道,适配是个体力活,一分钟开发三分钟适配,即使开始经验充足或者使用了今日头条的适配,后续仍然可能有需要适配的。

FairyGUI为手游提供了自动适应各个设备分辨率的UI策略。选择一个设计分辨率的图片(通常为全屏界面)来进行开发,运行的时候会根据设备将UI界面经过缩放投到屏幕上。

有一个很有意思的机制:假如整体需要放大两倍的话,一个窗口为400*400的,投射到屏幕上是800*800放大后的,但是你用代码读取窗口的宽高时,仍然是400*400且坐标也不变化。

除了等比的缩放,有一点就得需要注意-全屏,现在有的全面屏手机,高度贼拉长,有的高度正常,大部分手机宽度基本一致,这就导致宽高比不一样,就需要有所调整了:

如果你使用的是UIPanel,那么在Inspector上设置Fit Screen为Fit Size就可以了

多国语言

三部曲

  1. 现在FairyGUI中做好你的界面,最后再适配多国语言,点击“工具-字符串导入和导出”,导出来
  2. 复制一份导出来的文件,开始进行翻译,翻译完毕后修改下文件后缀挂上en和上面导出的放在同一地方(Unity里面的文件夹)
  3. 代码动态加载语言文件FairyGUI.Utils.XML xml = new FairyGUI.Utils.XML(fileContent);

UIPackage.SetStringsSource(xml);

注意:语言不能动态实时切换,要想中切英或者英切中,都需要先销毁所有UI卸载所有包

导入和导出

这个功能和Unity的功能类似,Unity是.unitypackage后缀文件,FairyGUI是. Fairypackage后缀文件。

FairyGUI帮助我们从Unity中解脱出来,提高生产力,那么有想法的人又开始“得寸进尺”了,

虽然由原来纯Unity实现转为UI靠拼拼点点无代码开发,但是UI出图后用FairyGUI开发仍然需要人力和事件。

啊,这思想就有点过分了啊,难不成直接从UI图全自动帮你生成FairyGUI?开玩笑,不过确实是有:psd2fgui,但她未必能满足每个人的项目需求,只能作为辅助工具。

psd2fgui开源地址:github.com/fairygui/ps…,看名字就知道她是将PSD转为FGUI。

首先准备PSD文件:

网络异常,图片无法展示
|

如上图所示,使用图层名称或组名称来表达它的类型和用途。以下是约定的细节:

按钮 组的名称以Button开始表示这个组是一个按钮。组内的层如果名称中含有下面定义的特殊字符串(注意是包含即可,不是相同。推荐作为后缀),表示这个图层的特别含义:

@up 这个图层只在按钮的up状态显示

@over 这个图层只在按钮的over状态显示

@down 这个图层只在按钮的down状态显示

@selectedOver 这个图层只在按钮的selectedOver状态显示

@title 文字用作按钮的标题

@icon 图片用作按钮的图标

组件 组的名称以Com开始表示这个组是一个组件。组件可以嵌套。

用命令进行转换提取,之后在FairyGUI中导入资源包。

Unity使用

将编辑好的UI在Unity中使用也很简单

  1. Unity下载FairyGUI插件并导入
  2. 将Fairy GUI中发布的资源放到Unity项目文件夹下,Resources下即可
  3. 如果第一步成功,在你的场景Hierarchy中右键会有FairyGUI选项,创建UIPanel
  4. 在UIPanel中的Package Name选择你在FairyGUI的包名,ComponentName选择你的主场景组件
  5. 显示成功,你还可以添加UIContentScaler脚本设置分辨率相关


👉其他

📢作者:小空和小芝中的小空

📢这位道友请留步☁️,我观你气度不凡,谈吐间隐隐有王者霸气💚,日后定有一番大作为📝!!!旁边有点赞👍收藏🌟今日传你,点了吧,未来你成功☀️,我分文不取,若不成功⚡️,也好回来找我。

相关文章
|
9天前
|
前端开发 数据安全/隐私保护
全新紫色新UI数码盲盒系统源码/全开源无加密/附教程
全新紫色新UI数码盲盒系统源码/全开源无加密/附教程 前端uniapp+H5 后端FastAdmin框架 可打包成APP多端运行 亲测可用
33 13
|
2月前
|
消息中间件 存储 JSON
rabbitmq基础教程(ui,java,springamqp)
本文提供了RabbitMQ的基础教程,包括如何使用UI创建队列和交换机、Java代码操作RabbitMQ、Spring AMQP进行消息发送和接收,以及如何使用不同的交换机类型(fanout、direct、topic)进行消息路由。
31 0
rabbitmq基础教程(ui,java,springamqp)
|
2月前
|
JavaScript 索引
Vue开发中Element UI/Plus使用指南:常见问题(如Missing required prop: “value“)及中文全局组件配置解决方案
Vue开发中Element UI/Plus使用指南:常见问题(如Missing required prop: “value“)及中文全局组件配置解决方案
143 0
|
4月前
|
编解码 前端开发 vr&ar
从零开始的PICO教程(4)--- UI界面绘制与响应事件
这篇文章是PICO开发系列教程的第四部分,主要介绍了如何在PICO 4 VR环境中创建UI界面,包括Canvas和Panel的配置、UI元素的绘制、以及Button和Slider的事件响应绑定,并通过示例展示了数字增减和滑块功能的具体实现。
从零开始的PICO教程(4)--- UI界面绘制与响应事件
|
3月前
|
前端开发 图形学 开发者
【独家揭秘】那些让你的游戏瞬间鲜活起来的Unity UI动画技巧:从零开始打造动态按钮,提升玩家交互体验的绝招大公开!
【9月更文挑战第1天】在游戏开发领域,Unity 是最受欢迎的游戏引擎之一,其强大的跨平台发布能力和丰富的功能集让开发者能够迅速打造出高质量的游戏。优秀的 UI 设计对于游戏至关重要,尤其是在手游市场,出色的 UI 能给玩家留下深刻的第一印象。Unity 的 UGUI 系统提供了一整套解决方案,包括 Canvas、Image 和 Button 等组件,支持添加各种动画效果。
151 3
|
4月前
|
图形学 开发者 存储
超越基础教程:深度拆解Unity地形编辑器的每一个隐藏角落,让你的游戏世界既浩瀚无垠又细节满满——从新手到高手的全面技巧升级秘籍
【8月更文挑战第31天】Unity地形编辑器是游戏开发中的重要工具,可快速创建复杂多变的游戏环境。本文通过比较不同地形编辑技术,详细介绍如何利用其功能构建广阔且精细的游戏世界,并提供具体示例代码,展示从基础地形绘制到植被与纹理添加的全过程。通过学习这些技巧,开发者能显著提升游戏画面质量和玩家体验。
169 3
|
4月前
|
图形学 数据可视化 开发者
超实用Unity Shader Graph教程:从零开始打造令人惊叹的游戏视觉特效,让你的作品瞬间高大上,附带示例代码与详细步骤解析!
【8月更文挑战第31天】Unity Shader Graph 是 Unity 引擎中的强大工具,通过可视化编程帮助开发者轻松创建复杂且炫酷的视觉效果。本文将指导你使用 Shader Graph 实现三种效果:彩虹色渐变着色器、动态光效和水波纹效果。首先确保安装最新版 Unity 并启用 Shader Graph。创建新材质和着色器图谱后,利用节点库中的预定义节点,在编辑区连接节点定义着色器行为。
280 0
|
4月前
|
前端开发 图形学
Unity精华☀️UI和物体可见性的判断方法
Unity精华☀️UI和物体可见性的判断方法
|
3月前
|
图形学 iOS开发 Android开发
从Unity开发到移动平台制胜攻略:全面解析iOS与Android应用发布流程,助你轻松掌握跨平台发布技巧,打造爆款手游不是梦——性能优化、广告集成与内购设置全包含
【8月更文挑战第31天】本书详细介绍了如何在Unity中设置项目以适应移动设备,涵盖性能优化、集成广告及内购功能等关键步骤。通过具体示例和代码片段,指导读者完成iOS和Android应用的打包与发布,确保应用顺利上线并获得成功。无论是性能调整还是平台特定的操作,本书均提供了全面的解决方案。
156 0
|
4月前
|
开发者 图形学 iOS开发
掌握Unity的跨平台部署与发布秘籍,让你的游戏作品在多个平台上大放异彩——从基础设置到高级优化,深入解析一站式游戏开发解决方案的每一个细节,带你领略高效发布流程的魅力所在
【8月更文挑战第31天】跨平台游戏开发是当今游戏产业的热点,尤其在移动设备普及的背景下更为重要。作为领先的游戏开发引擎,Unity以其卓越的跨平台支持能力脱颖而出,能够将游戏轻松部署至iOS、Android、PC、Mac、Web及游戏主机等多个平台。本文通过杂文形式探讨Unity在各平台的部署与发布策略,并提供具体实例,涵盖项目设置、性能优化、打包流程及发布前准备等关键环节,助力开发者充分利用Unity的强大功能,实现多平台游戏开发。
113 0