很多小伙伴第一次使用摄像机的时候常常搞不清楚摄像机的逻辑,很多组件的运动方式和想象中有极大偏差。
事实上摄像机是一个渲染工具,创作时如果需要摄像机跟随主角移动,就需要重新添加一个摄像机来保持跟随主角,这样就至少有两个摄像机,这两个摄像机分别渲染不同的组件。需要注意的是摄像机渲染组件的分组和碰撞组相同,在实际操作中可能会出现冲突!
好了,现在介绍两个摄像机的渲染选择。这点做不好你可能发现各个组件的运动方式和想象的不一样,但又不清楚是摄像机的问题还是代码出了问题。渲染的选择首先梳理清楚思路,屏幕上出现组件有三种。
1、在屏幕上固定的组件(无论角色怎样移动都不会被甩到后面的组件,例如拳皇、街霸类对打游戏上方的血条)这点用固定摄像机camera1来渲染。如下图,只渲染UI部分,并且Depth选择0,这决定了渲染顺序,由于移动摄像机camera2的的Depth为-1,所以camera1渲染的部分相对处于高一级的图层。
2、会移动的组件(例如地图,角色移动时,角色处在屏幕中央,地图位置则在变化),这类使用移动摄像机2来渲染,Depth设为-1。
3、主角,尽管主角总是处在屏幕中央,但它实际上是移动的,只不过移动摄像机2会根据主角移动调整坐标,始终跟随主角移动。所以主角用移动摄像机2来渲染。
最后附上相机跟随主角移动的脚本代码:
cc.Class({
extends: cc.Component,
properties: {
target: {
default: null,
type: cc.Node
},
},
onLoad: function () {
this.camera = this.getComponent(cc.Camera);
},
lateUpdate: function () {
let targetPos = this.target.convertToWorldSpaceAR(cc.Vec2.ZERO);
this.node.position = this.node.parent.convertToNodeSpaceAR(targetPos);
}
});