423815031@qq.com
423815031@qq.com
  • 发布:2019-07-29 16:27
  • 更新:2019-12-05 11:28
  • 阅读:2444

关于uni-app中的uni.createAnimation循环播放动画的问题

分类:uni-app

如图,在使用createAnimation的时候打算写一个setInterval循环播放一个图片上下移动的动画,在电脑上模拟iphoneX时能够循环播放,但是手机真机测试时只会播放一次,这要怎么解决?

2019-07-29 16:27 负责人:无 分享
已邀请:
423815031@qq.com

423815031@qq.com (作者) - 愿你不再单机的一天.

解决了。调用translateY的值需要为随机值,即Math.random()。如果是准确的值就会导致无法循环播放,不太懂这个机制产生的原因,希望能解释一下。

Darly

Darly

我试了Math.random()-30,像抽风了一样

wangzhangchuan0502@163.com

wangzhangchuan0502@163.com

定时器一般在CPU紧张的时候派发任务时间一般都不准的,你可以将间隔时间大于动画总时间javascript

            setTimeout(function() {  
                // 动画0  
                var animation0 = uni.createAnimation({  
                    transformOrigin: "50% 0 50%",  
                    duration: 1600,  
                    timingFunction: 'ease',  
                    delay: 100  
                });  

                this.animation0 = animation0;  
                this.intervalID = setInterval(function() {  
                    this.animationAction0(this.isTop0 ? 20 : 0);  
                }.bind(this), 2000)  

            }.bind(this), 0)  

            animationAction0: function(detaY) {  
                console.info("animationAction:" + detaY);  
                this.animation0.translateY(detaY).step();  
                this.animationData0 = this.animation0.export();  
                this.isTop0 = !this.isTop0;  
            },

要回复问题请先登录注册