一、前言
今天分享一个制作圆形进度条的方法，原教程比较繁琐，这里给精简一下，更适合于新手
先看下效果吧
网络异常，图片无法展示
|
二、原文链接
原文出处：CSDN 原文链接：blog.csdn.net/tab_space/a…原文作者：tab_space
三、正文
步骤：
1、先制作素材
准备一张圆形的图片，中间掏空，保存为png格式
网络异常，图片无法展示
|
2、设置属性
新建一个image
网络异常，图片无法展示
|
将图片拖进去
网络异常，图片无法展示
|
网络异常，图片无法展示
|
Image Type改为Filled
网络异常，图片无法展示
|
设置一下Fill Method ->Radial 360 Fill Origin ->Top Fill Amount-> 1 Clockwise ->False
新建一个text
网络异常，图片无法展示
|
位置拖到图片中间
网络异常，图片无法展示
|
OK 前期工作都准备好了 只需要更改图片的 Fill Amount值就可以实现圆形进度条，有兴趣的同学 可以先拖一下看看效果
3、代码控制
新建脚本RingProcess.cs
using UnityEngine; using UnityEngine.UI; public class RingProcess : MonoBehaviour { //进度条速度 public float speed; //一个图片一个文字 public Transform m_Image; public Transform m_Text; //进度控制 public int targetProcess = 100; private float currentAmout = 0; void Update() { if (currentAmout < targetProcess) { currentAmout += speed; if (currentAmout > targetProcess) currentAmout = targetProcess; m_Text.GetComponent<Text>().text = ((int)currentAmout).ToString() + "%"; m_Image.GetComponent<Image>().fillAmount = currentAmout / 100.0f; } } } 复制代码
4、设置参数
将脚本拖到任意物体上面
网络异常，图片无法展示
|
网络异常，图片无法展示
|
OK ，看看效果吧
网络异常，图片无法展示
|
四、项目下载
链接：pan.baidu.com/s/1_POXdJKZ…提取码：h2vp
