版權(quán)申明：
本文原創(chuàng)首發(fā)于以下網(wǎng)站翔忽，您可以自由轉(zhuǎn)載怯邪，但必須加入完整的版權(quán)聲明
博客園：https://www.cnblogs.com/MogooStudio/
csdn博客：https://blog.csdn.net/nmjkl001/
知乎：https://www.zhihu.com/people/MogooStudio/
簡書：http://www.reibang.com/u/9547c81ca54e
segmentfault：https://segmentfault.com/u/mogoostudio
最后效果
在這里插入圖片描述
源碼分享
- 以下步驟詳細(xì)內(nèi)容可能跟源碼中有出入骂远，一切以源碼為準(zhǔn)
- CocosCreator版本：2.1.2趣避，務(wù)必使用大于此版本的引擎運(yùn)行
- 源碼地址： https://github.com/MogooStudio/Runningfloor
簡單步驟
1. 創(chuàng)建工程（略）
2. 材質(zhì)box
- 創(chuàng)建材質(zhì)box
- 設(shè)置材質(zhì)box的effect屬性為builtin-unit（內(nèi)置的無光照）
- 勾選USE_DIFFUSE_TEXTURE（實(shí)用漫反射紋理）尸执，點(diǎn)擊應(yīng)用
-
拖動(dòng)texture紋理到diffuseTexture中
在這里插入圖片描述
3. 預(yù)制件box
- 創(chuàng)建3D節(jié)點(diǎn)Box婚夫，命名為box
- 創(chuàng)建box.js腳本浸卦，腳本內(nèi)容見源碼
- 拖動(dòng)box.js腳本到預(yù)制件box下
- 拖動(dòng)材質(zhì)box到預(yù)制件MeshRanderer組件下面的Materials中
-
拖到prefab文件夾下生成預(yù)制件
在這里插入圖片描述
4. 管理節(jié)點(diǎn)mgr
-
創(chuàng)建空節(jié)點(diǎn)mgr，設(shè)置節(jié)點(diǎn)為3D節(jié)點(diǎn)
在這里插入圖片描述 - 設(shè)置節(jié)點(diǎn)x左右為480请敦，y坐標(biāo)為300镐躲，z坐標(biāo)為0
5. Canvas節(jié)點(diǎn)
- 創(chuàng)建main.js腳本储玫，腳本內(nèi)容見源碼
- 拖動(dòng)main.js腳本到Canvas節(jié)點(diǎn)下
- 拖動(dòng)mgr節(jié)點(diǎn)到main.js腳本組件相應(yīng)中
- 拖動(dòng)box預(yù)制件到main.js腳本組件相應(yīng)中
6. 攝像機(jī)
- 設(shè)置主攝像機(jī)的模式改為3D，z坐標(biāo)設(shè)置為800
- 去掉ortho勾選萤皂，設(shè)置fov為60
我的聯(lián)系方式：
QQ：2161044579
郵箱：mogoostudio@outlook.com
Github：https://github.com/MogooStudio
