lottie动画在真机上,画面失帧,锯齿严重?
[图片] <view class='bannerHead' catchtap='getDes' data-curmodule='dx' >
<canvas id="canvas" type="2d" style="width:730rpx;height:350rpx"></canvas>
</view>
wx.createSelectorQuery().select('#canvas').node(res => {
const canvas = res.node;
const context = canvas.getContext('2d');
wx.getImageInfo({
src:'https://leukehelp.bj.bcebos.com/banner-1.json',
success:res => {
console.log(res)
},
fail: rej => {
console.log(rej)
}
})
// canvas.width = 730;//设置宽高，也可以放到wxml中的canvas标签的style中
// canvas.hight = 300;
lottie.setup(canvas)//要执行动画，必须调用setup,传入canvas对象
lottie.loadAnimation({//微信小程序给的接口，调用就完事了，原理不太懂
loop: true,//是否循环播放（选填）
autoplay: true,//是否自动播放（选填）
path:'https://leukehelp.bj.bcebos.com/banner-1.json',//lottie json包的网络链接，可以防止小程序的体积过大，要注意请求域名要添加到小程序的合法域名中
rendererSettings: {
context,
},
})
}).exec()
