【Unity 】制作圆形进度条
0. 背景最近有个在Unity 中制作圆环进度条的需求，并在圆中显⽰进度数值，类似于图1：
图1. 圆环进度条平时制作直线的进度条⽐较多，突然要求做个圆环的有些不适应。不过，这个需求google ⼀下其实⼤量的解答就出来，关键字"unity circle progress bar"，于是我采⽤了  这个⽅法，有兴趣的同学可以去看看，接下来我简要叙述⼀下制作的⽅法。
1. 制作步骤
a). Unity 版本
需求制作使⽤Unity5的UGUI 的新GUI 组建（UGUI ⾃Unity4.6版本出现的）。
b). 新建Canvas
a). 在菜单栏GameObject/UI/Canvas ，新建Canvas ，如图2。
图2
c). 新建circleProcessBar
b). 同理，在Canvas 中新建⼀个Create/UI/Image 中新建⼀个image ，作为Canvas ⼦物体，并命名为circleProcessBar ，如图3。
1
2
3
4
5
6
7
图3
d). 新建circleProcessBar/process
c). 在circleProcessBar 中创建⼀个image ，作为circleProcessBar 第⼀个⼦物体，并命名为process 。这个Image 主要的功能是以类似雷达扇形扫描形式，作为圆环进度条最核⼼的基础GameObject 。
I) 在此物体process 的Image 组件中，设置Source Image 为Unity ⾃带的Knob ；
II) 在Color 中随便选择⼀种颜⾊，本⽂中选择
III) 选择后会出现ImageType 属性，分别选
如图4
borderbox所⽰。
图4
这时候，修改FillAmout 属性，就可以做成类似雷达扇形扫描的进度，如图5。但是我们希望是圆环，并不是扇形。
图5
e). 新建circleProcessBar/innerCircle
d). 在circleProcessBar 中再创建⼀个image ，作为circleProcessBar 第⼆个⼦物体，并命名为innerCircle 。该物体的作⽤是：覆盖前⾯的process ，将扇形进度变成圆环进度。将图3中的Assets 中innerCircle.png 拖⼊Image 组件的SourceImage 中，并将size 设置为:
f). 新建circleProcessBar/indicator
e). 在circleProcessBar 中创建⼀个Text ，作为circleProcessBar 第三个⼦物体，并命名为indicator 。
该物体的⽤作是：显⽰圆环进度值。为能够清楚显⽰，调整indicator 的属性。
设置好后，整个hierarchy 如图6所⽰。
图
6
g). 新建circleProcess.cs
f). 新建C#脚本-circleProcess.cs ，并拖⾄物体circleProcessBar ，作为其的⼀个脚本组件。
f). 新建circleProcessBar/indicator
e). 在circleProcessBar 中创建⼀个Text ，作为circleProcessBar 第三个⼦物体，并命名为indicator 。
该物体的⽤作是：显⽰圆环进度值。为能够清楚显⽰，调整indicator 的属性。
I) 声明在Unity 设置的属性：
II) 设置speed 为0.1，processTrans 为proces 物体的transform ，indicatorTrans 为process 物体的transform 。
III) 编写Update 函数，是的环形进度在设置⽬标进度后SetTargetProcess 之后，能够有⼀段时间的动画。
h). Unity Play
最终的效果如图7所⽰。
图7
f). 新建circleProcessBar/indicator
e). 在circleProcessBar 中创建⼀个Text ，作为circleProcessBar 第三个⼦物体，并命名为indicator 。
该物体的⽤作是：显⽰圆环进度值。为能够清楚显⽰，调整indicator
的属性。