定义的全局方法 boot
window.boot = function () {
var settings = window._CCSettings;
window._CCSettings = undefined;
var onProgress = null;
//通过解构 声明四个变量，分别为bundle 的名字，都是内置bundle
let { RESOURCES, INTERNAL, MAIN, START_SCENE } = cc.AssetManager.BuiltinBundleName;
//声明一个方法，控制加载进度条，
function setLoadingDisplay () {
// Loading splash scene
var splash = document.getElementById('splash');
var progressBar = splash.querySelector('.progress-bar span');
onProgress = function (finish, total) {
var percent = 100 * finish / total;
if (progressBar) {
progressBar.style.width = percent.toFixed(2) + '%';
}
};
splash.style.display = 'block';
progressBar.style.width = '0%';
cc.director.once(cc.Director.EVENT_AFTER_SCENE_LAUNCH, function () {
splash.style.display = 'none';//加载完毕后隐藏
});
}
定义onStart
//在run起游戏后 调用onstart
var onStart = function () {
//对于 Apple 这种支持 Retina 显示的设备上默认进行优化,而其他类型设备默认不进行优化，
cc.view.enableRetina(true);
//设置当发现浏览器的尺寸改变时，是否自动调整 canvas 尺寸大小。
cc.view.resizeWithBrowserSize(true);
if (cc.sys.isBrowser) {
setLoadingDisplay();//浏览器的时候处理进度条
}
if (cc.sys.isMobile) {
if (settings.orientation === 'landscape') {//横屏
cc.view.setOrientation(cc.macro.ORIENTATION_LANDSCAPE);
}
else if (settings.orientation === 'portrait') {//竖屏
cc.view.setOrientation(cc.macro.ORIENTATION_PORTRAIT);
}
// 下面几个平台移动端游戏会在移动端自动尝试进入全屏模式。
cc.view.enableAutoFullScreen([
cc.sys.BROWSER_TYPE_BAIDU,
cc.sys.BROWSER_TYPE_BAIDU_APP,
cc.sys.BROWSER_TYPE_WECHAT,
cc.sys.BROWSER_TYPE_MOBILE_QQ,
cc.sys.BROWSER_TYPE_MIUI,
].indexOf(cc.sys.browserType) < 0);
}//
// Limit downloading max concurrent task to 2,
// more tasks simultaneously may cause performance draw back on some android system / browsers.
// You can adjust the number based on your own test result, you have to set it before any loading process to take effect.
if (cc.sys.isBrowser && cc.sys.os === cc.sys.OS_ANDROID) {
//下载时的最大并发数
cc.assetManager.downloader.maxConcurrency = 2;
//下载时每帧可以启动的最大请求数
cc.assetManager.downloader.maxRequestsPerFrame = 2;
}
var launchScene = settings.launchScene;
var bundle = cc.assetManager.bundles.find(function (b) {
return b.getSceneInfo(launchScene);
});
//通过场景名称加载分包中的场景。
bundle.loadScene(launchScene, null, onProgress,
function (err, scene) {
if (!err) {
cc.director.runSceneImmediate(scene);
if (cc.sys.isBrowser) {
// show canvas
var canvas = document.getElementById('GameCanvas');
canvas.style.visibility = '';
var div = document.getElementById('GameDiv');
if (div) {
div.style.backgroundImage = '';
}
console.log('Success to load scene: ' + launchScene);
}
}
}
);
};
//游戏运行的各项参数
var option = {
id: 'GameCanvas',
debugMode: settings.debug ? cc.debug.DebugMode.INFO : cc.debug.DebugMode.ERROR,//几种模式 具体下面详细说明
showFPS: settings.debug,//
frameRate: 60,
groupList: settings.groupList, 分组
collisionMatrix: settings.collisionMatrix, 分组可进行碰撞的配置
};
1. debugMode（debug 模式，但是在浏览器中这个选项会被忽略） <br/>
* "debugMode" 各种设置选项的意义。 <br/>
* 0 - 没有消息被打印出来。 <br/>
* 1 - cc.error，cc.assert，cc.warn，cc.log 将打印在 console 中。 <br/>
* 2 - cc.error，cc.assert，cc.warn 将打印在 console 中。 <br/>
* 3 - cc.error，cc.assert 将打印在 console 中。 <br/>
* 4 - cc.error，cc.assert，cc.warn，cc.log 将打印在 canvas 中（仅适用于 web 端）。<br/>
* 5 - cc.error，cc.assert，cc.warn 将打印在 canvas 中（仅适用于 web 端）。 <br/>
* 6 - cc.error，cc.assert 将打印在 canvas 中（仅适用于 web 端）。 <br/>
* 2. showFPS（显示 FPS） <br/>
* 当 showFPS 为 true 的时候界面的左下角将显示 fps 的信息，否则被隐藏。
* 4. frameRate (帧率) <br/>
* “frameRate” 设置想要的帧率你的游戏，但真正的FPS取决于你的游戏实现和运行环境。 <br/>
根据配置初始化 assetManager
cc.assetManager.init({
bundleVers: settings.bundleVers,
remoteBundles: settings.remoteBundles,
server: settings.server
});
//声明容器，存放内置bundle
let bundleRoot = [INTERNAL, MAIN];
settings.hasStartSceneBundle && bundleRoot.push(START_SCENE);
settings.hasResourcesBundle && bundleRoot.push(RESOURCES);
var count = 0;
function cb (err) {
if (err) return console.error(err.message, err.stack);
count++;
//第三步，内置bundle 加载完毕，
运行游戏，并且指定引擎配置和 onStart 的回调。
if (count === bundleRoot.length + 1) {
cc.game.run(option, onStart);
}
}
//第一步加载导入为插件的script
cc.assetManager.loadScript(settings.jsList.map(function (x) { return 'src/' + x;}), cb);
第二步，加载内置的bundle
for (let i = 0; i < bundleRoot.length; i++) {
cc.assetManager.loadBundle(bundleRoot[i], cb);
}
};
if (window.jsb) {
var isRuntime = (typeof loadRuntime === 'function');
if (isRuntime) {
require('src/settings.js');
require('src/cocos2d-runtime.js');
if (CC_PHYSICS_BUILTIN || CC_PHYSICS_CANNON) {
require('src/physics.js');
}
require('jsb-adapter/engine/index.js');
}
else {
require('src/settings.js');
require('src/cocos2d-jsb.js');
if (CC_PHYSICS_BUILTIN || CC_PHYSICS_CANNON) {
require('src/physics.js');
}
require('jsb-adapter/jsb-engine.js');
}
/*
* 是否在将贴图上传至 GPU 之后删除原始图片缓存，删除之后图片将无法进行 [动态合图](https://docs.cocos.com/creator/manual/zh/advanced-topics/dynamic-atlas.html)。
* 在 Web 平台，你通常不需要开启这个选项，因为在 Web 平台 Image 对象所占用的内存很小。
* 但是在微信小游戏平台的当前版本，Image 对象会缓存解码后的图片数据，它所占用的内存空间很大。
* 所以我们在微信平台默认开启了这个选项，这样我们就可以在上传 GL 贴图之后立即释放 Image 对象的内存，避免过高的内存占用。
*/
cc.macro.CLEANUP_IMAGE_CACHE = true;
window.boot();
}
欢迎交流
