升级进度条动画的处理思路

最新推荐文章于 2024-05-13 09:27:38 发布

远行MM

最新推荐文章于 2024-05-13 09:27:38 发布

阅读量891

点赞数

CC 4.0 BY-SA版权

分类专栏：工作心得常见需求文章标签：进度条动画升级

本文链接：https://blog.youkuaiyun.com/qq_22794043/article/details/88552142

在养成模块中，进度条动画的实现是个关键。原始思路是每次升级后重置并重新播放，但这可能导致错误。更好的方法是，在获取进度值后，首先检查是否满足升级条件。如果满足，一次性播放对应级别的满进度动画，最后一次播放至剩余进度；若不满足，直接将进度条动画延伸至目标值。该方法避免了繁琐的操作，同时要考虑满级情况。详情可参考相关博文。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

养成模块，经常有升级进度条，每次进度条满了之后会升级，然后进度从0开始累积。

最开始想到的方法（根据需求直接翻译的需求，有时候策划给出的逻辑，不一定要按照策划的逻辑来写，换一种逻辑也可以，只要最后达到的效果是一样的就行）是每次升级完成之后，减掉升级已经消耗得进度值，然后再拨进度条动画，再次满进度之后，再减再播动画，这样写也不是不可以，但是很容易出问题，这里提供一个更简单的思路。

获得进度值之后，先判断能否升级，能升级直接判断能升多少级，能升多少级就播放多少次满进度进度条动画，最后一次播放的时候，播到剩余进度值就停止；如果不能升级，则进度条直接播动画延长到指定值即可。这里也涉及到满级问题，参见另一篇博文关于升级模块是否满级的详细描述https://blog.youkuaiyun.com/qq_22794043/article/details/88114963

//打开view的时候初始化isTweening为false，关闭view的时候，重置isTweeing为false
isTweening = false;
//打开view的时候，初始化进度条位置,sw和preSw为全局变量，可根据实际情况，将变量定义为指定数据类型
private var sw:*;
private var preSw:*;
private function initProgressBar():void{
    sw = model.getInstance().sw;
    /**preSw = model.getInstance().sw;
    * 注意，这里不能这么写，原因是这么写是引用赋值，sw与preSw永远全等，
    * 无法做进度条升级重置的处理
    */
    var lv:int = model.getInstance().level;
    preSw.level = lv;
    if(preSw == null || sw == null){
        return;
    }
    v