webgl加载页面修改
- 一、先看看加载时的前端代码
- 二、修改背景
- 第一个尝试：修改html，失败！
- 第二个尝试：修改js，成功！
- 看看效果：修改成功
- 三、修改图标
- 第一次尝试，成功！
- 四、修改进度条
- 第一次尝试，成功！
大家都知道在unity中用webgl发布后它有一个加载界面是unity的，这个很简单的页面，那我想修改成一个自己的页面怎么办呢？
我查了很多的方法不过好像是专业版能修改好像，我也不太清楚，然后对js代码不太懂的我就打算去研究一下规律呗。
一、先看看加载时的前端代码
看看这一块整块内容就是在这个ID是unityContainer的div标签里的。
大概看一下这个内容的含义吧~
【unityContainer】是包含整个加载和游戏界面的容器
【canvas】是游戏加载出来的画面（想知道为什么？因为我在游戏加载出来之后，删掉这个div元素游戏就没了。）
【logoDark】是这个加载界面的logo
【progress Dark】是进度条
对了，这里说明一下，因为我做的主要是手机端能玩，所以这个前端代码些许修改。
二、修改背景
下面这个是我游戏的主界面（因为是公司还没发布的东西还是模糊吧），所以等unity那个加载背景我想改成我自己的，那就试试改变吧。
如果不想听我讲废话研究过程，就直接跳到我研究成功的地方去吧！
第一个尝试：修改html，失败！
我以为很简单就能做的修改，那就是直接修改html里面改一下样式呗，直接把图片改成这个。
改变unityContainer的背景：style=“background: url(Build/index.jpg);”
<div class="webgl-content" style="width:100%;height: 100%;">
<div id="unityContainer" style="width:100%;height:100%;background: url(Build/index.jpg);"></div>
</div>emmm…没有用！！！因为好像那是js改变了它，我在html变不了它，哭泣…还是乖乖研究js吧
这里看到加载界面的东西好像都放在TemplateData下面，所以看一下里面的UnityProgress.js文件，然后发现这个大概是关于logo和进度条的，没有关于那个背景的更换。切换阵地研究。
第二个尝试：修改js，成功！
我发现Build文件夹里的json文件里面有一个backgroundColor，这个颜色还跟加载界面的颜色一样，一定是它了。
本来是根据html中的css语法来写，不可行，例如：
"backgroundImage":"url(Build/index.jpg)""background":"url(Build/index.jpg)"然后我就去看UnityLoader.js文件，搜索发现这一句，突然觉悟
把backgroundColor的那个语句改成，记得把图片放在Build文件夹下
"backgroundUrl":"index.jpg"
看看效果：修改成功
三、修改图标
这个我还没做，但是我觉得应该挺简单，感觉把文件夹里的unity图标换成自己的图标就好了应该~ 等下次更新吧！！
2020-05-22更新
第一次尝试，成功！
把原先的先给备份一下，以防万一不能用
然后把自己的图标两个都放进来更换掉，或者你只更换一个也ok随便你，一般更换progressLogo.Dark.png这个
看看结果，成功
四、修改进度条
也是选择更换掉图片的形式，虽然上面logo你可以不用太在意尺寸大小
不过进度条最好跟原先的一致吧~
第一次尝试，成功！
更换好啦 看看结果
完结！！！！
