cocos creator集成小游戏去掉背景

在游戏开发过程中，如果小游戏是集成到APP里面，就可能会需要，

把cocos本身自带背景给去掉，让玩家有一种，游戏浮在app上的视觉效果。

在这里提供分享一种方法，可能会给开发者带来帮助。

如果不加以处理，会默认成黑色。

首先将creator工程打包成H5项目后，在build文件夹下，找到打包后的h5文件夹，进入找到main.js，打开找到cc.game.run，在前面加上cc.macro.ENABLETRANSPARENT_CANVAS = true;

在main.js中加入如下两行即可让canvas变透明

cc.director.setClearColor(new cc.Color(0,0,0, 0));

cc.macro.ENABLE_TRANSPARENT_CANVAS = true;

添加的位置在：

 1  65         function setLoadingDisplay () {
 2  66             // Loading splash scene
 3  67             var splash = document.getElementById('splash');
 4  68             var progressBar = splash.querySelector('.progress-bar span');
 5  69             cc.loader.onProgress = function (completedCount, totalCount, item) {
 6  70                 var percent = 100 * completedCount / totalCount;
 7  71                 if (progressBar) {
 8  72                     progressBar.style.width = percent.toFixed(2) + '%';
 9  73                 }
10  74             };
11  75             splash.style.display = 'block';
12  76             progressBar.style.width = '0%';
13  77             cc.director.setClearColor(new cc.Color(0,0,0, 0));//插入设置透明色
14  78             cc.director.once(cc.Director.EVENT_AFTER_SCENE_LAUNCH, function () {
15  79                 splash.style.display = 'none';
16  80             });
17  81         }
18  82         cc.macro.ENABLE_TRANSPARENT_CANVAS = true;//修改状态属性
19  83         var onStart = function () {}

然后在同目录下修改style-mobile.js文件，将和颜色有关的background都改为transparent，这样，不管是loading页面还是游戏中的背景都会变为透明了。

另外在Cocos引擎中，Canvas的背景，其颜色也是默认为黑色的，需要修改：

参考文档：https://www.cnblogs.com/luorende/p/10750851.html

　　　　　https://blog.csdn.net/xw1110280055/article/details/84886411