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

#28 tiled objectgroup解析

Browse Source
This commit is contained in:
YHH
2020-08-15 21:59:52 +08:00
parent f0b2d5b9b8
commit 593cc83012
12 changed files with 282 additions and 285 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
source/src/Debug/DebugDrawItem.ts
View File

@@ -28,13 +28,13 @@ module es {
public draw(shape: egret.Shape): boolean {
switch (this.drawType) {
case DebugDrawType.line:
DrawUtils.drawLine(shape, this.start, this.end, this.color);
// DrawUtils.drawLine(shape, this.start, this.end, this.color);
break;
case DebugDrawType.hollowRectangle:
DrawUtils.drawHollowRect(shape, this.rectangle, this.color);
// DrawUtils.drawHollowRect(shape, this.rectangle, this.color);
break;
case DebugDrawType.pixel:
DrawUtils.drawPixel(shape, new Vector2(this.x, this.y), this.color, this.size);
// DrawUtils.drawPixel(shape, new Vector2(this.x, this.y), this.color, this.size);
break;
case DebugDrawType.text:
break;

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

@@ -162,11 +162,13 @@ module es {
* 进行状态同步
*/
public sync(camera: Camera) {
this.displayObject.x = this.entity.position.x + this.localOffset.x - camera.position.x + camera.origin.x;
this.displayObject.y = this.entity.position.y + this.localOffset.y - camera.position.y + camera.origin.y;
this.displayObject.scaleX = this.entity.scale.x;
this.displayObject.scaleY = this.entity.scale.y;
this.displayObject.rotation = this.entity.rotation;
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.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;
}
public toString() {

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

@@ -123,8 +123,10 @@ module es {
public render(camera: Camera) {
this.sync(camera);
this.displayObject.x = this.entity.position.x + this.localOffset.x - camera.position.x + camera.origin.x;
this.displayObject.y = this.entity.position.y + this.localOffset.y - camera.position.y + camera.origin.y;
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;
}
}
}

102
source/src/Tiled/TiledRendering.ts
View File

@@ -101,6 +101,29 @@ module es {
if (!objGroup.visible)
return;
function debugRender(obj: TmxObject, pos: Vector2){
if (!container)
return;
if (!Core.debugRenderEndabled)
return;
if (!obj.textField.parent && obj.name){
obj.textField.text = obj.name;
obj.textField.size = 12;
obj.textField.fontFamily = "sans-serif";
if (obj.shape){
obj.textField.x = pos.x + (obj.shape.width - obj.textField.width) / 2;
obj.textField.y = pos.y - obj.textField.height - 5;
}else{
obj.textField.x = pos.x + (obj.width - obj.textField.width) / 2;
obj.textField.y = pos.y - obj.textField.height - 5;
}
obj.textField.textColor = 0xffffff;
container.addChild(obj.textField);
}
}
for (let object in objGroup.objects) {
let obj = objGroup.objects[object];
if (!obj.visible)
@@ -115,20 +138,35 @@ module es {
let pos = Vector2.add(position, new Vector2(obj.x, obj.y).multiply(scale));
switch (obj.objectType) {
case TmxObjectType.basic:
if (!obj.shape.parent)
if (!obj.shape.parent){
obj.shape.x = obj.x;
obj.shape.y = obj.y;
container.addChild(obj.shape);
}
let rect = new Rectangle(pos.x, pos.y, obj.width * scale.x, obj.height * scale.y);
DrawUtils.drawHollowRect(obj.shape, rect, objGroup.color);
obj.shape.graphics.clear();
obj.shape.graphics.lineStyle(1, 0xa0a0a4);
obj.shape.graphics.beginFill(0x979798, 0.5);
obj.shape.graphics.drawRect(0, 0, obj.width * scale.x, obj.height * scale.y);
obj.shape.graphics.endFill();
debugRender(obj, pos);
break;
case TmxObjectType.point:
let size = objGroup.map.tileWidth * 0.5;
pos.x -= size * 0.5;
pos.y -= size * 0.5;
if (!obj.shape.parent)
if (!obj.shape.parent){
obj.shape.x = pos.x;
obj.shape.y = pos.y;
container.addChild(obj.shape);
}
DrawUtils.drawPixel(obj.shape, pos, objGroup.color, size);
obj.shape.graphics.clear();
obj.shape.graphics.lineStyle(1, 0xa0a0a4);
obj.shape.graphics.beginFill(0x979798, 0.5);
obj.shape.graphics.drawCircle(0, 0, 1);
obj.shape.graphics.endFill();
debugRender(obj, pos);
break;
case TmxObjectType.tile:
let tileset = objGroup.map.getTilesetForTileGid(obj.tile.gid);
@@ -175,32 +213,58 @@ module es {
if (tileset.image.texture.anchorOffsetX != 0) tileset.image.texture.anchorOffsetX = 0;
if (tileset.image.texture.anchorOffsetY != 0) tileset.image.texture.anchorOffsetY = 0;
}
debugRender(obj, pos);
break;
case TmxObjectType.ellipse:
pos = new Vector2(obj.x + obj.width * 0.5, obj.y + obj.height * 0.5).multiply(scale);
if (!obj.shape.parent)
if (!obj.shape.parent){
obj.shape.x = pos.x;
obj.shape.y = pos.y;
container.addChild(obj.shape);
DrawUtils.drawCircle(obj.shape, pos, obj.width * 0.5, objGroup.color);
}
obj.shape.graphics.clear();
obj.shape.graphics.lineStyle(1, 0xa0a0a4);
obj.shape.graphics.beginFill(0x979798, 0.5);
obj.shape.graphics.drawCircle(0, 0, obj.width * 0.5);
obj.shape.graphics.endFill();
debugRender(obj, pos);
break;
case TmxObjectType.polygon:
case TmxObjectType.polyline:
let points = [];
let points: Vector2[] = [];
for (let i = 0; i < obj.points.length; i++)
points[i] = Vector2.multiply(obj.points[i], scale);
DrawUtils.drawPoints(obj.shape, pos, points, objGroup.color, obj.objectType == TmxObjectType.polygon);
if (!obj.shape.parent && points.length > 0){
obj.shape.x = pos.x;
obj.shape.y = pos.y;
container.addChild(obj.shape);
}
obj.shape.graphics.clear();
obj.shape.graphics.lineStyle(1, 0xa0a0a4);
for (let i = 0; i < points.length; i ++){
obj.shape.graphics.lineTo(points[i].x, points[i].y);
}
obj.shape.graphics.endFill();
debugRender(obj, pos);
break;
case TmxObjectType.text:
if (!obj.textField.parent)
if (!obj.textField.parent){
obj.textField.x = pos.x;
obj.textField.y = pos.y;
container.addChild(obj.textField);
DrawUtils.drawString(obj.textField, obj.text.value, pos, obj.text.color, MathHelper.toRadians(obj.rotation),
Vector2.zero, 1);
}
obj.textField.text = obj.text.value;
obj.textField.textColor = obj.text.color;
obj.textField.bold = obj.text.bold != undefined ? obj.text.bold : false;
obj.textField.italic = obj.text.italic != undefined ? obj.text.italic : false;
obj.textField.size = obj.text.pixelSize;
obj.textField.fontFamily = obj.text.fontFamily;
break;
default:
if (Core.debugRenderEndabled) {
if (!obj.textField.parent)
container.addChild(obj.textField);
DrawUtils.drawString(obj.textField, `${obj.name}(${obj.type})`, Vector2.subtract(pos, new Vector2(0, 15)), 0xffffff, 0, Vector2.zero, 1);
}
break;
}
}
@@ -250,12 +314,10 @@ module es {
ty -= (sourceRect.width * scale.x - tileWidth);
} else if (tile.horizontalFlip) {
tx += tileWidth + (sourceRect.height * scale.y - tileHeight);
ty += tileHeight;
} else if (tile.verticalFlip) {
ty += (tileWidth - sourceRect.width * scale.x);
} else {
ty += tileHeight;
// ty += (tileHeight - sourceRect.height * scale.y);
ty += (tileHeight - sourceRect.height * scale.y);
}
let pos = new Vector2(tx, ty).add(position);

67
source/src/Utils/DrawUtils.ts
View File

@@ -1,73 +1,6 @@
module es {
/** 各种辅助方法来辅助绘图 */
export class DrawUtils {
public static drawLine(shape: egret.Shape, start: Vector2, end: Vector2, color: number, thickness: number = 1) {
this.drawLineAngle(shape, start, MathHelper.angleBetweenVectors(start, end), Vector2.distance(start, end), color, thickness);
}
public static drawCircle(shape: egret.Shape, position: Vector2, radius: number, color: number){
shape.graphics.beginFill(color);
shape.graphics.drawCircle(position.x, position.y, radius);
shape.graphics.endFill();
}
public static drawPoints(shape: egret.Shape, position: Vector2, points: Vector2[], color: number,
closePoly: boolean = true, thickness: number = 1){
if (points.length < 2)
return;
for (let i = 1; i < points.length; i ++)
this.drawLine(shape, Vector2.add(position, points[i - 1]), Vector2.add(position, points[i]), color, thickness);
if (closePoly)
this.drawLine(shape, Vector2.add(position, points[points.length - 1]), Vector2.add(position, points[0]), color, thickness);
}
public static drawString(textField: egret.TextField, text: string, position: Vector2, color: number, rotation: number,
origin: Vector2, scale: number){
}
public static drawLineAngle(shape: egret.Shape, start: Vector2, radians: number, length: number, color: number, thickness = 1) {
shape.graphics.beginFill(color);
shape.graphics.drawRect(start.x, start.y, 1, 1);
shape.graphics.endFill();
shape.scaleX = length;
shape.scaleY = thickness;
shape.$anchorOffsetX = 0;
shape.$anchorOffsetY = 0;
shape.rotation = radians;
}
public static drawHollowRect(shape: egret.Shape, rect: Rectangle, color: number, thickness = 1) {
this.drawHollowRectR(shape, rect.x, rect.y, rect.width, rect.height, color, thickness);
}
public static drawHollowRectR(shape: egret.Shape, x: number, y: number, width: number, height: number, color: number, thickness = 1) {
let tl = new Vector2(x, y).round();
let tr = new Vector2(x + width, y).round();
let br = new Vector2(x + width, y + height).round();
let bl = new Vector2(x, y + height).round();
this.drawLine(shape, tl, tr, color, thickness);
this.drawLine(shape, tr, br, color, thickness);
this.drawLine(shape, br, bl, color, thickness);
this.drawLine(shape, bl, tl, color, thickness);
}
public static drawPixel(shape: egret.Shape, position: Vector2, color: number, size: number = 1) {
let destRect = new Rectangle(position.x, position.y, size, size);
if (size != 1) {
destRect.x -= size * 0.5;
destRect.y -= size * 0.5;
}
shape.graphics.beginFill(color);
shape.graphics.drawRect(destRect.x, destRect.y, destRect.width, destRect.height);
shape.graphics.endFill();
}
public static getColorMatrix(color: number): egret.ColorMatrixFilter {
let colorMatrix = [
1, 0, 0, 0, 0,