phaser3 微信小游戏若干问题
用phasr3开发微信小游戏的话, 需要修改源码的地方不多。
1:微信小游戏不支持xml,需要装个DOMParser http://club.phaser-china.com/topic/5b1276a0484a53dd723f42ff
2:图片加载方式需要修改,不好重写代码,需要修改源码
var ImageFile = new Class({ Extends: File, initialize: function ImageFile (loader, key, url, xhrSettings, frameConfig) { this.isWX = typeof wx !== "undefined"; var extension = 'png'; var normalMapURL; if (IsPlainObject(key)) { var config = key; key = GetFastValue(config, 'key'); url = GetFastValue(config, 'url'); normalMapURL = GetFastValue(config, 'normalMap'); xhrSettings = GetFastValue(config, 'xhrSettings'); extension = GetFastValue(config, 'extension', extension); frameConfig = GetFastValue(config, 'frameConfig'); } if (Array.isArray(url)) { normalMapURL = url[1]; url = url[0]; } var fileConfig = { type: 'image', cache: loader.textureManager, extension: extension, responseType: 'arraybuffer', key: key, url: url, xhrSettings: xhrSettings, config: frameConfig }; File.call(this, loader, fileConfig); // Do we have a normal map to load as well? if (normalMapURL) { var normalMap = new ImageFile(loader, this.key, normalMapURL, xhrSettings, frameConfig); normalMap.type = 'normalMap'; this.setLink(normalMap); loader.addFile(normalMap); } }, /** * Called automatically by Loader.nextFile. * This method controls what extra work this File does with its loaded data. * * @method Phaser.Loader.FileTypes.ImageFile#onProcess * @since 3.7.0 */ onProcess: function () { let url = this.__url; this.state = CONST.FILE_PROCESSING; this.data = new Image(); this.data.crossOrigin = this.crossOrigin; var _this = this; this.data.onload = function () { if (!this.isWX) { File.revokeObjectURL(_this.data); _this.onProcessComplete(); } else { this.addToCache(); } }; this.data.onerror = function () { if (!this.isWX) { File.revokeObjectURL(_this.data); } else { console.log("||||||"); } _this.onProcessError(); }; if (this.isWX) { this.data.src = url; } else { File.createObjectURL(this.data, this.xhrLoader.response, 'image/png'); } }, /** * Adds this file to its target cache upon successful loading and processing. * * @method Phaser.Loader.FileTypes.ImageFile#addToCache * @since 3.7.0 */ addToCache: function () { var texture; var linkFile = this.linkFile; if (linkFile && linkFile.state === CONST.FILE_COMPLETE) { if (this.type === 'image') { texture = this.cache.addImage(this.key, this.data, linkFile.data); } else { texture = this.cache.addImage(linkFile.key, linkFile.data, this.data); } this.pendingDestroy(texture); linkFile.pendingDestroy(texture); } else if (!linkFile) { texture = this.cache.addImage(this.key, this.data); this.pendingDestroy(texture); } } });
3: 边界面部导致微信小游戏的点击事件失效, window.pageXOffset为undefined 修改源码或修改适配器都可以
updateBounds: function () { var bounds = this.bounds; var clientRect = this.canvas.getBoundingClientRect(); bounds.x = clientRect.left + (window.pageXOffset - document.documentElement.clientLeft || 0); bounds.y = clientRect.top + (window.pageYOffset - document.documentElement.clientTop || 0); bounds.width = clientRect.width; bounds.height = clientRect.height; },