收藏
回答

在onload中执行opacity方法没有动画效果?

需要在小程序一进来的时候将一张图片淡入显示,所以在onload中写了淡入的方法,在运行后发现图片显示但是没有淡入的效果,代码如下

onLoad: function () {
    var NewTop = wx.createAnimation({
      duration: 2000,
      timingFunction: 'ease-out',
      delay: 0
    })

    NewTop.opacity(1).step();
    that.setData({
      newIndexShow: NewTop.export()
    })
  },

但是没有动画效果,图片直接显示,最后用了setTimeout方法延迟了一下解决了,代码如下

onLoad: function () {
    let that = this
    setTimeout(function(){
      var NewTop = wx.createAnimation({
        duration: 2000,
        timingFunction: 'ease-out',
        delay: 0
      })

      NewTop.opacity(1).step();
      that.setData({
        newIndexShow: NewTop.export()
      })
    },1000)
  },

虽然问题解决了,但是想问一下onload中没有动画效果的原因是什么?

回答关注问题邀请回答
收藏

2 个回答

  • LeeJim🌀
    LeeJim🌀
    2020-04-08

    注意下生命周期,可以试下改到onReady

    2020-04-08
    有用 1
    回复 1
    • 老李头
      老李头
      2020-04-09
      收到,谢谢您
      2020-04-09
      回复
  • 冰是沉默的水
    冰是沉默的水
    2020-04-08

    要是因为延时的原因可能是加载顺序造成的,你可以试试当页面渲染出来再执行动画,来代替你的延时1秒,1秒是你自己设置的,万一手机开了1秒还没加载出来或者在几百毫秒就加载完了,还延时1秒造成体验不好。毕竟1秒有不确定性

    2020-04-08
    有用 1
    回复 1
    • 老李头
      老李头
      2020-04-09
      好的,我试试,谢谢您
      2020-04-09
      回复
登录 后发表内容
问题标签