unity3d序列帧动画制作方法---实现加载进度条(代码片段)

author author     2023-04-01     715

关键词:

产品中经常用到加载动图,一般情况呢,我们都会根据UI设计师所给的UI图进行制作,我这里就介绍两种做法,此篇博客只是记录我怎么做的,方便我后续用,也希望能帮到大家。
第一种是让UI设计师给一张包含里所有序列帧的大图
比如:
技术图片
导入到Unity中选中
技术图片
再将Sprite Mode设置改成Multiple,打开Sprite Editor进行编辑
技术图片
技术图片

第二种是UI设计师把所有序列帧的图都给过来直接用代码实现加载

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

[RequireComponent(typeof(Image))]
public class Loading : MonoBehaviour

    [Tooltip("sprite")]
    public List<Sprite> sprite_frame;
    [Tooltip("帧动画播放的时间间隔")]
    public float duration = 0.1f;
    [Tooltip("循环")]
    public bool loop = false;
    [Tooltip("是否在加载中播放")]
    public bool loadplay = false;
    [Tooltip("播放完是否销毁")]
    public bool destroy = true;
    [Tooltip("延迟多少秒播放")]
    public float timeDelay = 0;
    [Tooltip("如果重复播放多少秒后播放")]
    public float playTimeEndDelay = 0;
    private float played_time;
    private bool playing = false;
    private Image img;
    private bool currentDelay = false;
    private bool currentPlayDelay = false;

    // Start is called before the first frame update
    void Start()
    
        this.img = this.GetComponent<Image>();
        if (this.loadplay)
        
            this.Play();
        
    
    public void Play()
    
        if (this.loop)
        
            this.Play_loop();
        
        else
        
            this.Play_once();
        
    
    public void Stop()
    
        this.playing = false;
    

    void Play_once()
    
        if (this.sprite_frame.Count <= 1)
        
            return;
        

        if (timeDelay > 0)
        
            currentDelay = true;
            Invoke("UpdataTimeDelayState", this.timeDelay);
        

        this.played_time = 0;
        this.playing = true;
        this.loop = false;
    
    void Play_loop()
    
        if (this.sprite_frame.Count <= 1)
        
            return;
        

        if (timeDelay > 0)
        
            currentDelay = true;
            Invoke("UpdataTimeDelayState", this.timeDelay);
        

        this.played_time = 0;
        this.playing = true;
        this.loop = true;
    
    private void UpdataTimeDelayState()
    
        currentDelay = false;
    
    private void UpdataPlayTimeDelayState()
    
        currentPlayDelay = false;
    
    // Update is called once per frame
    void Update()
    
        if (!this.playing)
        
            return;
        

        if (currentDelay || currentPlayDelay)
        
            return;
        
        float dt = Time.deltaTime;
        this.played_time += dt;
        int index = (int)(this.played_time / this.duration);
        if (!this.loop)
        
            if (index >= this.sprite_frame.Count)
            
                this.playing = false;
                this.played_time = 0;
                if (destroy)
                
                    Destroy(this.gameObject);
                
            
            else
            
                this.img.sprite = this.sprite_frame[index];
            
        
        else
        
            while (index >= this.sprite_frame.Count)
            
                this.played_time -= (this.duration * this.sprite_frame.Count);
                index -= this.sprite_frame.Count;
                currentPlayDelay = true;
                Invoke("UpdataPlayTimeDelayState", this.playTimeEndDelay);
            
            this.img.sprite = this.sprite_frame[index];
        
    

时光煮雨unity3d序列目标点的移动①

系列目录【Unity3D基础】让物体动起来①--基于UGUI的鼠标点击移动【Unity3D基础】让物体动起来②--UGUI鼠标点击逐帧移动时光煮雨Unity3D让物体动起来③—UGUIDoTween&UnityNative2D实现时光煮雨Unity3D实现2D人物动画①UGUI&Native2D序... 查看详情

unity怎么让贴图序列播放

如题参考技术A要交互控制贴图序列播放的话:一种方法是将序列图片按单张顺序导入成关键帧图片序列数组,然后在用脚本根据时间逐帧加载贴图.这种方法虽然繁琐,但控制灵活,交互性最强。另一种方法将序列图片处理成一... 查看详情

canvas制作动态进度加载水球

...这段时间重温了一个Canvas,所以就尝试了一下。样式预览实现思路关于水波的实现,使用了sin()函数,通过每一帧不断的移动sin()函数曲线,实现水波动态效果。然后,通过绘制圆形路径,进行clip(),实现球型效果。sin()函数相关... 查看详情

跟我一起学unity3d代码中分割图片而且载入帧序列动画

...2dx中。对大图的处理已经封装好了一套自己的API,可是在Unity3D中貌似没有类似的API(好吧,实际上是有的,并且功能更强大),或者说我没找到。只是这也在情理之中,毕竟Unity3D是做3D的。要分割图片的地方还是非常少... 查看详情

前端页面加载进度条的制作

