2***@qq.com
2***@qq.com
  • 发布:2021-03-09 14:41
  • 更新:2021-03-09 14:41
  • 阅读:696

animation动画在小程序中有效果,但是真机调试没有效果?

分类:HBuilderX

<template>
<image class="click-to-indoor-img" src="../../static/imgs/indoor.png" :animation="animationData" ></image>
</template>

<script>
export default {
data() {
return {
animationData: {}, // 在data中初始化animationData
};
},
onUnload() {
this.animationData = {}
// 页面关闭后清空数据
},

    onReady: function(res) {  
        //初始化动画  
        this.animation = uni.createAnimation({  
            timingFunction: "ease-in-out",  
        })  
        //使用动画循环  
        //每2.5秒(2500 毫秒)做这个动作 :  
        setInterval(() => {  
            // 调用 step() 来表示一组动画完成(当前参数动画时间1s)  
            // step 可以配置参数用于指定当前组动画的配置。具体参数请看文档  
            this.animation.scale(1.07 + Math.random() * 0.01).step({  
                duration: 1000  
            })  
            this.animation.scale(1).step({  
                duration: 1000  
            })  
            // export方法导出动画数据  
            this.animationData = this.animation.export()  
        }, 2500)  
    },  
}  

</script>

<style>
.click-to-indoor-img{
position: fixed;
bottom: 770rpx;
right: 25rpx;
width: 170rpx;
height: 170rpx;
}
</style>

2021-03-09 14:41 负责人:无 分享
已邀请:

该问题目前已经被锁定, 无法添加新回复