UGUI整体解决方案-案例篇_第六章
血条场景,运行后的效果,如图所示
这个血条,是可以支持,多个不同的血条状态; 其中,血条数据,是通过LifeBarData结构体,进行控制; 结构体包含,图片BarSprite和颜色BarMainColor,这里的demo,只测试了,不同的颜色血条切换,暂时没测试,不同的图片切换;
血条对应的预制体,是这个,其中NextBar和CurrentBar分别是,下一个血条和当前血条,两者都包含的AdditionBar是用来添加,血条增减的动画特效
血条本身,会挂载两个脚本,其中一个就是LifeBarItem,其中包含,位置信息RectTransform 和 图片Image 俩组件的获取器
然后,还会弄一个子item,就是用作增减动效的AdditionBar节点,也是新增这个LifeBarItem组件,另外_defaultWidth默认宽度,就是 RectTransform 本身的宽度width; SetData设置数据函数,传参就是LifeBarData结构体,自身的颜色和图片,还有子物体的颜色和图片,都是使用同一个data即可;
增减过程,有可能会出现,越界的情况,就需要两个函数,分别是设置尺寸,实现归零、恢复默认尺寸
GetOutOfRange调用以上越界的逻辑判断
通过调用ChangeLife函数,如果动效子节点不为空,就通过Dotween动画插件,使用DOFade透明化接口,0.5秒内,子节点完成血条增减的动画特效处理; 自身的RectTransform的sizeDelta尺寸,根据修改生命值的value,修改即可,正负代表增减; 然后,调用上述的越界检测处理GetOutOfRange函数即可;
血条挂载的,另一个脚本,就是LifeBar,其中声明的_target,指的是挂载在对应的目标物体上; offset是对于目标物体而言,进行的位置偏移数值; data就是多个血条的数据队列容器; nextbar和currentbar,就是下一、当前血条,在逻辑上,会根据血条增减过程,切换两者; unitLifeScale是血条RectTransform的width宽度,配合总血条数据数目,和最大生命值,换算得到的,缩放,用来配合修改,血条增减的显示比例; currentIndex就是当前血条数据的索引;
设置血条数据的SetBarData接口,是根据index血条数据索引,和总的血条数据队列容器,对当前血条currentBar,和下一血条nextBar,调用上述SetData完成数据的赋值
这是LifeBar修改生命值的接口,外部调用血条修改生命,也是通过这个逻辑接口,进行调用; 配合unitLifeScale,调用LifeBarItem组件的ChangeLife接口,得到血条偏移的width,判断是否已经减少到,当前血条currentBar为0%,或者已经增加到,当前血条currentBar到达100%,就调用Exchange函数,切换当前和下一血条; 同时,再通过ResetToWidth或者ResetToZero,修正尺寸即可;
获取血条偏移值,是根据目标的Renderer渲染器,使用Vector3.up配合bounds.max.y轴最大坐标,向上偏移即可
在Init初始化函数中,调用上述各个函数,对各个参数进行赋值初始化,最终通过SetBarData设置当前血条数据索引即可
血条的更新函数中,通过空间转换Camera.WorldToScreenPoint接口,让摄像头下,血条一直位于,目标实体的上方
这个直升机,会挂载控制血条相关的Controller逻辑
对应的脚本逻辑,在Start初始化函数中,拿到Canvas画布,调用SpwanLifeBar函数; 是通过Resource.Load函数加载LifeBar血条预制体,实例化出来,然后弄一个颜色队列容器data,其中包含绿、红、黄,三种颜色; 容器data,传参到LifeBar实体的Init初始化函数,而且设定最大生命值是350;
再弄一个Move函数,是控制飞机移动的
在控制脚本的Update更新函数中,wasd按键,是控制飞机移动的,用来测试,血条是否一直保持,偏移在飞机正上方
更新函数还有两个逻辑,是鼠标左右键,控制血条的增减逻辑
运行游戏,按键,可以看到,表现正常