CocosPlugin/esengine
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

debugRender 新增camera参数来修正渲染位置

Browse Source
This commit is contained in:
yhh
2020-08-28 18:04:50 +08:00
parent a3c53116e1
commit 7a308f76b6
27 changed files with 236 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
source/src/ECS/Component.ts
View File

@@ -85,7 +85,7 @@ module es {
/**
*
*/
public debugRender() {
public debugRender(camera: Camera) {
}
/**

6
source/src/ECS/Components/Camera.ts
View File

@@ -312,7 +312,7 @@ module es {
*/
public worldToScreenPoint(worldPosition: Vector2): Vector2 {
this.updateMatrixes();
worldPosition = Vector2Ext.transformR(worldPosition, this._transformMatrix);
Vector2Ext.transformR(worldPosition, this._transformMatrix, worldPosition);
return worldPosition;
}
@@ -322,7 +322,7 @@ module es {
*/
public screenToWorldPoint(screenPosition: Vector2): Vector2 {
this.updateMatrixes();
screenPosition = Vector2Ext.transformR(screenPosition, this._inverseTransformMatrix);
Vector2Ext.transformR(screenPosition, this._inverseTransformMatrix, screenPosition);
return screenPosition;
}
@@ -363,7 +363,7 @@ module es {
this._transformMatrix = this._transformMatrix.multiply(tempMat);
}
tempMat = Matrix2D.create().translate(this._origin.x, this._origin.y);
tempMat = Matrix2D.create().translate(Math.floor(this._origin.x), Math.floor(this._origin.y));
this._transformMatrix = this._transformMatrix.multiply(tempMat);
this._inverseTransformMatrix = this._transformMatrix.invert();

6
source/src/ECS/Components/FollowCamera.ts
View File

@@ -82,7 +82,7 @@ module es {
}
}
public debugRender() {
public debugRender(camera: Camera) {
if (!this.rectShape)
this.debugDisplayObject.addChild(this.rectShape);
@@ -90,13 +90,13 @@ module es {
if (this._cameraStyle == CameraStyle.lockOn){
this.rectShape.graphics.beginFill(0x8B0000, 0);
this.rectShape.graphics.lineStyle(1, 0x8B0000);
this.rectShape.graphics.drawRect(this._worldSpaceDeadZone.x - 5, this._worldSpaceDeadZone.y - 5,
this.rectShape.graphics.drawRect(this._worldSpaceDeadZone.x - 5 - camera.bounds.x, this._worldSpaceDeadZone.y - 5 - camera.bounds.y,
this._worldSpaceDeadZone.width, this._worldSpaceDeadZone.height);
this.rectShape.graphics.endFill();
} else {
this.rectShape.graphics.beginFill(0x8B0000, 0);
this.rectShape.graphics.lineStyle(1, 0x8B0000);
this.rectShape.graphics.drawRect(this._worldSpaceDeadZone.x, this._worldSpaceDeadZone.y,
this.rectShape.graphics.drawRect(this._worldSpaceDeadZone.x - camera.bounds.x, this._worldSpaceDeadZone.y - camera.bounds.y,
this._worldSpaceDeadZone.width, this._worldSpaceDeadZone.height);
this.rectShape.graphics.endFill();
}

22
source/src/ECS/Components/Physics/Colliders/BoxCollider.ts
View File

@@ -94,7 +94,7 @@ module es {
}
}
public debugRender() {
public debugRender(camera: Camera) {
let poly = this.shape as Polygon;
if (!this.hollowShape.parent)
this.debugDisplayObject.addChild(this.hollowShape);
@@ -111,7 +111,7 @@ module es {
this.hollowShape.graphics.clear();
this.hollowShape.graphics.beginFill(Colors.colliderBounds, 0);
this.hollowShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderBounds);
this.hollowShape.graphics.drawRect(this.bounds.x, this.bounds.y, this.bounds.width, this.bounds.height);
this.hollowShape.graphics.drawRect(this.bounds.x - camera.bounds.x, this.bounds.y - camera.bounds.y, this.bounds.width, this.bounds.height);
this.hollowShape.graphics.endFill();
this.polygonShape.graphics.clear();
@@ -120,30 +120,30 @@ module es {
this.polygonShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderEdge);
for (let i = 0; i < poly.points.length; i ++){
if (i == 0){
this.polygonShape.graphics.moveTo(poly.position.x + poly.points[i].x, poly.position.y + poly.points[i].y);
this.polygonShape.graphics.moveTo(poly.position.x + poly.points[i].x - camera.bounds.x, poly.position.y + poly.points[i].y - camera.bounds.y);
}else{
this.polygonShape.graphics.lineTo(poly.position.x + poly.points[i].x, poly.position.y + poly.points[i].y);
this.polygonShape.graphics.lineTo(poly.position.x + poly.points[i].x - camera.bounds.x, poly.position.y + poly.points[i].y - camera.bounds.y);
}
}
this.polygonShape.graphics.lineTo(poly.position.x + poly.points[poly.points.length - 1].x, poly.position.y + poly.points[0].y);
this.polygonShape.graphics.lineTo(poly.position.x + poly.points[poly.points.length - 1].x - camera.bounds.x, poly.position.y + poly.points[0].y - camera.bounds.y);
this.polygonShape.graphics.endFill();
}
this.pixelShape1.graphics.clear();
this.pixelShape1.graphics.beginFill(Colors.colliderPosition, 0);
this.pixelShape1.graphics.lineStyle(4 * Size.lineSizeMultiplier, Colors.colliderPosition);
this.pixelShape1.graphics.moveTo(this.entity.transform.position.x, this.entity.transform.position.y);
this.pixelShape1.graphics.lineTo(this.entity.transform.position.x, this.entity.transform.position.y);
this.pixelShape1.graphics.moveTo(this.entity.transform.position.x - camera.bounds.x, this.entity.transform.position.y - camera.bounds.y);
this.pixelShape1.graphics.lineTo(this.entity.transform.position.x - camera.bounds.x, this.entity.transform.position.y - camera.bounds.y);
this.pixelShape1.graphics.endFill();
this.pixelShape2.graphics.clear();
this.pixelShape2.graphics.beginFill(Colors.colliderCenter, 0);
this.pixelShape2.graphics.lineStyle(2 * Size.lineSizeMultiplier, Colors.colliderCenter);
this.pixelShape2.graphics.moveTo(this.entity.transform.position.x + this.shape.center.x,
this.entity.transform.position.y + this.shape.center.y);
this.pixelShape2.graphics.lineTo(this.entity.transform.position.x + this.shape.center.x,
this.entity.transform.position.y + this.shape.center.y);
this.pixelShape2.graphics.moveTo(this.entity.transform.position.x + this.shape.center.x - camera.bounds.x,
this.entity.transform.position.y + this.shape.center.y - camera.bounds.y);
this.pixelShape2.graphics.lineTo(this.entity.transform.position.x + this.shape.center.x - camera.bounds.x,
this.entity.transform.position.y + this.shape.center.y - camera.bounds.y);
this.pixelShape2.graphics.endFill();
}

14
source/src/ECS/Components/Physics/Colliders/CircleCollider.ts
View File

@@ -49,7 +49,7 @@ module es {
return this;
}
public debugRender() {
public debugRender(camera: Camera) {
if (!this.rectShape.parent)
this.debugDisplayObject.addChild(this.rectShape);
@@ -65,27 +65,27 @@ module es {
this.rectShape.graphics.clear();
this.rectShape.graphics.beginFill(Colors.colliderBounds, 0);
this.rectShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderBounds);
this.rectShape.graphics.drawRect(this.bounds.x, this.bounds.y, this.bounds.width, this.bounds.height);
this.rectShape.graphics.drawRect(this.bounds.x - camera.bounds.x, this.bounds.y - camera.bounds.y, this.bounds.width, this.bounds.height);
this.rectShape.graphics.endFill();
this.circleShape.graphics.clear();
this.circleShape.graphics.beginFill(Colors.colliderEdge, 0);
this.circleShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderEdge);
this.circleShape.graphics.drawCircle(this.shape.position.x, this.shape.position.y, (this.shape as Circle).radius);
this.circleShape.graphics.drawCircle(this.shape.position.x - camera.bounds.x, this.shape.position.y - camera.bounds.y, (this.shape as Circle).radius);
this.circleShape.graphics.endFill();
this.pixelShape1.graphics.clear();
this.pixelShape1.graphics.beginFill(Colors.colliderPosition, 0);
this.pixelShape1.graphics.lineStyle(4 * Size.lineSizeMultiplier, Colors.colliderPosition);
this.pixelShape1.graphics.moveTo(this.entity.transform.position.x, this.entity.transform.position.y);
this.pixelShape1.graphics.lineTo(this.entity.transform.position.x, this.entity.transform.position.y);
this.pixelShape1.graphics.moveTo(this.entity.transform.position.x - camera.bounds.x, this.entity.transform.position.y - camera.bounds.y);
this.pixelShape1.graphics.lineTo(this.entity.transform.position.x - camera.bounds.y, this.entity.transform.position.y - camera.bounds.y);
this.pixelShape1.graphics.endFill();
this.pixelShape2.graphics.clear();
this.pixelShape2.graphics.beginFill(Colors.colliderCenter, 0);
this.pixelShape2.graphics.lineStyle(2 * Size.lineSizeMultiplier, Colors.colliderCenter);
this.pixelShape2.graphics.moveTo(this.shape.position.x, this.shape.position.y);
this.pixelShape2.graphics.lineTo(this.shape.position.x, this.shape.position.y);
this.pixelShape2.graphics.moveTo(this.shape.position.x - camera.bounds.x, this.shape.position.y - camera.bounds.y);
this.pixelShape2.graphics.lineTo(this.shape.position.x - camera.bounds.x, this.shape.position.y - camera.bounds.y);
this.pixelShape2.graphics.endFill();
}

2
source/src/ECS/Components/Physics/Colliders/Collider.ts
View File

@@ -136,7 +136,7 @@ module es {
// 获取渲染的中心，将其转移到本地坐标，并使用它作为碰撞器的localOffset
this.localOffset = Vector2.subtract(renderableBounds.center, this.entity.transform.position);
} else {
console.warn("Collider has no shape and no RenderableComponent. Can't figure out how to size it.");
console.warn("碰撞器没有形状和RenderableComponent。不知道如何调整大小.");
}
}

32
source/src/ECS/Components/RenderableComponent.ts
View File

@@ -112,7 +112,7 @@ module es {
*/
public abstract render(camera: Camera);
public debugRender() {
public debugRender(camera: Camera) {
if (!this.debugRenderEnabled)
return;
@@ -122,20 +122,20 @@ module es {
if (!this.pixelShape.parent)
this.debugDisplayObject.addChild(this.pixelShape);
// if (!this.entity.getComponent(Collider)){
// this.hollowShape.graphics.clear();
// this.hollowShape.graphics.beginFill(Colors.renderableBounds, 0);
// this.hollowShape.graphics.lineStyle(1, Colors.renderableBounds);
// this.hollowShape.graphics.drawRect(this.bounds.x, this.bounds.y, this.bounds.width, this.bounds.height);
// this.hollowShape.graphics.endFill();
// }
if (!this.entity.getComponent(Collider)){
this.hollowShape.graphics.clear();
this.hollowShape.graphics.beginFill(Colors.renderableBounds, 0);
this.hollowShape.graphics.lineStyle(1, Colors.renderableBounds);
this.hollowShape.graphics.drawRect(this.bounds.x - camera.bounds.x, this.bounds.y - camera.bounds.y, this.bounds.width, this.bounds.height);
this.hollowShape.graphics.endFill();
}
let pixelPos = Vector2.add(this.entity.transform.position, this._localOffset);
let pixelPos = Vector2.add(this.entity.transform.position, this._localOffset).subtract(camera.bounds.location);
this.pixelShape.graphics.clear();
this.pixelShape.graphics.beginFill(Colors.renderableCenter, 0);
this.pixelShape.graphics.lineStyle(4, Colors.renderableCenter);
this.pixelShape.graphics.lineTo(pixelPos.x, pixelPos.y);
this.pixelShape.graphics.moveTo(pixelPos.x, pixelPos.y);
this.pixelShape.graphics.lineTo(pixelPos.x, pixelPos.y);
this.pixelShape.graphics.endFill();
}
@@ -195,13 +195,15 @@ module es {
* 进行状态同步
*/
public sync(camera: Camera) {
let afterPos = new Vector2(this.entity.position.x + this.localOffset.x - camera.position.x + camera.origin.x,
this.entity.position.y + this.localOffset.y - camera.position.y + camera.origin.y);
if (this.displayObject.x != afterPos.x) this.displayObject.x = afterPos.x;
if (this.displayObject.y != afterPos.y) this.displayObject.y = afterPos.y;
if (this.displayObject.x != this.bounds.x - camera.bounds.y) this.displayObject.x = this.bounds.x - camera.bounds.y;
if (this.displayObject.y != this.bounds.y - camera.bounds.y) this.displayObject.y = this.bounds.y - camera.bounds.y;
if (this.displayObject.scaleX != this.entity.scale.x) this.displayObject.scaleX = this.entity.scale.x;
if (this.displayObject.scaleY != this.entity.scale.y) this.displayObject.scaleY = this.entity.scale.y;
if (this.displayObject.rotation != this.entity.rotation) this.displayObject.rotation = this.entity.rotation;
if (this.displayObject.rotation != this.entity.rotationDegrees) this.displayObject.rotation = this.entity.rotationDegrees;
}
public compareTo(other: RenderableComponent){
return other.renderLayer - this.renderLayer;
}
public toString() {

6
source/src/ECS/Components/SpriteRenderer.ts
View File

@@ -123,10 +123,8 @@ module es {
public render(camera: Camera) {
this.sync(camera);
let afterPos = new Vector2(this.entity.position.x + this.localOffset.x - this.origin.x - camera.position.x + camera.origin.x,
this.entity.position.y + this.localOffset.y - this.origin.y - camera.position.y + camera.origin.y);
if (this.displayObject.x != afterPos.x) this.displayObject.x = afterPos.x;
if (this.displayObject.y != afterPos.y) this.displayObject.y = afterPos.y;
if (this.displayObject.x != this.bounds.x - camera.bounds.x) this.displayObject.x = this.bounds.x - camera.bounds.x;
if (this.displayObject.y != this.bounds.y - camera.bounds.y) this.displayObject.y = this.bounds.y - camera.bounds.y;
}
}
}

4
source/src/ECS/Entity.ts
View File

@@ -305,8 +305,8 @@ module es {
/**
* 在默认渲染器中，如果Core.debugRenderEnabled为true，则调用。自定义渲染器可以选择是否调用它。
*/
public debugRender(){
this.components.debugRender();
public debugRender(camera: Camera){
this.components.debugRender(camera);
}
/**

1
source/src/ECS/Scene.ts
View File

@@ -184,6 +184,7 @@ module es {
}
for (let i = 0; i < this._renderers.length; i++) {
this.camera.forceMatrixUpdate();
this._renderers[i].render(this);
}
}

6
source/src/ECS/Transform.ts
View File

@@ -43,7 +43,7 @@ module es {
constructor(entity: Entity) {
super();
this.entity = entity;
this.scale = Vector2.one;
this.scale = this._localScale = Vector2.one;
this._children = [];
}
@@ -147,7 +147,7 @@ module es {
this._position = this._localPosition;
} else {
this.parent.updateTransform();
this._position = Vector2Ext.transformR(this._localPosition, this.parent._worldTransform);
Vector2Ext.transformR(this._localPosition, this.parent._worldTransform, this._position);
}
this._positionDirty = false;
@@ -293,7 +293,7 @@ module es {
this._position = position;
if (this.parent) {
this.localPosition = Vector2Ext.transformR(this._position, this._worldToLocalTransform);
this.localPosition = Vector2.transform(this._position, this._worldToLocalTransform);
} else {
this.localPosition = position;
}

4
source/src/ECS/Utils/ComponentList.ts
View File

@@ -274,10 +274,10 @@ module es {
this._components[i].onDisabled();
}
public debugRender(){
public debugRender(camera: Camera){
for (let i = 0; i < this._components.length; i ++){
if (this._components[i].enabled)
this._components[i].debugRender();
this._components[i].debugRender(camera);
}
}
}

2
source/src/Graphics/Renderers/IRenderable.ts
View File

@@ -38,7 +38,7 @@ module es {
/**
* 只有在没有碰撞器时才呈现边界。总是在原点上渲染一个正方形。
*/
debugRender();
debugRender(camera: Camera);
}
/**

2
source/src/Graphics/Renderers/RenderLayerExcludeRenderer.ts
View File

@@ -31,7 +31,7 @@ module es {
let renderable = scene.renderableComponents.buffer[i];
if (!this.excludedRenderLayers.contains(renderable.renderLayer) && renderable.enabled &&
renderable.isVisibleFromCamera(cam))
renderable.debugRender();
renderable.debugRender(cam);
}
super.debugRender(scene, cam);

2
source/src/Graphics/Renderers/Renderer.ts
View File

@@ -89,7 +89,7 @@ module es {
for (let i = 0; i < scene.entities.count; i ++){
let entity = scene.entities.buffer[i];
if (entity.enabled)
entity.debugRender();
entity.debugRender(cam);
}
}
}

2
source/src/Graphics/Renderers/ScreenSpaceRenderer.ts
View File

@@ -34,7 +34,7 @@ module es {
for (let j = 0; j < renderables.length; j ++){
let entity = renderables[j];
if (entity.enabled)
entity.debugRender();
entity.debugRender(cam);
}
}
}

8
source/src/Math/Rectangle.ts
View File

@@ -243,10 +243,10 @@ module es {
let bottomLeft = new Vector2(worldPosX, worldPosY + height);
let bottomRight = new Vector2(worldPosX + width, worldPosY + height);
topLeft = Vector2Ext.transformR(topLeft, this._transformMat);
topRight = Vector2Ext.transformR(topRight, this._transformMat);
bottomLeft = Vector2Ext.transformR(bottomLeft, this._transformMat);
bottomRight = Vector2Ext.transformR(bottomRight, this._transformMat);
Vector2Ext.transformR(topLeft, this._transformMat, topLeft);
Vector2Ext.transformR(topRight, this._transformMat, topRight);
Vector2Ext.transformR(bottomLeft, this._transformMat, bottomLeft);
Vector2Ext.transformR(bottomRight, this._transformMat, bottomRight);
let minX = Math.min(topLeft.x, bottomRight.x, topRight.x, bottomLeft.x);
let maxX = Math.max(topLeft.x, bottomRight.x, topRight.x, bottomLeft.x);

5
source/src/Utils/Vector2Ext.ts
View File

@@ -62,10 +62,11 @@ module es {
}
}
public static transformR(position: Vector2, matrix: Matrix2D) {
public static transformR(position: Vector2, matrix: Matrix2D, result: Vector2) {
let x = (position.x * matrix.m11) + (position.y * matrix.m21) + matrix.m31;
let y = (position.x * matrix.m12) + (position.y * matrix.m22) + matrix.m32;
return new Vector2(x, y);
result.x = x;
result.y = y;
}
/**