蚂蚁庄园运动会登山赛!3d项目入门实战!Cocos Creator 3D!
程序员文章站
2022-07-14 11:42:10
...
好像没写过3d项目分享,那么就跟着蚂蚁庄园的小鸡一起跳跳跳吧!
效果预览
配置环境: cocos creator 3D 1.0.0
首先是寻找3d资源花费了大半天时间,开发3d游戏不易呀!最终还是向KUOKUO大佬那捞了一只鸡(鸭?)来用了。
由于是第一次写3d项目,摄像机镜头调了多次才达到预想的效果。
还用了一个天空盒,网上找的资源。
实现原理
生成道路是用预制资源,代码动态生成。
const element: Node = instantiate(this.prefab_land);
this.node_tree.addChild(element);
摄像机跟着小鸡一起往前移动(我写的是z轴移动)。
update(deltaTime: number) {
this.camera_game.node.setPosition(this.camera_game.node.position.x, this.camera_game.node.position.y, this.role.node.position.z)
}
监听TOUCH_MOVE事件控制小鸡左右移动,并要判断边界。注意手指移动的变化和实际屏幕看到的大小是不一样的,这是因为摄像机投影的原因。我是乘了一个系数,可能有其他方法判断?
private onTouMove(touch: Touch) {
const delta = touch.getUIDelta();
let targetX = this._curPos.x - delta.x * 1e-2;
if (targetX > 4.5) targetX = 4.5;
if (targetX < - 4.5) targetX = -4.5;
this._curPos.x = targetX;
}
往前跳的运动就是修改y(跳跃) 和 z(往前)的数值啦。
jumpRun() {
this._curPos.z += 0.1;
if (Math.floor(this._curPos.z / 2) > this._curIndex) {
this._curPos.y = 0;
this._curIndex++;
this.node.emit('JumpEnd', this._curIndex);
}
if (this._curPos.z % 2 < 1) {
this._curPos.y += 0.2;
} else {
this._curPos.y -= 0.2;
}
}
小结
cocos creator 3d 用起来挺顺手的(我也没用过其他3d引擎????哈哈哈),就是我家的 mac-mini 好像撑不住,只要打开工具一段时间就一直在叫(可能我的设备落后),不过整体的效果还是不错的。
其实开发3d项目还是要一些基础知识的,如正交投影,透视投影,点光源,平行光源等等。(我也是在webgl编程指南里学到的,建议看看哦????)
第一次写3d项目的比较矬一点,还有很多需要学习的。如有错误或者其他想法,欢迎留言!我有新想法也会第一时间分享给大家!点个关注不迷路哦!
游戏开发小赤佬,也玩python 和 shell。—白玉无冰