Unity UGUI实现分段式血条

我们可以看到像英雄联盟等游戏里英雄头顶的血条显示并非是纯色的，而是根据血量的多少而显示一定量的格子，这种方式明显是比较友好、比较美观的，事实上我们的游戏里面也想实现这样的效果，那该怎么办呢？根据血量的多少同时创建N多个小格子图片？这明显不合理；根据血量多少同时创建N多个分割线来拆分图片？这也不合理。

所以我今天将以一种很简单的方式实现这种效果，当然没什么难度，只对UGUI的Slider做一些修改就可以了。

一、首先，我们创建一个Slider，删除他的Handle，勾选Whole Numbers（按整型数改变值），大概就是这样：

二、给Fill Rect目标添加我们的脚本BloodImage，并删除原本的Image组件，为BloodImage指定一个纹理，纹理必须是Texture类型：

BloodImage继承至RawImage，所以只能接收Texture类型的图片源，他主要负责的就是根据血条的长度对图片进行循环排版。

using UnityEngine;
using UnityEngine.UI;public class BloodImage : RawImage {private Slider _BloodSlider;protected override void OnRectTransformDimensionsChange(){base.OnRectTransformDimensionsChange();//获取血条if (_BloodSlider == null)_BloodSlider = transform.parent.parent.GetComponent<Slider>();//获取血条的值if (_BloodSlider != null){//刷新血条的显示float value = _BloodSlider.value;uvRect = new Rect(0,0,value,1);}}
}

到这里，基本上就OK了，你想要血条显示为多少个小格子，就更改slider的Max Value属性（最大值）就可以了。

效果图如下：

当然如果你有更好的素材，这个血条会更加美观。

三、我已经将BloodSlider发包成一个插件，导入该插件，便可以直接在场景创建BloodSlider。

插件链接：http://download.csdn.net/detail/qq992817263/9660453

Unity UGUI实现分段式血条相关推荐

UGUI和IMGUI制作血条
UGUI和IMGUI制作血条前言这是中大计算机学院3D游戏编程课的一次作业,在这里分享一下设计思路. 主要代码上传到了gitee上,请按照后文的操作运行. 项目地址:https://gitee.c ...
unity制作类似DNF动态血条(仅一层血条）
unity制作类似DNF动态血条(仅一层血条) 这是某个游戏公司的招聘题目,我的思路给大家参考一下上图为效果图如下代码: using System.Collections; using Syste ...
Unity分格式血条
我们可以看到像英雄联盟等游戏里英雄头顶的血条显示并非是纯色的,而是根据血量的多少而显示一定量的格子,这种方式明显是比较友好.比较美观的,事实上我们的游戏里面也想实现这样的效果,那该怎么办呢?根据血量的 ...
Unity 3D游戏十：血条制作
前言中山大学数据科学与计算机学院3D游戏课程学习记录博客. 游戏代码: gitee 参考师兄的博客: 师兄博客游戏视频:bilibili 游戏要求血条(Health Bar)的预制设计. 具体要 ...
Unity实现各种样式的血条
我将讲述三种不同类型血条UI的实现第一种是常见的进度条样式的血条实现: 进度条式的血条样式如图示要实现进度条式的血条,我们需要使用到unity的UI中的滑动条,它分为Slider滑动条,Backg ...
Unity 小坦克的圆形血条
步骤: (1) 右键-->UI-->Canvas (2)修改Canvas的Render Mode-->world space (3)在Canvas下创建一个Slider (4)展开S ...
Unity UGUI实现王者荣耀版多格血条
上篇讲述了Boss多层血条的实现方法,这篇就主要讲述一下类似于王者荣耀,LoL的分段式血条, 这样的血条在游戏的视觉层会带给玩家非常好的体验.就好比玩家买了一个狂徒铠甲.如过你用的是分段血条的话,就 ...
Unity 2D血条制作方式
博主在前两篇博客中写了关于分段式血条和多层血条的实现方式,但是基于一下初学者的考虑,还是决定把2D的血条制作方式也是贴出来,方便大家进行学习和使用. 第一步:我们创建一个Slider,把图片和背景修改 ...
Unity UGUI血条制作详细教程
Unity3d游戏中使用UGUI制作角色头顶血条,具体步骤如下: 1.模型添加血条挂点 2.制作血条 (1).创建血条UGUI canvas (2).修改canvas参数: RenderMode参数设 ...

Unity UGUI实现分段式血条

Unity UGUI实现分段式血条相关推荐

最新文章

热门文章