<template>
<view :animation="animationData" style="background:red;height:100rpx;width:100rpx"></view>
</template>
<script>
export default {
data() {
return {
animationData: {}
}
},
onShow: function() {
var animation = uni.createAnimation({
duration: 1000,
timingFunction: 'ease',
})
this.animation = animation
animation.scale(2, 2).rotate(45).step()
this.animationData = animation.export()
setTimeout(function() {
animation.translate(30).step()
this.animationData = animation.export()
}.bind(this), 1000)
},
methods: {
rotateAndScale: function() {
// 旋转同时放大
this.animation.rotate(45).scale(2, 2).step()
this.animationData = this.animation.export()
},
rotateThenScale: function() {
// 先旋转后放大
this.animation.rotate(45).step()
this.animation.scale(2, 2).step()
this.animationData = this.animation.export()
},
rotateAndScaleThenTranslate: function() {
// 先旋转同时放大,然后平移
this.animation.rotate(45).scale(2, 2).step()
this.animation.translate(100, 100).step({
duration: 1000
})
this.animationData = this.animation.export()
}
}
}
</script>
2 个回复
3***@qq.com
请问解决了吗,uni.popup也会用到这个
3***@qq.com
https://uniapp.dcloud.net.cn/api/ui/animation.html#createanimation
建议使用API前看一下文档,目前不支持鸿蒙
丁不懂 (作者)
开始没有文档后来才更新的
2024-07-24 16:42