【Unity3D日常開發】Unity中實作圓環進度條

​

一、前言

今天分享一個制作圓形進度條的方法，原教程比較繁瑣，這裡給精簡一下，更适合于新手

先看下效果吧

二、原文連結

原文作者：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 ，看看效果吧