微信小游戏之 wechat-adapter的使用(requestAnimationFrame)

import "./weapp-adapter.js"

var ctx = canvas.getContext("2d")
var bg =new Image()
bg.src ="./images/bg.jpg" 
bg.width =512
bg.height=512
var width = window.innerWidth  //全局对象
var height = window.innerHeight
bg.onload=function(){
    ctx.drawImage(bg, 0, 0, bg.width, bg.height,0,0,width,height);
}

画一张连续不停的画

import "./weapp-adapter.js"

var ctx = canvas.getContext("2d")
var bg =new Image()
bg.src ="./images/bg.jpg" 
bg.width =512
bg.height=512
var width = window.innerWidth  //全局对象
var height = window.innerHeight

var top = 0
move()
function move(){
    top++
    requestAnimationFrame(function(){

        ctx.clearRect(0,0,width,height) 
        ctx.drawImage(bg, 0, 0, bg.width, bg.height,0,top,width,height); //一张向下走
        ctx.drawImage(bg, 0, 0, bg.width, bg.height,0,-height+top,width,height); //一张在画室外面
        if(top==height){
            top =0
        }
        move()
    })
}

 

3加入音乐

var bgm = new Audio()
bgm.volume =0.02
bgm.src ="./audio/bgm.mp3"
bgm.play()