收藏
回答

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)
        },
        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()
回答关注问题邀请回答
收藏

3 个回答

登录 后发表内容
问题标签