讓編輯器顯示場景內(nèi)的相機視角

Cocos Creator 3.6.2

將下面的腳本放入項目中

    //EditorCamerHelper.ts
import { _decorator, Component, Camera, log, Node } from 'cc';
import { EDITOR } from 'cc/env';
const { ccclass, property, executeInEditMode } = _decorator;
declare const cce: any;

@ccclass('EditorCamerHelper')
@executeInEditMode
export class EditorCamerHelper extends Component {
    _targetCamera: Camera = null!
    get targetCamera() {
return this._targetCamera
    }
    @property(Camera)
    set targetCamera(v) {
this._targetCamera = v;
this.node.worldPosition = this.targetCamera.node.worldPosition
this.node.worldRotation = this.targetCamera.node.worldRotation
    }

    _refresh: boolean = false;
    get refresh() {
return this._refresh
    }
    @property
    set refresh(v) {
this._refresh = v;
this.syncFromCameraTransform()
    }

    start() {
        log('歡迎關注微信公眾號【白玉無冰】 https://mp.weixin.qq.com/s/-I6I6nG2Hnk6d1zqR-Gu2g')
this.syncFromCameraTransform()
    }

    onFocusInEditor() {
this.syncFromCameraTransform()
this.node.on(Node.EventType.TRANSFORM_CHANGED, this.onTransfromChange, this)
    }
    onLostFocusInEditor() {
this.node.off(Node.EventType.TRANSFORM_CHANGED, this.onTransfromChange, this)
this.refresh = false
    }

private syncFromCameraTransform() {
if (this.targetCamera) {
this.node.worldPosition = this.targetCamera.node.worldPosition
this.node.worldRotation = this.targetCamera.node.worldRotation
        }
    }

private onTransfromChange() {
if (EDITOR && this.refresh && this.targetCamera) {
this.targetCamera.node.worldPosition = this.node.worldPosition
this.targetCamera.node.worldRotation = this.node.worldRotation
        }
    }

    lateUpdate(deltaTime: number) {
if (EDITOR && this.refresh && this.targetCamera) {
const editorCamera: Camera = cce.Camera.camera;
            editorCamera.cameraType = this.targetCamera.cameraType
            editorCamera.fov = this.targetCamera.fov
            editorCamera.far = this.targetCamera.far
            editorCamera.orthoHeight = this.targetCamera.orthoHeight
            editorCamera.node.worldPosition = this.targetCamera.node.worldPosition
            editorCamera.node.worldRotation = this.targetCamera.node.worldRotation
        }
    }
}

  

將腳本文件拖入場景中

填充腳本參數(shù)

1. 選中腳本節(jié)點

2. 拖入想要顯示的相機

3. 勾上 refresh，會自動跟隨相機視角

當前腳本丟失焦點時，就不會繼續(xù)自動跟隨相機視角了。

勾上后顯示相機的視角

可以通過修改腳本節(jié)點的位置角度，同時修改相機的視角。

找到隱藏在編輯器中相機cce.Camera.camera，復制想要顯示的相機參數(shù)。

注意!!! 直接改編輯相機的參數(shù)可能會出現(xiàn)意外情況，出現(xiàn)異常時重啟編輯~~

歡迎關注公眾號【白玉無冰】