小程序的動畫效果


  制作動畫的方法 分為幾個步驟

  1.創建一個動畫實例

  var animation=wx.createAnimation()  創建一個動畫實例 animation。調用實例的方法來描述動畫。最后通過動畫實例的 export 方法導出動畫數據傳遞給組件的 animation 屬性

  所以在 wxml 文件上,我們需要在組件上綁定 animation 屬性  <view animation="{{a}}"><view>

  在 js文件上 data 屬性   a:{}

  為什么要將數據給 animation 屬性  因為我么需要通過數據來進行動畫與頁面的交互

  2. 通過實例的方法來實現動畫,兩種方法

  第一種

    animate.translateX(100).step()

    animate.translateY(100).step()  //先向右邊偏移,在向下偏移  動畫的逐個執行

  第二種

    animate.translateX(100).translateY(100).step()  // 向右 向下 同時執行  

  最后,this.setData({

    a:animate.export()    //最后把這個動畫導出,然后讓這個數據傳遞給組件中去,這樣組件就擁有了這個方法

  })


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM