柿霖不是林 发表于 2017-1-11 12:52:22

微信小程序学习用demo：小马互联：animation，简易布局


点评：实现了基本的布局，使用animation实现了简单的逐个添加的动画效果：




var app = getApp();

Page({
    data: {
      animationData1: {},
      animationData2: {},
      animationData3: {},
      animationData4: {}
    },

    onShow: function(){
      var animation = wx.createAnimation({
      duration: 1000,
      timingFunction: 'ease',
      })
      this.animation = animation
      this.animation.translate(0,-390).step()
      this.setData({
            animationData1:animation.export()
      })

      animation.translate(0,-390).step({delay: 100})
      this.setData({
            animationData2:animation.export()
      })
      animation.translate(0,-390).step({delay: 100*2})
      this.setData({
            animationData3:animation.export()
      })
      animation.translate(0,-390).step({delay: 100*3})
      this.setData({
            animationData4:animation.export()
      })

         
    },


   

});


**** Hidden Message *****

CGB-150 发表于 2017-1-12 17:20:42

正需要，支持楼主大人了！

Ywenli 发表于 2017-8-18 09:33:40

感谢分享

寒城秋水 发表于 2018-12-19 10:53:40


感谢分享

jack56846 发表于 2020-4-5 15:23:58

我有流量，寻求个人游戏开发者合作，有意者联系微,信,号j i m 2 0 1 8 0 6 8 8

fengyuntuan 发表于 2020-4-21 13:25:44

333333333333

jackjack417 发表于 2020-4-21 16:35:19

专注于与个人游戏开发者合作，有产品的朋友联系微信号jim20180688，详聊                                                                                               
页: [1]
查看完整版本: 微信小程序学习用demo：小马互联：animation，简易布局