其他分享
首页 > 其他分享> > Unity学习笔记(09):UGUI的Image节点和Sprite精灵图、实现进度条加载动画

Unity学习笔记(09):UGUI的Image节点和Sprite精灵图、实现进度条加载动画

作者:互联网

2D模式
在这里插入图片描述
选择Single模式:
在这里插入图片描述
Packing tag是指定打包标签 相同的标签在打包时会被打包在同一个文件中 以节省显存

Filter Mode缩放模式
Point(no filter)无缩放 比如放大两倍 则将像素复制两倍
在这里插入图片描述

Image Type缩放模式
在这里插入图片描述
当图片尺寸放大时

实现进度条功能

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class clock_bar : MonoBehaviour {
    Image image; // Image对象
    float totalTime; // 总时间
    float nowTime; // 当前时间
    bool isRunning = false; // 是否运行

    // 若要将组件的属性绑定到编辑器 需要在组件类中加上public修饰符
    public bool playOnload = false;
	// Use this for initialization
	void Start () {
        image = GetComponent<Image>();

        // 若勾选了Play onl oad
        if (playOnload)
        {
            // 启动
            showTimeAction(15.0f);
        }
	}

    public void showTimeAction(float totalTime)
    {
        image.fillAmount = 1.0f; // 当前时间是满的
        this.totalTime = totalTime; // 为总时长赋值
        this.nowTime = 0; // 初始化当前时间

        isRunning = true; // 开启倒计时动画
    }
	
	// Update is called once per frame
	void Update () {
        // 未开启倒计时动画
		if (!isRunning)
        {
            return;
        }
        nowTime += Time.deltaTime; // 已走过的时间不断累积
        float per = nowTime / totalTime; // 不断重新计算过去时间的百分比
        // 若已走过时间超过总时间
        if (per>1.0f)
        {
            // 百分比设为1
            per = 1.0f;
        }
        // 计算剩余时间的百分比
        per = 1.0f - per;
        image.fillAmount = per; // 为fill amount赋值 改变游戏中进度条的比例
        // 结束
        if (nowTime>=totalTime)
        {
            isRunning = false;
        }
	}
}

在这里插入图片描述


标签:totalTime,float,Sprite,进度条,Image,缩放,nowTime,per,using
来源: https://blog.csdn.net/Piconjo/article/details/106894751