为boxCollider与spriteRenderer新增debugRender

This commit is contained in:
YHH
2020-08-24 09:06:25 +08:00
parent 7345a17d24
commit 27f9e78fe5
19 changed files with 699 additions and 421 deletions

View File

@@ -1,4 +1,17 @@
///<reference path="../ECS/Core.ts" />
module es {
export class Colors {
public static renderableBounds = 0xffff00;
public static renderableCenter = 0x9932CC;
public static colliderBounds = 0x555555;
}
export class Size {
public static get lineSizeMultiplier(){
return Math.max(Math.ceil(Core.scene.x / Core.scene.width), 1);
}
}
export class Debug {
private static _debugDrawItems: DebugDrawItem[] = [];

View File

@@ -16,6 +16,10 @@ module es {
* 更新该组件的时间间隔。这与实体的更新间隔无关。
*/
public updateInterval: number = 1;
/**
* 用于装载debug使用的显示容器
*/
public debugDisplayObject: egret.DisplayObjectContainer = new egret.DisplayObjectContainer();
/**
* 快速访问 this.entity.transform

View File

@@ -362,7 +362,7 @@ module es {
}
public update() {
let halfScreen = Vector2.multiply(new Vector2(this.bounds.width, this.bounds.height), new Vector2(0.5));
let halfScreen = Vector2.multiply(this.bounds.size, new Vector2(0.5));
this._worldSpaceDeadZone.x = this.position.x - halfScreen.x * Core.scene.scaleX + this.deadzone.x + this.focusOffset.x;
this._worldSpaceDeadZone.y = this.position.y - halfScreen.y * Core.scene.scaleY + this.deadzone.y + this.focusOffset.y;
this._worldSpaceDeadZone.width = this.deadzone.width;
@@ -385,7 +385,7 @@ module es {
* @param position
*/
public clampToMapSize(position: Vector2) {
let halfScreen = Vector2.multiply(new Vector2(this.bounds.width, this.bounds.height), new Vector2(0.5)).add(new Vector2(this.mapSize.x, this.mapSize.y));
let halfScreen = Vector2.multiply(this.bounds.size, new Vector2(0.5)).add(new Vector2(this.mapSize.x, this.mapSize.y));
let cameraMax = new Vector2(this.mapSize.width - halfScreen.x, this.mapSize.height - halfScreen.y);
return Vector2.clamp(position, halfScreen, cameraMax);

View File

@@ -1,6 +1,10 @@
///<reference path="./Collider.ts" />
module es {
export class BoxCollider extends Collider {
public hollowShape: egret.Shape = new egret.Shape();
public polygonShape: egret.Shape = new egret.Shape();
public pixelShape1: egret.Shape = new egret.Shape();
public pixelShape2: egret.Shape = new egret.Shape();
/**
* 零参数构造函数要求RenderableComponent在实体上这样碰撞器可以在实体被添加到场景时调整自身的大小。
*/
@@ -92,6 +96,27 @@ module es {
}
}
public debugRender() {
let poly = this.shape;
if (!this.hollowShape.parent)
this.debugDisplayObject.addChild(this.hollowShape);
if (!this.polygonShape.parent)
this.debugDisplayObject.addChild(this.polygonShape);
if (!this.pixelShape1.parent)
this.debugDisplayObject.addChild(this.pixelShape1);
if (!this.pixelShape2.parent)
this.debugDisplayObject.addChild(this.pixelShape2);
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.endFill();
}
public toString() {
return `[BoxCollider: bounds: ${this.bounds}]`;
}

View File

@@ -1,5 +1,6 @@
module es {
export abstract class Collider extends Component {
public debug
/**
* 对撞机的基本形状
*/

View File

@@ -8,6 +8,8 @@ module es {
* 用于装载egret显示对象
*/
public displayObject: egret.DisplayObject = new egret.DisplayObject();
public hollowShape: egret.Shape = new egret.Shape();
public pixelShape: egret.Shape = new egret.Shape();
/**
* 用于着色器处理精灵
*/
@@ -30,6 +32,7 @@ module es {
return this.bounds.height;
}
public debugRenderEnabled: boolean = true;
protected _localOffset: Vector2 = Vector2.zero;
/**
@@ -109,6 +112,32 @@ module es {
*/
public abstract render(camera: Camera);
public debugRender() {
if (!this.debugRenderEnabled)
return;
if (!this.hollowShape.parent)
this.debugDisplayObject.addChild(this.hollowShape);
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();
}
let pixelPos = Vector2.add(this.entity.transform.position, this._localOffset);
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.endFill();
}
/**
* 如果renderableComponent的边界与camera.bounds相交 返回true
* 用于处理isVisible标志的状态开关
@@ -184,6 +213,7 @@ module es {
*/
protected onBecameVisible() {
this.displayObject.visible = this.isVisible;
this.debugDisplayObject.visible = this.isVisible;
}
/**
@@ -192,6 +222,7 @@ module es {
*/
protected onBecameInvisible() {
this.displayObject.visible = this.isVisible;
this.debugDisplayObject.visible = this.isVisible;
}
}
}

View File

@@ -77,10 +77,13 @@ module es {
// 处理渲染层列表
if (component instanceof RenderableComponent) {
this._entity.scene.removeChild(component.displayObject);
if (component.displayObject.parent)
component.displayObject.parent.removeChild(component.displayObject);
this._entity.scene.renderableComponents.remove(component);
}
if (component.debugDisplayObject.parent)
component.debugDisplayObject.parent.removeChild(component.debugDisplayObject);
this._entity.componentBits.set(ComponentTypeManager.getIndexFor(component), false);
this._entity.scene.entityProcessors.onComponentRemoved(this._entity);
@@ -96,6 +99,7 @@ module es {
this._entity.scene.renderableComponents.add(component);
}
this._entity.scene.addChild(component.debugDisplayObject);
this._entity.componentBits.set(ComponentTypeManager.getIndexFor(component));
this._entity.scene.entityProcessors.onComponentAdded(this._entity);
}
@@ -122,7 +126,7 @@ module es {
this._entity.scene.renderableComponents.add(component);
}
this._entity.scene.addChild(component.debugDisplayObject);
this._entity.componentBits.set(ComponentTypeManager.getIndexFor(component));
this._entity.scene.entityProcessors.onComponentAdded(this._entity);
@@ -162,7 +166,8 @@ module es {
this._entity.scene.renderableComponents.remove(component);
}
if (component.debugDisplayObject.parent)
component.debugDisplayObject.parent.removeChild(component.debugDisplayObject);
this._entity.componentBits.set(ComponentTypeManager.getIndexFor(component), false);
this._entity.scene.entityProcessors.onComponentRemoved(this._entity);

View File

@@ -88,10 +88,11 @@ module es {
* @param value
*/
public static normalize(value: Vector2) {
let val = 1 / Math.sqrt((value.x * value.x) + (value.y * value.y));
value.x *= val;
value.y *= val;
return value;
let nValue = new Vector2(value.x, value.y);
let val = 1 / Math.sqrt((nValue.x * nValue.x) + (nValue.y * nValue.y));
nValue.x *= val;
nValue.y *= val;
return nValue;
}
/**

View File

@@ -88,7 +88,7 @@ module es {
p2 = this.points[i + 1];
let perp = Vector2Ext.perpendicular(p1, p2);
perp = Vector2.normalize(perp);
Vector2Ext.normalize(perp);
this._edgeNormals[i] = perp;
}
}
@@ -103,7 +103,7 @@ module es {
for (let i = 0; i < vertCount; i++) {
let a = 2 * Math.PI * (i / vertCount);
verts[i] = Vector2.multiply(new Vector2(Math.cos(a), Math.sin(a)), new Vector2(radius));
verts[i] = new Vector2(Math.cos(a) * radius, Math.sin(a) * radius);
}
return verts;
@@ -116,7 +116,7 @@ module es {
public static recenterPolygonVerts(points: Vector2[]) {
let center = this.findPolygonCenter(points);
for (let i = 0; i < points.length; i++)
points[i] = Vector2.subtract(points[i], center);
points[i].subtract(center);
}
/**
@@ -163,9 +163,10 @@ module es {
* @param distanceSquared
* @param edgeNormal
*/
public static getClosestPointOnPolygonToPoint(points: Vector2[], point: Vector2, distanceSquared: number, edgeNormal: Vector2): Vector2 {
public static getClosestPointOnPolygonToPoint(points: Vector2[], point: Vector2, distanceSquared: Number, edgeNormal: Vector2): Vector2 {
distanceSquared = Number.MAX_VALUE;
edgeNormal = new Vector2(0, 0);
edgeNormal.x = 0;
edgeNormal.y = 0;
let closestPoint = new Vector2(0, 0);
let tempDistanceSquared;
@@ -183,7 +184,8 @@ module es {
// 求直线的法线
let line = Vector2.subtract(points[j], points[i]);
edgeNormal = new Vector2(-line.y, line.x);
edgeNormal.x = -line.y;
edgeNormal.y = line.x;
}
}

View File

@@ -179,7 +179,7 @@ module es {
let depth = result.normal.length() - circle.radius;
result.point = closestPointOnBounds;
result.normal = Vector2Ext.normalize(result.normal);
Vector2Ext.normalize(result.normal);
result.minimumTranslationVector = Vector2.multiply(new Vector2(depth), result.normal);
return true;
@@ -261,6 +261,7 @@ module es {
*
* @param first
* @param second
* @param result
*/
public static circleToCircle(first: Circle, second: Circle, result: CollisionResult): boolean {
let distanceSquared = Vector2.distanceSquared(first.position, second.position);

View File

@@ -36,12 +36,10 @@ module es {
public static normalize(vec: Vector2) {
let magnitude = Math.sqrt((vec.x * vec.x) + (vec.y * vec.y));
if (magnitude > MathHelper.Epsilon) {
vec = Vector2.divide(vec, new Vector2(magnitude));
vec.divide(new Vector2(magnitude));
} else {
vec.x = vec.y = 0;
}
return vec;
}
/**