lottie动画在真机上,画面失帧,锯齿严重?
发布于 8 年前 作者 daijuan 6274 次浏览 来自 官方Issues

<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)
        },
        failrej => {
          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()
1 回复

你好,麻烦具体描述问题流程,提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

回到顶部