Unity3D中灵活绘制进度条

有时我们需要在Unity3D中绘制进度条,如:

          或       

如果使用4.6版本以下的unity绘制环形的进度条可能需要费点劲。我搜到的大多数方法都是用NGUI插件,但有时只是为了简单的画一个环形UI,使用NGUI反而还增加了学习成本。有一个利用CutOut材质的方法能够利用alpha值,灵活的控制进度条中需要显示的部分,以环形进度条为例,方法如下:

1、在PS中制作一张如下所示的图,RGB为进度条想要的颜色,alpha值从5-250环形渐变(如果从0-255,在进度为0%或100%时会显示异常,这与CutOut材质的特性有关)

2、新建材质 选择Transparent Cutout

3、设置纹理

4、将导入的纹理拽入材质

5、新建Quad

6、选择第2步创建的材质

7、创建正交相机,并将深度置为最前

8、将它们拖到荒无人烟的地方(这是UI,7、8两步确保它是在场景的最前面,且不会出现在才3D场景中)

9、调整Alpha cutoff观看效果

10、若想做出反方向的效果,则需要在做图的时候勾选反向

11、我们的目标是:写脚本控制alpha cutoff的值

12、代码如下,最核心的一句已经框起来了

到此为止,转圈的进度条/能量条的方法阐述完毕,核心思想是利用CutOut材质控制alpha值控制进度条的显示。在CutOut材质中,当alpha值高于设置的"alpha cutoff"时,完全不透明;低于设置的"alpha cutoff"时,完全透明。利用CutOut材质的这种特性,通过制作合适的渐变纹理,可以实现各种各样的进度条,美中不足的是抗锯齿能力不太好。

      在这篇博客写完后,我觉得CutOut材质不能有半透明效果,不太合理,于是乎搞了个shader稍微改进了下,你可以在这里下载本文改进后的资源。至于博客中的截图嘛……都差不多,懒得更新了,需要的童鞋看看代码就明白了。

时间: 2024-10-12 22:17:08

Unity3D中灵活绘制进度条的相关文章

knova绘制进度条

效果: 源码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>knova绘制进度条</title> <style> body { padding: 0; margin: 0; background-color: #f0f0f0; overflow: hidden; } </style&

用Raphael在网页中画圆环进度条

原文 :http://boytnt.blog.51cto.com/966121/1074215 条状的进度条我们见得太多了,实现起来比较简单,它总是长方形的,在方形的区域里摆 放就不太好看了.随着css3的出现,圆环状的进度条开始用得越来越多,不过由于IE6/7/8不支持css3,我们只能换其它方法来实现.本文就采用 Raphael来画一个,这个组件对svg和vml进行了一个统一的封装,根据浏览器使用不同的技术实现绘制,因此IE也能用. 先上效果图: 效果还不错吧?代码其实也不复杂,抛砖引玉一下

在C++中如何做出进度条

[来信] 尊敬的贺老师,我看了您的C++程序设计课觉得很有启发,对于第九周项目设计我有一个想法.怎么用程序实现安装进度百分比与进度条之间结合小程序.如: 不知道应该怎样实现,还请老师点播一二. [回信] 我不知你看的是哪一级的版本,不过这个无所谓. 参考http://blog.csdn.net/sxhelijian/article/details/8167913,其中给出了一个将数字"可视化"并且能直观比对的效果. 你附图给出的,是在图形用户界面下的效果.在C++的相关的开发环境中可以

python中pyqt5的进度条--python实战(十)

python太博大精深了,使用场景非常多.最近笔者一直使用PyQt5编一些小程序,顺便就把一些常用的东西列出来,做个记录和积累吧.进度条是非常常用的东西,今天用的时候,顺便温习了一下,这个东西自己感觉没啥可讲的,最好的办法就是例子来说明:下面给一个简单的例子. 基本进度条使用: 进度条的函数如下: self.pbar = QProgressBar(self) //进度条的定义 self.pbar.setGeometry(30, 60, 100, 30) //进度条的大小和位置,前两个是位置,后两

Unity3d中NGUI加强版血条(Healthbar)的制作

这阵子项目中需要用到一种特殊样式的血条.描述如下: 1. 正常颜色为红色.受到伤害后,即将扣除的血量变暗(暗红色),并有下降动画效果: 2. 加护盾效果后,增加一部分血量值,该额外部分为白色,护盾效果消失后该部分血量瞬间消失: 3. 在护盾效果下受到伤害时,首先扣除白色血量.白色血量不足扣除时,余下部分从红色血量中扣除: 4. 白色血量的扣除效果为变为灰色并有下降动画效果: 4. 当加护盾效果时,若即将添加的白色血量将使总血条“溢出”,从新计算百分比并排满血条: 5. 中毒时,将相应的血量(按照

关于unity3D异步加载进度条实时更新的方法

在其他地方看到所谓的实时更新就是 让slider的当前value等于异步对象的进度值而已,太坑了,这个正常来理解的意思不就是从0开始递增到100嘛,不管怎么我已经完成这个功能了,代码贴上,以免日后忘记, 找到这篇博客的朋友算你好运,直接搬走吧(NGUI版)~ 需要重点提醒的:异步对象AsyncOperation的值到90%后不会再增长,剩下的10%要让AsyncOperation.allowSceneActivation(意思是场景加载完毕后自动跳转场景)为true时才会自动完成~ 完整代码下方

安卓开发中的各种进度条样式

Android开发中我们经常会用到各种各样的loading,于是自己总结了常用的loading并分享出来.首先来看下具体效果图: 完整源码参见:stormzhang / CustomLoading 下面主要说下代码的关键部分: 1. Frame Loading 第一个就是在app中常见的loading效果,主要是用帧动画实现的,所谓帧动画就是一组组图片顺序播放: 下面直接看下代码实现: 首先在drawable文件夹下建立一个xml文件,内容如下: frame_loading.xml <?xml

Android 三种方式实现自定义圆形页面加载中效果的进度条

转载:http://www.eoeandroid.com/forum.php?mod=viewthread&tid=76872 一.通过动画实现 定义res/anim/loading.xml如下: [java] view plaincopy <?xml version="1.0" encoding="UTF-8"?> <animation-list android:oneshot="false" xmlns:androi

【转】Unity3d中制作Loading场景进度条所遇到的问题 LoadLevelAsync,AsyncOperation

背景 通常游戏的主场景包含的资源较多,这会导致加载场景的时间较长.为了避免这个问题,可以首先加载Loading场景,然后再通过Loading场景来加载主场景.因为Loading场景包含的资源较少,所以加载速度快.在加载主场景的时候一般会在Loading界面中显示一个进度条来告知玩家当前加载的进度.在Unity中可以通过调用Application.LoadLevelAsync函数来异步加载游戏场景,通过查询AsyncOperation.progress的值来得到场景加载的进度. 尝试--遇到问题