【用Cocos Creator给暗恋的女生写一个游戏(11)】——(Jump Game) 镜头跟随

上节自习大家是不是上的很开心啊。。。。

大家是不是发现了两个游戏有辣么多相同的地方，就连很多节点的名字都一样

但是有一个东西是第一游戏没有的，那就是中间的那个Camera

我把Camera节点添加上颜色

Camera就是标记一块区域，这块区域是干什么的呢？

又是最后面那位宝强同学说出了正确答案

这块区域就是镜头范围

拿拍电影来举例子，当拍一个场景时，场景里常常有主角，而主角常常有主角光环，所以摄像机的镜头就要对准主角，镜头要跟着主角移动

这里的镜头移动方式有两种

一种是中心移动，也就是以主角为中心，主角移动镜头就同步移动

另一种是边界移动，这种移动方式下我们给镜头设定一个范围，当主角移动出这个范围时，摄像机才移动

这在游戏中也很常见，比如英雄联盟的视角锁定，为了更贴切的感受，强烈建议你打开游戏撸一局，自由视角和中心视角的切换按钮是Y（老师是鼓励你们上网，早恋的，不然等你们到大学就晚了）

我们这里用的是边界移动的方式（中心移动的我也试了一下，真的有点晕）

CameraManager2.js

cc.Class({
    extends: cc.Component,

    properties: {
        bgSky:cc.Node,
        skySca:0,
        bgHill:cc.Node,
        hillSca:0,
        bgHillnear:cc.Node,
        hillnearSca:0,
        bgFloor:cc.Node,
        floorSca:0,
        cloudLayer:cc.Node,
        cloudSca:0,
        camera: cc.Node,
        player: cc.Node,

    },

    init: function(game){
        this.game = game;
    },

    moveBg: function(distance){
        //当主角跳出镜头边界时镜头才移动
        if(this.player.y > this.camera.y+this.camera.height/2){
            this.bgSky.y -= distance * this.skySca;
            this.bgHill.y -= distance * this.hillSca;
            this.bgHillnear.y -= distance * this.hillnearSca;
            this.bgFloor.y -= distance * this.floorSca;
            this.cloudLayer.y -= distance * this.cloudSca;
            this.player.y -= distance;
        }
    }
});

看看效果