From 180e365d60ab04bef144428dc879f20807d2b58e Mon Sep 17 00:00:00 2001 From: moshuying <1460083332@qq.com> Date: Fri, 21 Jul 2023 17:13:18 +0800 Subject: [PATCH 1/6] fix can't adjust the 2D camera in editor --- cocos/2d/framework/canvas.ts | 33 +-------------------------------- 1 file changed, 1 insertion(+), 32 deletions(-) diff --git a/cocos/2d/framework/canvas.ts b/cocos/2d/framework/canvas.ts index a4aef03ff73..ec7bbdd36b2 100644 --- a/cocos/2d/framework/canvas.ts +++ b/cocos/2d/framework/canvas.ts @@ -123,8 +123,6 @@ export class Canvas extends RenderRoot2D { protected _alignCanvasWithScreen = true; protected _thisOnCameraResized: () => void; - // fit canvas node to design resolution - protected _fitDesignResolution: (() => void) | undefined; private _pos = new Vec3(); private _renderMode = RenderMode.OVERLAY; @@ -132,26 +130,6 @@ export class Canvas extends RenderRoot2D { constructor () { super(); this._thisOnCameraResized = this._onResizeCamera.bind(this); - - if (EDITOR) { - this._fitDesignResolution = (): void => { - // TODO: support paddings of locked widget - this.node.getPosition(this._pos); - const nodeSize = view.getDesignResolutionSize(); - Vec3.set(_worldPos, nodeSize.width * 0.5, nodeSize.height * 0.5, 0); - - if (!this._pos.equals(_worldPos)) { - this.node.setPosition(_worldPos); - } - const trans = this.node._uiProps.uiTransformComp!; - if (trans.width !== nodeSize.width) { - trans.width = nodeSize.width; - } - if (trans.height !== nodeSize.height) { - trans.height = nodeSize.height; - } - }; - } } public __preload (): void { @@ -159,8 +137,6 @@ export class Canvas extends RenderRoot2D { const widget = this.getComponent('cc.Widget') as unknown as Widget; if (widget) { widget.updateAlignment(); - } else if (EDITOR) { - this._fitDesignResolution!(); } if (!EDITOR) { @@ -173,9 +149,6 @@ export class Canvas extends RenderRoot2D { this._onResizeCamera(); if (EDITOR) { - // Constantly align canvas node in edit mode - cclegacy.director.on(cclegacy.Director.EVENT_AFTER_UPDATE, this._fitDesignResolution!, this); - // In Editor can not edit these attrs. // (Position in Node, contentSize in uiTransform) // (anchor in uiTransform, but it can edit, this is different from cocos creator) @@ -203,11 +176,7 @@ export class Canvas extends RenderRoot2D { public onDestroy (): void { super.onDestroy(); - if (EDITOR) { - cclegacy.director.off(cclegacy.Director.EVENT_AFTER_UPDATE, this._fitDesignResolution!, this); - } else { - this.node.off(NodeEventType.TRANSFORM_CHANGED, this._thisOnCameraResized); - } + this.node.off(NodeEventType.TRANSFORM_CHANGED, this._thisOnCameraResized); } protected _onResizeCamera (): void { From 495d74c75cb1a04641170b04511534a5d5bc4a8b Mon Sep 17 00:00:00 2001 From: moshuying <1460083332@qq.com> Date: Tue, 25 Jul 2023 15:42:09 +0800 Subject: [PATCH 2/6] simple code --- cocos/2d/framework/canvas.ts | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/cocos/2d/framework/canvas.ts b/cocos/2d/framework/canvas.ts index ec7bbdd36b2..87a41498b54 100644 --- a/cocos/2d/framework/canvas.ts +++ b/cocos/2d/framework/canvas.ts @@ -123,6 +123,8 @@ export class Canvas extends RenderRoot2D { protected _alignCanvasWithScreen = true; protected _thisOnCameraResized: () => void; + // fit canvas node to design resolution + protected _fitDesignResolution: (() => void) | undefined; private _pos = new Vec3(); private _renderMode = RenderMode.OVERLAY; @@ -130,6 +132,26 @@ export class Canvas extends RenderRoot2D { constructor () { super(); this._thisOnCameraResized = this._onResizeCamera.bind(this); + + if (EDITOR) { + this._fitDesignResolution = (): void => { + // TODO: support paddings of locked widget + this.node.getPosition(this._pos); + const nodeSize = view.getDesignResolutionSize(); + Vec3.set(_worldPos, nodeSize.width * 0.5, nodeSize.height * 0.5, 0); + + if (!this._pos.equals(_worldPos)) { + this.node.setPosition(_worldPos); + } + const trans = this.node._uiProps.uiTransformComp!; + if (trans.width !== nodeSize.width) { + trans.width = nodeSize.width; + } + if (trans.height !== nodeSize.height) { + trans.height = nodeSize.height; + } + }; + } } public __preload (): void { @@ -137,6 +159,8 @@ export class Canvas extends RenderRoot2D { const widget = this.getComponent('cc.Widget') as unknown as Widget; if (widget) { widget.updateAlignment(); + } else if (EDITOR) { + this._fitDesignResolution!(); } if (!EDITOR) { From 553b36ce84a9fcaa7932a5f901a328679a876eb3 Mon Sep 17 00:00:00 2001 From: moshuying <1460083332@qq.com> Date: Tue, 25 Jul 2023 19:00:30 +0800 Subject: [PATCH 3/6] update function name --- cocos/2d/framework/canvas.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/cocos/2d/framework/canvas.ts b/cocos/2d/framework/canvas.ts index 87a41498b54..ab651674cc7 100644 --- a/cocos/2d/framework/canvas.ts +++ b/cocos/2d/framework/canvas.ts @@ -28,7 +28,7 @@ import { ccclass, help, disallowMultiple, executeInEditMode, import { EDITOR } from 'internal:constants'; import { Camera } from '../../misc/camera-component'; import { Widget } from '../../ui/widget'; -import { Vec3, screen, Enum, cclegacy, visibleRect } from '../../core'; +import { Vec3, screen, Enum, cclegacy, visibleRect, approx, EPSILON } from '../../core'; import { view } from '../../ui/view'; import { RenderRoot2D } from './render-root-2d'; import { NodeEventType } from '../../scene-graph/node-event'; @@ -124,7 +124,7 @@ export class Canvas extends RenderRoot2D { protected _thisOnCameraResized: () => void; // fit canvas node to design resolution - protected _fitDesignResolution: (() => void) | undefined; + protected fitDesignResolution_EDITOR: (() => void) | undefined; private _pos = new Vec3(); private _renderMode = RenderMode.OVERLAY; @@ -134,7 +134,7 @@ export class Canvas extends RenderRoot2D { this._thisOnCameraResized = this._onResizeCamera.bind(this); if (EDITOR) { - this._fitDesignResolution = (): void => { + this.fitDesignResolution_EDITOR = (): void => { // TODO: support paddings of locked widget this.node.getPosition(this._pos); const nodeSize = view.getDesignResolutionSize(); @@ -160,7 +160,7 @@ export class Canvas extends RenderRoot2D { if (widget) { widget.updateAlignment(); } else if (EDITOR) { - this._fitDesignResolution!(); + this.fitDesignResolution_EDITOR!(); } if (!EDITOR) { From b327c6a17112650a3ebe550644b3a985209350d9 Mon Sep 17 00:00:00 2001 From: moshuying <1460083332@qq.com> Date: Tue, 25 Jul 2023 19:01:39 +0800 Subject: [PATCH 4/6] remove unused import function --- cocos/2d/framework/canvas.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/cocos/2d/framework/canvas.ts b/cocos/2d/framework/canvas.ts index ab651674cc7..102da25186c 100644 --- a/cocos/2d/framework/canvas.ts +++ b/cocos/2d/framework/canvas.ts @@ -28,7 +28,7 @@ import { ccclass, help, disallowMultiple, executeInEditMode, import { EDITOR } from 'internal:constants'; import { Camera } from '../../misc/camera-component'; import { Widget } from '../../ui/widget'; -import { Vec3, screen, Enum, cclegacy, visibleRect, approx, EPSILON } from '../../core'; +import { Vec3, screen, Enum, cclegacy, visibleRect } from '../../core'; import { view } from '../../ui/view'; import { RenderRoot2D } from './render-root-2d'; import { NodeEventType } from '../../scene-graph/node-event'; From a27c7f4fa8011cdd9adfdd606711f0c70ec7f8e4 Mon Sep 17 00:00:00 2001 From: moshuying <1460083332@qq.com> Date: Tue, 25 Jul 2023 19:09:07 +0800 Subject: [PATCH 5/6] use anchorX --- cocos/2d/framework/canvas.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/cocos/2d/framework/canvas.ts b/cocos/2d/framework/canvas.ts index 102da25186c..35c64daef9c 100644 --- a/cocos/2d/framework/canvas.ts +++ b/cocos/2d/framework/canvas.ts @@ -138,12 +138,12 @@ export class Canvas extends RenderRoot2D { // TODO: support paddings of locked widget this.node.getPosition(this._pos); const nodeSize = view.getDesignResolutionSize(); - Vec3.set(_worldPos, nodeSize.width * 0.5, nodeSize.height * 0.5, 0); + const trans = this.node._uiProps.uiTransformComp!; + Vec3.set(_worldPos, nodeSize.width * trans.anchorX, nodeSize.height * trans.anchorY, 0); if (!this._pos.equals(_worldPos)) { this.node.setPosition(_worldPos); } - const trans = this.node._uiProps.uiTransformComp!; if (trans.width !== nodeSize.width) { trans.width = nodeSize.width; } From c7759aa51576921d87aa2cfacd0c2874d23c2ead Mon Sep 17 00:00:00 2001 From: moshuying <1460083332@qq.com> Date: Wed, 26 Jul 2023 19:31:42 +0800 Subject: [PATCH 6/6] update code --- cocos/2d/framework/canvas.ts | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/cocos/2d/framework/canvas.ts b/cocos/2d/framework/canvas.ts index 35c64daef9c..87e4eb5e422 100644 --- a/cocos/2d/framework/canvas.ts +++ b/cocos/2d/framework/canvas.ts @@ -139,7 +139,24 @@ export class Canvas extends RenderRoot2D { this.node.getPosition(this._pos); const nodeSize = view.getDesignResolutionSize(); const trans = this.node._uiProps.uiTransformComp!; - Vec3.set(_worldPos, nodeSize.width * trans.anchorX, nodeSize.height * trans.anchorY, 0); + + let scaleX = this.node.scale.x; + let anchorX = trans.anchorX; + if (scaleX < 0) { + anchorX = 1.0 - anchorX; + scaleX = -scaleX; + } + nodeSize.width = scaleX === 0 ? nodeSize.width : nodeSize.width / scaleX; + + let scaleY = this.node.scale.y; + let anchorY = trans.anchorY; + if (scaleY < 0) { + anchorY = 1.0 - anchorY; + scaleY = -scaleY; + } + nodeSize.height = scaleY === 0 ? nodeSize.height : nodeSize.height / scaleY; + + Vec3.set(_worldPos, nodeSize.width * anchorX, nodeSize.height * anchorY, 0); if (!this._pos.equals(_worldPos)) { this.node.setPosition(_worldPos);