Unity实用技能-UI进度条

实用技能系列

  1. Unity实用技能-UI滑动条技能总结
  2. Unity实用技能-UI规范总结
  3. Unity实用技能-协作规范总结
  4. Unity实用技能-UI与粒子效果总结
  5. Unity实用技能-UI定位总结
  6. Unity实用技能-背景自适应文本

文章目录


前言

这段时间接触了进度条内容,总结一下


进度条主要包含哪些内容?

  1. 进度条框架
  2. 背景图尺寸自适应
  3. 随机背景图片替换
  4. 进度条加载

进度条框架是怎样的?

  1. 包括业务部分和数据部分,两者各自有一个基类,针对PVP和PVE各自继承基类扩展
  2. 还有类似管理器的部分,支持对继承的类进行预加载等管理
  3. 业务基类支持统一的进度条提示文本,以及进度条加载。如下图鸣潮的加载提示和进度条

背景图尺寸如何自适应?

问题的背景是美术统一出了一个1624x750尺寸的加载图,但加载图本身无法用九宫格拉伸,直接使用Unity的这个锚点导致不同分辨率下加载图会被压缩,也就是没有保持图片比例,表现上不好看

  1. 思路上比较简单,就是锚点居中,然后用代码来改变图片尺寸

  2. 代码中具体做法就是获取画布的尺寸,然后用画布尺寸的对应宽和高分别除以图片标准尺寸的宽和高,如1624x750;得到的宽和高两个比值进行比较,得到比值较大的,以此为标准,用图片标准尺寸的宽和高分别与这个比值相乘来放大图片即可


随机背景图片如何替换?

美术出了很多张同尺寸的背景图,需要给进度条的大背景换图

  1. 首先在我司的项目中,直接换图会导致图片加载慢半拍,所以实际换图需要利用好预加载,实际上加载的View对象也是在游戏过程中不删除的,也就是一直在内存中
  2. 直接做法就是在登陆时预加载所有的备选图片,这样任选一张图片来替换背景都可以立刻替换
  3. 但项目中在登陆时预加载的图片不会一直存在于游戏过程中,所以最终采用的是用两个Image对象分别交替加载背景图完成需求
  4. 对于这些图片资源,显然其数量可以通过策划配置来得到

进度条如何加载?

  1. 基本思路就是通过协议事件来更实时更新进度条数值,总计3个,即开始、更新过程、结束事件
  2. 大部分的更新进度条都在更新过程,开始和结束主要是为了保证临界值表现正确

总结

目前遇到的格式化问题就是这样,之后有新的格式化问题也会继续在这里补充

相关推荐
laowangpython13 天前
Photoshop 2025 下载安装全攻略
其他·ui·photoshop
风华圆舞13 天前
Flutter + 鸿蒙 Intents Kit:页面直达能力的完整接入方案
flutter·ui·华为·harmonyos
鲲穹AI超级员工13 天前
多款实用配色工具汇总,适配设计、UI 创作等多元场景
ui·色彩设计
UXbot13 天前
帮助企业低门槛开展AI应用开发的平台推荐
前端·低代码·ui·交互·产品经理·原型模式·web app
叶帆13 天前
【YFIOs】用C#开发硬件之设备上云
开发语言·unity·c#
烂白菜13 天前
智码美形:华为云码道 × UI-UX-Pro-Max 高品质界面智能生成实践
ui·华为云·ux
久数君13 天前
AI三维建模工具“造形家”:地理场景三维化的高效解决方案
unity·glb·ai算法·ai三维建模工具·地图框选·造形家·城市建筑模型
像风一样的男人@13 天前
python --实现代理服务器
git·ui
风华圆舞13 天前
鸿蒙 Flutter 页面怎么感知防窥状态并调整 UI 可见性
flutter·ui·harmonyos
UXbot13 天前
如何选择适合公司项目的UI设计工具?企业选型指南
前端·低代码·ui·团队开发·原型模式·设计规范·web app