微信小游戏的Adapter适配层

为什么要用Adapter

因为小游戏的运行环境在IOS上是javaScriptCore,在安卓上是V8，都没有BOM和DOM的运行环境，没有全局的document和window对象。因此如果直接用DOM API来创建Canvas和Image等元素的时候，会引发错误。

var canvas=document.createElement('canvas')   //出现错误

但是我们可以使用wx.createCanvas和wx.createImage来封装一个document。

var document={
    createElement:function(tagName){
        tagName = tagName.toLowerCase()
        if(tagName==='canvas'){
            return wx.createCanvas()
        }
        else if(tagName=== 'image'){
            return wx.createImage()
        }
    }
}

封装了上面的函数之后，我们就可以直接创建元素Canvas和Image了。

var canvas=document.createElement('canvas')
var image=document.createImage('image')

同样，如果想实现 new Image() 的方式创建 Image 对象，只须添加如下代码。

function Image () {
    return wx.createImage()
}

Adapter是用户代码，是用来使游戏引擎适配小游戏的运行环境

原因：因为小游戏的宿主环境根本没有提供document和window这两个在浏览器中内置的全局变量，而H5游戏基本上大量地使用到这些DOM和BOM API 。Adapter即在引擎和游戏逻辑代码之间加一层模拟 BOM 和 DOM API 的适配层，我们称之为 Adapter。这层适配层在全局通过 wx API 模拟了引擎会访问到的那部分 window 和 document 对象的属性和方法，使引擎感受不到环境的差异。