...进度条的网站icons8.com/preloaders/,制作进入条有以下几种方法。这种方法实现进度条简单粗暴,但是不是真实的。所以开发中一般不用这个。我们通过jquery来实现,这个方法开发中经常用的。 查看详情

unity3d中一步加载时进度条怎么实现啊??要javascrip版的

functionStart() //加载名为Level的场景 varasync:AsyncOperation=Application.LoadLevelAsync("Level"); yieldasync; Debug.Log("Loadingcomplete");然后你可以在update中获取加载的进度,转化为百分比,更改scrollbar的值就好了参考技术A可以考虑搜索... 查看详情

unity3d场景切换加载进度条实现(代码片段)

需要三个场景,场景A,场景B,场景C;场景A:一个按钮,点击加载场景B;场景B:从A切换到C过度场景,加载进度条;场景C:目标场景;创建OnProgress.cs脚本:usingSystem.Collections;usingSystem.Collections.Generic;usingUnityEngine;usingUnityEngine.Sc... 查看详情

unity基于响应式编程(reactiveprogramming)入门

系列目录【Unity3D基础】让物体动起来①--基于UGUI的鼠标点击移动【Unity3D基础】让物体动起来②--UGUI鼠标点击逐帧移动时光煮雨Unity3D让物体动起来③—UGUIDoTween&UnityNative2D实现时光煮雨Unity3D实现2D人物动画①UGUI&Native2D序... 查看详情

unity3d中制作loading场景进度条所遇到的问题loadlevelasync,asyncoperation

背景通常游戏的主场景包含的资源较多,这会导致加载场景的时间较长。为了避免这个问题,可以首先加载Loading场景,然后再通过Loading场景来加载主场景。因为Loading场景包含的资源较少,所以加载速度快。在加载主场景的时候... 查看详情

到底啥是动画关键帧啊

...果的属性,准备一组与时间相关的值,这些值都是在动画序列中比较关键的帧中提取出来的,而其他时间帧中的值,可以用这些关键值,采用特定的插值方法计算得到,从而达到比较流畅的动画效果。任何动画要表现运动或变化... 查看详情

uv序列帧动画

通过上图实现一个火焰的序列帧动画(使用UV实现美术只需要出一张图,而不用每个火焰状态出一张图,节省了内存)。shader如下:Shader"Custom/UVAnimation"{Properties{_Color("BaseColor",Color)=(1,1,1,1)_MainTex("Base(RGB)",2D)="white"{}_AnimationSpeed("Ani... 查看详情

gameframework框架(unity3d)使用笔记(八)实现场景加载进度条(代码片段)

前言:    游戏在转换场景的时候,需要花费时间来加载相关的资源。而这个过程往往因为游戏场景的规模和复杂度以及玩家电脑配置的原因花费一小段时间(虽然这个项目里用不到)。    所以,如果这... 查看详情

android之自定义圆形进度条

...页面以提高用户体验。对于这样的进度条,最简单的实现方式就是通过美工给我们切几张不同的图片,最后通过帧动画的方式来实现。通过帧动画实现固然可以,但是对美工的依赖很大。所以 查看详情

使用javascript和css模拟帧动画的几种方法浅析

我们平时在开发前端页面的时候,经常会播放一段帧序列。这段帧序列就像gif图片那样,反复循环播放。那大家可能会说,直接用gif图片就好了,干嘛还去模拟呢?那是因为要做得更加灵活,我们要做到以下几点:1、我们希望... 查看详情

unity3d动画控制

在制作游戏时,导入的箱子模型本身自带动画。然而,它的动画是一个从打开到关闭的完整过程,并且没有给出控制打开关闭的方法。最直接的想法是对该动画进行拆分,再封装成不同的动画状态,但是不巧的是,这个动画被设... 查看详情

unity3d的unityplaymaker怎么实现骨骼动画自由过度

参考技术A你说的话有问题,骨骼动画本身就是打关键帧制作的动画,再有集成bip的骨骼也可以是基本的骨骼。你用基本骨骼做的动画的话,比如足迹动画,制作完带有足迹,然后转化成你说的哪个关键帧动画,要点运动面板—... 查看详情

cocos2dx3.x(实现帧动画(人物动画,跑马灯效果)的几种方法)

1//创建一个跑酷的精灵?2 autosprite=Sprite::create("1.png");?3//设置精灵的坐标?4sprite->setPosition(Vec2(visibleSize.width/2,visibleSize.height/2));?5//添加到当前层?6this->addChild(sprite);?7//创建序列帧动画?8autoanimat 查看详情

Unity3D:导入关键帧动画(不是基于骨骼的动画)

】Unity3D:导入关键帧动画(不是基于骨骼的动画)【英文标题】:Unity3D:ImportingKeyframeAnimation(notBone-basedAnimation)【发布时间】:2013-01-0908:58:36【问题描述】:据我所知,我只能从3dsMax或类似软件中导入基于骨骼的动画。有没有办... 查看详情