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

#28 tiled orthogonal支持

Browse Source
This commit is contained in:
YHH
2020-08-15 12:16:23 +08:00
parent 15f6b06348
commit 5dc7a72310
13 changed files with 243 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files
demo/index.html
+1 -1
View File
@@ -31,7 +31,7 @@
data-content-width="640" data-content-width="640"
data-content-height="1136" data-content-height="1136"
data-multi-fingered="2" data-multi-fingered="2"
data-show-fps="false" data-show-log="false" data-show-fps="true" data-show-log="false"
data-show-fps-style="x:0,y:0,size:12,textColor:0xffffff,bgAlpha:0.9"> data-show-fps-style="x:0,y:0,size:12,textColor:0xffffff,bgAlpha:0.9">
</div> </div>
<script> <script>
demo/libs/framework/framework.d.ts
Vendored
+1 -2
View File
@@ -731,6 +731,7 @@ declare module es {
tiledMap: TmxMap; tiledMap: TmxMap;
physicsLayer: number; physicsLayer: number;
layerIndicesToRender: number[]; layerIndicesToRender: number[];
private toContainer;
readonly width: number; readonly width: number;
readonly height: number; readonly height: number;
collisionLayer: TmxLayer; collisionLayer: TmxLayer;
@@ -1604,7 +1605,6 @@ declare module es {
class TmxLayerTile { class TmxLayerTile {
static readonly FLIPPED_HORIZONTALLY_FLAG: number; static readonly FLIPPED_HORIZONTALLY_FLAG: number;
static readonly FLIPPED_VERTICALLY_FLAG: number; static readonly FLIPPED_VERTICALLY_FLAG: number;
static readonly FLIPPED_DIAGONALLY_FLAG: number;
tileset: TmxTileset; tileset: TmxTileset;
gid: number; gid: number;
x: number; x: number;
@@ -1612,7 +1612,6 @@ declare module es {
readonly position: Vector2; readonly position: Vector2;
horizontalFlip: boolean; horizontalFlip: boolean;
verticalFlip: boolean; verticalFlip: boolean;
diagonalFlip: boolean;
_tilesetTileIndex?: number; _tilesetTileIndex?: number;
readonly tilesetTile: TmxTilesetTile; readonly tilesetTile: TmxTilesetTile;
constructor(map: TmxMap, id: number, x: number, y: number); constructor(map: TmxMap, id: number, x: number, y: number);
demo/libs/framework/framework.js
+61 -37
View File
@@ -3295,6 +3295,7 @@ var es;
if (shouldCreateColliders === void 0) { shouldCreateColliders = true; } if (shouldCreateColliders === void 0) { shouldCreateColliders = true; }
var _this = _super.call(this) || this; var _this = _super.call(this) || this;
_this.physicsLayer = 1 << 0; _this.physicsLayer = 1 << 0;
_this.toContainer = false;
_this.tiledMap = tiledMap; _this.tiledMap = tiledMap;
_this._shouldCreateColliders = shouldCreateColliders; _this._shouldCreateColliders = shouldCreateColliders;
_this.displayObject = new egret.DisplayObjectContainer(); _this.displayObject = new egret.DisplayObjectContainer();
@@ -3367,14 +3368,18 @@ var es;
TiledMapRenderer.prototype.render = function (camera) { TiledMapRenderer.prototype.render = function (camera) {
this.sync(camera); this.sync(camera);
if (!this.layerIndicesToRender) { if (!this.layerIndicesToRender) {
es.TiledRendering.renderMap(this.tiledMap, this.displayObject, es.Vector2.add(this.entity.transform.position, this._localOffset), this.transform.scale, this.renderLayer); es.TiledRendering.renderMap(this.tiledMap, !this.toContainer ? this.displayObject : null, es.Vector2.add(this.entity.transform.position, this._localOffset), this.transform.scale, this.renderLayer);
} }
else { else {
for (var i = 0; i < this.tiledMap.layers.length; i++) { for (var i = 0; i < this.tiledMap.layers.length; i++) {
if (this.tiledMap.layers[i].visible && this.layerIndicesToRender.contains(i)) if (this.tiledMap.layers[i].visible && this.layerIndicesToRender.contains(i))
es.TiledRendering.renderLayerRenderCamera(this.tiledMap.layers[i], this.displayObject, es.Vector2.add(this.entity.transform.position, this._localOffset), this.transform.scale, this.renderLayer, camera.bounds); es.TiledRendering.renderLayerRenderCamera(this.tiledMap.layers[i], !this.toContainer ? this.displayObject : null, es.Vector2.add(this.entity.transform.position, this._localOffset), this.transform.scale, this.renderLayer, camera.bounds);
} }
} }
if (!this.toContainer) {
this.displayObject.cacheAsBitmap = true;
this.toContainer = true;
}
}; };
TiledMapRenderer.prototype.addColliders = function () { TiledMapRenderer.prototype.addColliders = function () {
if (!this.collisionLayer || !this._shouldCreateColliders) if (!this.collisionLayer || !this._shouldCreateColliders)
@@ -7582,9 +7587,7 @@ var es;
this.horizontalFlip = flip; this.horizontalFlip = flip;
flip = (rawGid & TmxLayerTile.FLIPPED_VERTICALLY_FLAG) != 0; flip = (rawGid & TmxLayerTile.FLIPPED_VERTICALLY_FLAG) != 0;
this.verticalFlip = flip; this.verticalFlip = flip;
flip = (rawGid & TmxLayerTile.FLIPPED_DIAGONALLY_FLAG) != 0; rawGid &= ~(TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG | TmxLayerTile.FLIPPED_VERTICALLY_FLAG);
this.diagonalFlip = flip;
rawGid &= ~(TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG | TmxLayerTile.FLIPPED_VERTICALLY_FLAG | TmxLayerTile.FLIPPED_DIAGONALLY_FLAG);
this.gid = rawGid; this.gid = rawGid;
this.tileset = map.getTilesetForTileGid(this.gid); this.tileset = map.getTilesetForTileGid(this.gid);
} }
@@ -7615,7 +7618,6 @@ var es;
}); });
TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG = 0x80000000; TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG = 0x80000000;
TmxLayerTile.FLIPPED_VERTICALLY_FLAG = 0x40000000; TmxLayerTile.FLIPPED_VERTICALLY_FLAG = 0x40000000;
TmxLayerTile.FLIPPED_DIAGONALLY_FLAG = 0x20000000;
return TmxLayerTile; return TmxLayerTile;
}()); }());
es.TmxLayerTile = TmxLayerTile; es.TmxLayerTile = TmxLayerTile;
@@ -8096,7 +8098,7 @@ var es;
}; };
TiledMapLoader.loadTmxTileset = function (tileset, map, xTileset, firstGid) { TiledMapLoader.loadTmxTileset = function (tileset, map, xTileset, firstGid) {
return __awaiter(this, void 0, void 0, function () { return __awaiter(this, void 0, void 0, function () {
var xImage, _a, xTerrainType, _i, _b, e, _c, _d, xTile, tile, id, y, column, x; var xImage, _a, _i, _b, e, _c, _d, xTile, tile, id, y, column, x;
return __generator(this, function (_e) { return __generator(this, function (_e) {
switch (_e.label) { switch (_e.label) {
case 0: case 0:
@@ -8118,14 +8120,12 @@ var es;
_a.image = _e.sent(); _a.image = _e.sent();
_e.label = 2; _e.label = 2;
case 2: case 2:
xTerrainType = xTileset["terraintypes"];
if (xTerrainType) {
tileset.terrains = []; tileset.terrains = [];
for (_i = 0, _b = xTerrainType["terrains"]; _i < _b.length; _i++) { if (xTileset["terrains"])
for (_i = 0, _b = xTileset["terrains"]; _i < _b.length; _i++) {
e = _b[_i]; e = _b[_i];
tileset.terrains.push(this.parseTmxTerrain(e)); tileset.terrains.push(this.parseTmxTerrain(e));
} }
}
tileset.tiles = new Map(); tileset.tiles = new Map();
_c = 0, _d = xTileset["tiles"]; _c = 0, _d = xTileset["tiles"];
_e.label = 3; _e.label = 3;
@@ -8135,7 +8135,7 @@ var es;
return [4, this.loadTmxTilesetTile(new es.TmxTilesetTile(), tileset, xTile, tileset.terrains)]; return [4, this.loadTmxTilesetTile(new es.TmxTilesetTile(), tileset, xTile, tileset.terrains)];
case 4: case 4:
tile = _e.sent(); tile = _e.sent();
tileset.tiles[tile.id] = tile; tileset.tiles.set(tile.id, tile);
_e.label = 5; _e.label = 5;
case 5: case 5:
_c++; _c++;
@@ -8166,13 +8166,22 @@ var es;
}; };
TiledMapLoader.loadTmxTilesetTile = function (tile, tileset, xTile, terrains) { TiledMapLoader.loadTmxTilesetTile = function (tile, tileset, xTile, terrains) {
return __awaiter(this, void 0, void 0, function () { return __awaiter(this, void 0, void 0, function () {
var xImage, _a, _i, _b, e, _c, _d, e; var strTerrain, index, _i, strTerrain_1, v, edge, xImage, _a, _b, _c, e, _d, _e, e;
return __generator(this, function (_e) { return __generator(this, function (_f) {
switch (_e.label) { switch (_f.label) {
case 0: case 0:
tile.tileset = tileset; tile.tileset = tileset;
tile.id = xTile["id"]; tile.id = xTile["id"];
tile.terrainEdges = xTile["terrain"]; strTerrain = xTile["terrain"];
if (strTerrain) {
tile.terrainEdges = new Array(4);
index = 0;
for (_i = 0, strTerrain_1 = strTerrain; _i < strTerrain_1.length; _i++) {
v = strTerrain_1[_i];
edge = terrains[v];
tile.terrainEdges[index++] = edge;
}
}
tile.probability = xTile["probability"] != undefined ? xTile["probability"] : 1; tile.probability = xTile["probability"] != undefined ? xTile["probability"] : 1;
tile.type = xTile["type"]; tile.type = xTile["type"];
xImage = xTile["image"]; xImage = xTile["image"];
@@ -8180,19 +8189,19 @@ var es;
_a = tile; _a = tile;
return [4, this.loadTmxImage(new es.TmxImage(), xImage)]; return [4, this.loadTmxImage(new es.TmxImage(), xImage)];
case 1: case 1:
_a.image = _e.sent(); _a.image = _f.sent();
_e.label = 2; _f.label = 2;
case 2: case 2:
tile.objectGroups = []; tile.objectGroups = [];
if (xTile["objectgroup"]) if (xTile["objectgroup"])
for (_i = 0, _b = xTile["objectgroup"]; _i < _b.length; _i++) { for (_b = 0, _c = xTile["objectgroup"]; _b < _c.length; _b++) {
e = _b[_i]; e = _c[_b];
tile.objectGroups.push(this.loadTmxObjectGroup(new es.TmxObjectGroup(), tileset.map, e)); tile.objectGroups.push(this.loadTmxObjectGroup(new es.TmxObjectGroup(), tileset.map, e));
} }
tile.animationFrames = []; tile.animationFrames = [];
if (xTile["animation"]) { if (xTile["animation"]) {
for (_c = 0, _d = xTile["animation"]["frame"]; _c < _d.length; _c++) { for (_d = 0, _e = xTile["animation"]["frame"]; _d < _e.length; _d++) {
e = _d[_c]; e = _e[_d];
tile.animationFrames.push(this.loadTmxAnimationFrame(new es.TmxAnimationFrame(), e)); tile.animationFrames.push(this.loadTmxAnimationFrame(new es.TmxAnimationFrame(), e));
} }
} }
@@ -8555,45 +8564,60 @@ var es;
if (tilesetTile && tilesetTile.animationFrames.length > 0) if (tilesetTile && tilesetTile.animationFrames.length > 0)
gid = tilesetTile.currentAnimationFrameGid; gid = tilesetTile.currentAnimationFrameGid;
var sourceRect = tile.tileset.tileRegions.get(gid); var sourceRect = tile.tileset.tileRegions.get(gid);
var tx = tile.x * tileWidth; var tx = Math.floor(tile.x) * tileWidth;
var ty = tile.y * tileHeight; var ty = Math.floor(tile.y) * tileHeight;
var rotation = 0; var rotation = 0;
if (tile.diagonalFlip) {
if (tile.horizontalFlip && tile.verticalFlip) { if (tile.horizontalFlip && tile.verticalFlip) {
rotation = es.MathHelper.toDegrees(es.MathHelper.PiOver2);
tx += tileHeight + (sourceRect.height * scale.y - tileHeight); tx += tileHeight + (sourceRect.height * scale.y - tileHeight);
ty -= (sourceRect.width * scale.x - tileWidth); ty -= (sourceRect.width * scale.x - tileWidth);
} }
else if (tile.horizontalFlip) { else if (tile.horizontalFlip) {
rotation = es.MathHelper.toDegrees(-es.MathHelper.PiOver2); tx += tileWidth + (sourceRect.height * scale.y - tileHeight);
ty += tileHeight; ty += tileHeight;
} }
else if (tile.verticalFlip) { else if (tile.verticalFlip) {
rotation = es.MathHelper.toDegrees(es.MathHelper.PiOver2);
tx += tileWidth + (sourceRect.height * scale.y - tileHeight);
ty += (tileWidth - sourceRect.width * scale.x); ty += (tileWidth - sourceRect.width * scale.x);
} }
else { else {
rotation = es.MathHelper.toDegrees(-es.MathHelper.PiOver2);
ty += tileHeight; ty += tileHeight;
// ty += (tileHeight - sourceRect.height * scale.y);
} }
}
if (rotation == 0)
ty += (tileHeight - sourceRect.height * scale.y);
var pos = new es.Vector2(tx, ty).add(position); var pos = new es.Vector2(tx, ty).add(position);
if (tile.tileset.image) { if (tile.tileset.image) {
if (!tile.tileset.image.bitmap.getTexture(gid.toString())) { if (container) {
tile.tileset.image.texture = new Bitmap(tile.tileset.image.bitmap.createTexture(gid.toString(), sourceRect.x, sourceRect.y, sourceRect.width, sourceRect.height)); var texture = tile.tileset.image.bitmap.getTexture("" + gid);
container.addChild(tile.tileset.image.texture); if (!texture) {
texture = tile.tileset.image.bitmap.createTexture("" + gid, sourceRect.x, sourceRect.y, sourceRect.width, sourceRect.height);
} }
tile.tileset.image.texture = new Bitmap(texture);
container.addChild(tile.tileset.image.texture);
if (tile.tileset.image.texture.x != pos.x)
tile.tileset.image.texture.x = pos.x; tile.tileset.image.texture.x = pos.x;
if (tile.tileset.image.texture.y != pos.y)
tile.tileset.image.texture.y = pos.y; tile.tileset.image.texture.y = pos.y;
if (tile.verticalFlip && tile.horizontalFlip) {
tile.tileset.image.texture.scaleX = -1;
tile.tileset.image.texture.scaleY = -1;
}
else if (tile.verticalFlip) {
tile.tileset.image.texture.scaleX = scale.x;
tile.tileset.image.texture.scaleY = -1;
}
else if (tile.horizontalFlip) {
tile.tileset.image.texture.scaleX = -1;
tile.tileset.image.texture.scaleY = scale.y;
}
else {
tile.tileset.image.texture.scaleX = scale.x; tile.tileset.image.texture.scaleX = scale.x;
tile.tileset.image.texture.scaleY = scale.y; tile.tileset.image.texture.scaleY = scale.y;
}
if (tile.tileset.image.texture.rotation != rotation)
tile.tileset.image.texture.rotation = rotation; tile.tileset.image.texture.rotation = rotation;
if (tile.tileset.image.texture.anchorOffsetX != 0)
tile.tileset.image.texture.anchorOffsetX = 0; tile.tileset.image.texture.anchorOffsetX = 0;
if (tile.tileset.image.texture.anchorOffsetY != 0)
tile.tileset.image.texture.anchorOffsetY = 0; tile.tileset.image.texture.anchorOffsetY = 0;
tile.tileset.image.texture.filters = [color]; }
} }
else { else {
if (tilesetTile.image.texture) { if (tilesetTile.image.texture) {
demo/libs/framework/framework.min.js
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
demo/src/game/MainScene.ts
+12 -13
View File
@@ -10,12 +10,16 @@ module scene {
} }
public async onStart() { public async onStart() {
let mapData = await es.TiledMapLoader.loadTmxMap(new es.TmxMap(), "orthogonal-outside_json");
let map = this.createEntity("map");
map.addComponent(new es.TiledMapRenderer(mapData));
console.log(mapData);
let sprite = new es.Sprite(RES.getRes("checkbox_select_disabled_png")); let sprite = new es.Sprite(RES.getRes("checkbox_select_disabled_png"));
this.createEntityAsync("bg").then(bg => { this.createEntityAsync("bg").then(bg => {
bg.addComponent(new component.PlayerController()); bg.addComponent(new component.PlayerController());
bg.addComponent(new es.Mover()); bg.addComponent(new es.Mover());
let spriteRenderer = bg.addComponent(new es.ScrollingSpriteRenderer(sprite)); let spriteRenderer = bg.addComponent(new es.ScrollingSpriteRenderer(sprite));
spriteRenderer.setRenderLayer(4);
spriteRenderer.scrollX = -30; spriteRenderer.scrollX = -30;
// bg.addComponent(new es.BoxCollider()); // bg.addComponent(new es.BoxCollider());
@@ -23,18 +27,13 @@ module scene {
}); });
// // bg.addComponent(new es.SpriteRenderer()).setSprite(sprite).setColor(0xff0000); // // bg.addComponent(new es.SpriteRenderer()).setSprite(sprite).setColor(0xff0000);
for (let i = 0; i < 20; i++) { // for (let i = 0; i < 20; i++) {
let sprite = new es.Sprite(RES.getRes("checkbox_select_disabled_png")); // let sprite = new es.Sprite(RES.getRes("checkbox_select_disabled_png"));
let player2 = this.createEntity("bg"); // let player2 = this.createEntity("bg");
player2.addComponent(new es.SpriteRenderer()).setSprite(sprite).setRenderLayer(i); // player2.addComponent(new es.SpriteRenderer()).setSprite(sprite).setRenderLayer(i);
player2.position = new es.Vector2(30 * i, 30 * i); // player2.position = new es.Vector2(30 * i, 30 * i);
// player2.addComponent(new es.BoxCollider()); // // player2.addComponent(new es.BoxCollider());
} // }
let mapData = await es.TiledMapLoader.loadTmxMap(new es.TmxMap(), "orthogonal-outside_json");
let map = this.createEntity("map");
map.addComponent(new es.TiledMapRenderer(mapData));
console.log(mapData);
let pool = new es.ComponentPool<component.SimplePooled>(component.SimplePooled); let pool = new es.ComponentPool<component.SimplePooled>(component.SimplePooled);
demo/template/runtime/native_require.js
+1 -1
View File
@@ -37,7 +37,7 @@ egret_native.egretStart = function () {
contentWidth: 640, contentWidth: 640,
contentHeight: 1136, contentHeight: 1136,
showPaintRect: false, showPaintRect: false,
showFPS: false, showFPS: true,
fpsStyles: "x:0,y:0,size:12,textColor:0xffffff,bgAlpha:0.9", fpsStyles: "x:0,y:0,size:12,textColor:0xffffff,bgAlpha:0.9",
showLog: false, showLog: false,
logFilter: "", logFilter: "",
source/bin/framework.d.ts
Vendored
+1 -2
View File
@@ -731,6 +731,7 @@ declare module es {
tiledMap: TmxMap; tiledMap: TmxMap;
physicsLayer: number; physicsLayer: number;
layerIndicesToRender: number[]; layerIndicesToRender: number[];
private toContainer;
readonly width: number; readonly width: number;
readonly height: number; readonly height: number;
collisionLayer: TmxLayer; collisionLayer: TmxLayer;
@@ -1604,7 +1605,6 @@ declare module es {
class TmxLayerTile { class TmxLayerTile {
static readonly FLIPPED_HORIZONTALLY_FLAG: number; static readonly FLIPPED_HORIZONTALLY_FLAG: number;
static readonly FLIPPED_VERTICALLY_FLAG: number; static readonly FLIPPED_VERTICALLY_FLAG: number;
static readonly FLIPPED_DIAGONALLY_FLAG: number;
tileset: TmxTileset; tileset: TmxTileset;
gid: number; gid: number;
x: number; x: number;
@@ -1612,7 +1612,6 @@ declare module es {
readonly position: Vector2; readonly position: Vector2;
horizontalFlip: boolean; horizontalFlip: boolean;
verticalFlip: boolean; verticalFlip: boolean;
diagonalFlip: boolean;
_tilesetTileIndex?: number; _tilesetTileIndex?: number;
readonly tilesetTile: TmxTilesetTile; readonly tilesetTile: TmxTilesetTile;
constructor(map: TmxMap, id: number, x: number, y: number); constructor(map: TmxMap, id: number, x: number, y: number);
source/bin/framework.js
+60 -37
View File
@@ -3295,6 +3295,7 @@ var es;
if (shouldCreateColliders === void 0) { shouldCreateColliders = true; } if (shouldCreateColliders === void 0) { shouldCreateColliders = true; }
var _this = _super.call(this) || this; var _this = _super.call(this) || this;
_this.physicsLayer = 1 << 0; _this.physicsLayer = 1 << 0;
_this.toContainer = false;
_this.tiledMap = tiledMap; _this.tiledMap = tiledMap;
_this._shouldCreateColliders = shouldCreateColliders; _this._shouldCreateColliders = shouldCreateColliders;
_this.displayObject = new egret.DisplayObjectContainer(); _this.displayObject = new egret.DisplayObjectContainer();
@@ -3367,14 +3368,18 @@ var es;
TiledMapRenderer.prototype.render = function (camera) { TiledMapRenderer.prototype.render = function (camera) {
this.sync(camera); this.sync(camera);
if (!this.layerIndicesToRender) { if (!this.layerIndicesToRender) {
es.TiledRendering.renderMap(this.tiledMap, this.displayObject, es.Vector2.add(this.entity.transform.position, this._localOffset), this.transform.scale, this.renderLayer); es.TiledRendering.renderMap(this.tiledMap, !this.toContainer ? this.displayObject : null, es.Vector2.add(this.entity.transform.position, this._localOffset), this.transform.scale, this.renderLayer);
} }
else { else {
for (var i = 0; i < this.tiledMap.layers.length; i++) { for (var i = 0; i < this.tiledMap.layers.length; i++) {
if (this.tiledMap.layers[i].visible && this.layerIndicesToRender.contains(i)) if (this.tiledMap.layers[i].visible && this.layerIndicesToRender.contains(i))
es.TiledRendering.renderLayerRenderCamera(this.tiledMap.layers[i], this.displayObject, es.Vector2.add(this.entity.transform.position, this._localOffset), this.transform.scale, this.renderLayer, camera.bounds); es.TiledRendering.renderLayerRenderCamera(this.tiledMap.layers[i], !this.toContainer ? this.displayObject : null, es.Vector2.add(this.entity.transform.position, this._localOffset), this.transform.scale, this.renderLayer, camera.bounds);
} }
} }
if (!this.toContainer) {
this.displayObject.cacheAsBitmap = true;
this.toContainer = true;
}
}; };
TiledMapRenderer.prototype.addColliders = function () { TiledMapRenderer.prototype.addColliders = function () {
if (!this.collisionLayer || !this._shouldCreateColliders) if (!this.collisionLayer || !this._shouldCreateColliders)
@@ -7582,9 +7587,7 @@ var es;
this.horizontalFlip = flip; this.horizontalFlip = flip;
flip = (rawGid & TmxLayerTile.FLIPPED_VERTICALLY_FLAG) != 0; flip = (rawGid & TmxLayerTile.FLIPPED_VERTICALLY_FLAG) != 0;
this.verticalFlip = flip; this.verticalFlip = flip;
flip = (rawGid & TmxLayerTile.FLIPPED_DIAGONALLY_FLAG) != 0; rawGid &= ~(TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG | TmxLayerTile.FLIPPED_VERTICALLY_FLAG);
this.diagonalFlip = flip;
rawGid &= ~(TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG | TmxLayerTile.FLIPPED_VERTICALLY_FLAG | TmxLayerTile.FLIPPED_DIAGONALLY_FLAG);
this.gid = rawGid; this.gid = rawGid;
this.tileset = map.getTilesetForTileGid(this.gid); this.tileset = map.getTilesetForTileGid(this.gid);
} }
@@ -7615,7 +7618,6 @@ var es;
}); });
TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG = 0x80000000; TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG = 0x80000000;
TmxLayerTile.FLIPPED_VERTICALLY_FLAG = 0x40000000; TmxLayerTile.FLIPPED_VERTICALLY_FLAG = 0x40000000;
TmxLayerTile.FLIPPED_DIAGONALLY_FLAG = 0x20000000;
return TmxLayerTile; return TmxLayerTile;
}()); }());
es.TmxLayerTile = TmxLayerTile; es.TmxLayerTile = TmxLayerTile;
@@ -8096,7 +8098,7 @@ var es;
}; };
TiledMapLoader.loadTmxTileset = function (tileset, map, xTileset, firstGid) { TiledMapLoader.loadTmxTileset = function (tileset, map, xTileset, firstGid) {
return __awaiter(this, void 0, void 0, function () { return __awaiter(this, void 0, void 0, function () {
var xImage, _a, xTerrainType, _i, _b, e, _c, _d, xTile, tile, id, y, column, x; var xImage, _a, _i, _b, e, _c, _d, xTile, tile, id, y, column, x;
return __generator(this, function (_e) { return __generator(this, function (_e) {
switch (_e.label) { switch (_e.label) {
case 0: case 0:
@@ -8118,14 +8120,12 @@ var es;
_a.image = _e.sent(); _a.image = _e.sent();
_e.label = 2; _e.label = 2;
case 2: case 2:
xTerrainType = xTileset["terraintypes"];
if (xTerrainType) {
tileset.terrains = []; tileset.terrains = [];
for (_i = 0, _b = xTerrainType["terrains"]; _i < _b.length; _i++) { if (xTileset["terrains"])
for (_i = 0, _b = xTileset["terrains"]; _i < _b.length; _i++) {
e = _b[_i]; e = _b[_i];
tileset.terrains.push(this.parseTmxTerrain(e)); tileset.terrains.push(this.parseTmxTerrain(e));
} }
}
tileset.tiles = new Map(); tileset.tiles = new Map();
_c = 0, _d = xTileset["tiles"]; _c = 0, _d = xTileset["tiles"];
_e.label = 3; _e.label = 3;
@@ -8135,7 +8135,7 @@ var es;
return [4, this.loadTmxTilesetTile(new es.TmxTilesetTile(), tileset, xTile, tileset.terrains)]; return [4, this.loadTmxTilesetTile(new es.TmxTilesetTile(), tileset, xTile, tileset.terrains)];
case 4: case 4:
tile = _e.sent(); tile = _e.sent();
tileset.tiles[tile.id] = tile; tileset.tiles.set(tile.id, tile);
_e.label = 5; _e.label = 5;
case 5: case 5:
_c++; _c++;
@@ -8166,13 +8166,22 @@ var es;
}; };
TiledMapLoader.loadTmxTilesetTile = function (tile, tileset, xTile, terrains) { TiledMapLoader.loadTmxTilesetTile = function (tile, tileset, xTile, terrains) {
return __awaiter(this, void 0, void 0, function () { return __awaiter(this, void 0, void 0, function () {
var xImage, _a, _i, _b, e, _c, _d, e; var strTerrain, index, _i, strTerrain_1, v, edge, xImage, _a, _b, _c, e, _d, _e, e;
return __generator(this, function (_e) { return __generator(this, function (_f) {
switch (_e.label) { switch (_f.label) {
case 0: case 0:
tile.tileset = tileset; tile.tileset = tileset;
tile.id = xTile["id"]; tile.id = xTile["id"];
tile.terrainEdges = xTile["terrain"]; strTerrain = xTile["terrain"];
if (strTerrain) {
tile.terrainEdges = new Array(4);
index = 0;
for (_i = 0, strTerrain_1 = strTerrain; _i < strTerrain_1.length; _i++) {
v = strTerrain_1[_i];
edge = terrains[v];
tile.terrainEdges[index++] = edge;
}
}
tile.probability = xTile["probability"] != undefined ? xTile["probability"] : 1; tile.probability = xTile["probability"] != undefined ? xTile["probability"] : 1;
tile.type = xTile["type"]; tile.type = xTile["type"];
xImage = xTile["image"]; xImage = xTile["image"];
@@ -8180,19 +8189,19 @@ var es;
_a = tile; _a = tile;
return [4, this.loadTmxImage(new es.TmxImage(), xImage)]; return [4, this.loadTmxImage(new es.TmxImage(), xImage)];
case 1: case 1:
_a.image = _e.sent(); _a.image = _f.sent();
_e.label = 2; _f.label = 2;
case 2: case 2:
tile.objectGroups = []; tile.objectGroups = [];
if (xTile["objectgroup"]) if (xTile["objectgroup"])
for (_i = 0, _b = xTile["objectgroup"]; _i < _b.length; _i++) { for (_b = 0, _c = xTile["objectgroup"]; _b < _c.length; _b++) {
e = _b[_i]; e = _c[_b];
tile.objectGroups.push(this.loadTmxObjectGroup(new es.TmxObjectGroup(), tileset.map, e)); tile.objectGroups.push(this.loadTmxObjectGroup(new es.TmxObjectGroup(), tileset.map, e));
} }
tile.animationFrames = []; tile.animationFrames = [];
if (xTile["animation"]) { if (xTile["animation"]) {
for (_c = 0, _d = xTile["animation"]["frame"]; _c < _d.length; _c++) { for (_d = 0, _e = xTile["animation"]["frame"]; _d < _e.length; _d++) {
e = _d[_c]; e = _e[_d];
tile.animationFrames.push(this.loadTmxAnimationFrame(new es.TmxAnimationFrame(), e)); tile.animationFrames.push(this.loadTmxAnimationFrame(new es.TmxAnimationFrame(), e));
} }
} }
@@ -8555,45 +8564,59 @@ var es;
if (tilesetTile && tilesetTile.animationFrames.length > 0) if (tilesetTile && tilesetTile.animationFrames.length > 0)
gid = tilesetTile.currentAnimationFrameGid; gid = tilesetTile.currentAnimationFrameGid;
var sourceRect = tile.tileset.tileRegions.get(gid); var sourceRect = tile.tileset.tileRegions.get(gid);
var tx = tile.x * tileWidth; var tx = Math.floor(tile.x) * tileWidth;
var ty = tile.y * tileHeight; var ty = Math.floor(tile.y) * tileHeight;
var rotation = 0; var rotation = 0;
if (tile.diagonalFlip) {
if (tile.horizontalFlip && tile.verticalFlip) { if (tile.horizontalFlip && tile.verticalFlip) {
rotation = es.MathHelper.toDegrees(es.MathHelper.PiOver2);
tx += tileHeight + (sourceRect.height * scale.y - tileHeight); tx += tileHeight + (sourceRect.height * scale.y - tileHeight);
ty -= (sourceRect.width * scale.x - tileWidth); ty -= (sourceRect.width * scale.x - tileWidth);
} }
else if (tile.horizontalFlip) { else if (tile.horizontalFlip) {
rotation = es.MathHelper.toDegrees(-es.MathHelper.PiOver2);
ty += tileHeight; ty += tileHeight;
} }
else if (tile.verticalFlip) { else if (tile.verticalFlip) {
rotation = es.MathHelper.toDegrees(es.MathHelper.PiOver2);
tx += tileWidth + (sourceRect.height * scale.y - tileHeight); tx += tileWidth + (sourceRect.height * scale.y - tileHeight);
ty += (tileWidth - sourceRect.width * scale.x); ty += (tileWidth - sourceRect.width * scale.x);
} }
else { else {
rotation = es.MathHelper.toDegrees(-es.MathHelper.PiOver2);
ty += tileHeight;
}
}
if (rotation == 0)
ty += (tileHeight - sourceRect.height * scale.y); ty += (tileHeight - sourceRect.height * scale.y);
}
var pos = new es.Vector2(tx, ty).add(position); var pos = new es.Vector2(tx, ty).add(position);
if (tile.tileset.image) { if (tile.tileset.image) {
if (!tile.tileset.image.bitmap.getTexture(gid.toString())) { if (container) {
tile.tileset.image.texture = new Bitmap(tile.tileset.image.bitmap.createTexture(gid.toString(), sourceRect.x, sourceRect.y, sourceRect.width, sourceRect.height)); var texture = tile.tileset.image.bitmap.getTexture("" + gid);
container.addChild(tile.tileset.image.texture); if (!texture) {
texture = tile.tileset.image.bitmap.createTexture("" + gid, sourceRect.x, sourceRect.y, sourceRect.width, sourceRect.height);
} }
tile.tileset.image.texture = new Bitmap(texture);
container.addChild(tile.tileset.image.texture);
if (tile.tileset.image.texture.x != pos.x)
tile.tileset.image.texture.x = pos.x; tile.tileset.image.texture.x = pos.x;
if (tile.tileset.image.texture.y != pos.y)
tile.tileset.image.texture.y = pos.y; tile.tileset.image.texture.y = pos.y;
if (tile.verticalFlip && tile.horizontalFlip) {
tile.tileset.image.texture.scaleX = -1;
tile.tileset.image.texture.scaleY = -1;
}
else if (tile.verticalFlip) {
tile.tileset.image.texture.scaleX = scale.x;
tile.tileset.image.texture.scaleY = -1;
}
else if (tile.horizontalFlip) {
tile.tileset.image.texture.scaleX = -1;
tile.tileset.image.texture.scaleY = scale.y;
}
else {
tile.tileset.image.texture.scaleX = scale.x; tile.tileset.image.texture.scaleX = scale.x;
tile.tileset.image.texture.scaleY = scale.y; tile.tileset.image.texture.scaleY = scale.y;
}
if (tile.tileset.image.texture.rotation != rotation)
tile.tileset.image.texture.rotation = rotation; tile.tileset.image.texture.rotation = rotation;
if (tile.tileset.image.texture.anchorOffsetX != 0)
tile.tileset.image.texture.anchorOffsetX = 0; tile.tileset.image.texture.anchorOffsetX = 0;
if (tile.tileset.image.texture.anchorOffsetY != 0)
tile.tileset.image.texture.anchorOffsetY = 0; tile.tileset.image.texture.anchorOffsetY = 0;
tile.tileset.image.texture.filters = [color]; }
} }
else { else {
if (tilesetTile.image.texture) { if (tilesetTile.image.texture) {
source/bin/framework.min.js
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
source/src/ECS/Components/TiledMapRenderer.ts
+8 -2
View File
@@ -6,6 +6,7 @@ module es {
* 如果空，所有层将被渲染 * 如果空，所有层将被渲染
*/ */
public layerIndicesToRender: number[]; public layerIndicesToRender: number[];
private toContainer: boolean = false;
public get width() { public get width() {
return this.tiledMap.width * this.tiledMap.tileWidth; return this.tiledMap.width * this.tiledMap.tileWidth;
@@ -96,15 +97,20 @@ module es {
this.sync(camera); this.sync(camera);
if (!this.layerIndicesToRender) { if (!this.layerIndicesToRender) {
TiledRendering.renderMap(this.tiledMap, this.displayObject as egret.DisplayObjectContainer, Vector2.add(this.entity.transform.position, this._localOffset), TiledRendering.renderMap(this.tiledMap, !this.toContainer ? this.displayObject as egret.DisplayObjectContainer : null, Vector2.add(this.entity.transform.position, this._localOffset),
this.transform.scale, this.renderLayer); this.transform.scale, this.renderLayer);
} else { } else {
for (let i = 0; i < this.tiledMap.layers.length; i++) { for (let i = 0; i < this.tiledMap.layers.length; i++) {
if (this.tiledMap.layers[i].visible && this.layerIndicesToRender.contains(i)) if (this.tiledMap.layers[i].visible && this.layerIndicesToRender.contains(i))
TiledRendering.renderLayerRenderCamera(this.tiledMap.layers[i] as TmxLayer, this.displayObject as egret.DisplayObjectContainer, Vector2.add(this.entity.transform.position, this._localOffset), TiledRendering.renderLayerRenderCamera(this.tiledMap.layers[i] as TmxLayer, !this.toContainer ? this.displayObject as egret.DisplayObjectContainer : null, Vector2.add(this.entity.transform.position, this._localOffset),
this.transform.scale, this.renderLayer, camera.bounds); this.transform.scale, this.renderLayer, camera.bounds);
} }
} }
if (!this.toContainer){
this.displayObject.cacheAsBitmap = true;
this.toContainer = true;
}
} }
public addColliders() { public addColliders() {
source/src/Tiled/Layer.ts
+5 -5
View File
@@ -113,7 +113,7 @@ module es {
export class TmxLayerTile { export class TmxLayerTile {
public static readonly FLIPPED_HORIZONTALLY_FLAG = 0x80000000; public static readonly FLIPPED_HORIZONTALLY_FLAG = 0x80000000;
public static readonly FLIPPED_VERTICALLY_FLAG = 0x40000000; public static readonly FLIPPED_VERTICALLY_FLAG = 0x40000000;
public static readonly FLIPPED_DIAGONALLY_FLAG = 0x20000000; // public static readonly FLIPPED_DIAGONALLY_FLAG = 0x20000000;
public tileset: TmxTileset; public tileset: TmxTileset;
public gid: number; public gid: number;
@@ -124,7 +124,7 @@ module es {
} }
public horizontalFlip: boolean; public horizontalFlip: boolean;
public verticalFlip: boolean; public verticalFlip: boolean;
public diagonalFlip: boolean; // public diagonalFlip: boolean;
public _tilesetTileIndex?: number; public _tilesetTileIndex?: number;
/** /**
@@ -161,11 +161,11 @@ module es {
flip = (rawGid & TmxLayerTile.FLIPPED_VERTICALLY_FLAG) != 0; flip = (rawGid & TmxLayerTile.FLIPPED_VERTICALLY_FLAG) != 0;
this.verticalFlip = flip; this.verticalFlip = flip;
flip = (rawGid & TmxLayerTile.FLIPPED_DIAGONALLY_FLAG) != 0; // flip = (rawGid & TmxLayerTile.FLIPPED_DIAGONALLY_FLAG) != 0;
this.diagonalFlip = flip; // this.diagonalFlip = flip;
// 零位标志 // 零位标志
rawGid &= ~(TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG | TmxLayerTile.FLIPPED_VERTICALLY_FLAG | TmxLayerTile.FLIPPED_DIAGONALLY_FLAG); rawGid &= ~(TmxLayerTile.FLIPPED_HORIZONTALLY_FLAG | TmxLayerTile.FLIPPED_VERTICALLY_FLAG);
// 将GID保存 // 将GID保存
this.gid = rawGid; this.gid = rawGid;
source/src/Tiled/TiledMapLoader.ts
+12 -6
View File
@@ -298,17 +298,15 @@ module es {
if (xImage) if (xImage)
tileset.image = await this.loadTmxImage(new TmxImage(), xTileset); tileset.image = await this.loadTmxImage(new TmxImage(), xTileset);
let xTerrainType = xTileset["terraintypes"];
if (xTerrainType) {
tileset.terrains = []; tileset.terrains = [];
for (let e of xTerrainType["terrains"]) if (xTileset["terrains"])
for (let e of xTileset["terrains"])
tileset.terrains.push(this.parseTmxTerrain(e)); tileset.terrains.push(this.parseTmxTerrain(e));
}
tileset.tiles = new Map<number, TmxTilesetTile>(); tileset.tiles = new Map<number, TmxTilesetTile>();
for (let xTile of xTileset["tiles"]) { for (let xTile of xTileset["tiles"]) {
let tile = await this.loadTmxTilesetTile(new TmxTilesetTile(), tileset, xTile, tileset.terrains); let tile = await this.loadTmxTilesetTile(new TmxTilesetTile(), tileset, xTile, tileset.terrains);
tileset.tiles[tile.id] = tile; tileset.tiles.set(tile.id, tile);
} }
tileset.properties = this.parsePropertyDict(xTileset["properties"]); tileset.properties = this.parsePropertyDict(xTileset["properties"]);
@@ -340,7 +338,15 @@ module es {
tile.tileset = tileset; tile.tileset = tileset;
tile.id = xTile["id"]; tile.id = xTile["id"];
tile.terrainEdges = xTile["terrain"]; let strTerrain = xTile["terrain"];
if (strTerrain){
tile.terrainEdges = new Array(4);
let index = 0;
for (let v of strTerrain){
let edge: TmxTerrain = terrains[v];
tile.terrainEdges[index ++] = edge;
}
}
tile.probability = xTile["probability"] != undefined ? xTile["probability"] : 1; tile.probability = xTile["probability"] != undefined ? xTile["probability"] : 1;
tile.type = xTile["type"]; tile.type = xTile["type"];
let xImage = xTile["image"]; let xImage = xTile["image"];
source/src/Tiled/TiledRendering.ts
+31 -22
View File
@@ -1,6 +1,7 @@
module es { module es {
import Bitmap = egret.Bitmap; import Bitmap = egret.Bitmap;
export class TiledRendering { export class TiledRendering {
public static renderMap(map: TmxMap, container: egret.DisplayObjectContainer, position: Vector2, scale: Vector2, layerDepth: number) { public static renderMap(map: TmxMap, container: egret.DisplayObjectContainer, position: Vector2, scale: Vector2, layerDepth: number) {
map.layers.forEach(layer => { map.layers.forEach(layer => {
@@ -209,47 +210,55 @@ module es {
// 对于y位置，我们需要考虑瓦片是否大于瓦片的高度和移位。 // 对于y位置，我们需要考虑瓦片是否大于瓦片的高度和移位。
// tiled使用左下角的坐标系统，而egret则使用左上角的坐标系统 // tiled使用左下角的坐标系统，而egret则使用左上角的坐标系统
let tx = tile.x * tileWidth; let tx = Math.floor(tile.x) * tileWidth;
let ty = tile.y * tileHeight; let ty = Math.floor(tile.y) * tileHeight;
let rotation = 0; let rotation = 0;
if (tile.diagonalFlip) {
if (tile.horizontalFlip && tile.verticalFlip) { if (tile.horizontalFlip && tile.verticalFlip) {
rotation = MathHelper.toDegrees(MathHelper.PiOver2);
tx += tileHeight + (sourceRect.height * scale.y - tileHeight); tx += tileHeight + (sourceRect.height * scale.y - tileHeight);
ty -= (sourceRect.width * scale.x - tileWidth); ty -= (sourceRect.width * scale.x - tileWidth);
} else if (tile.horizontalFlip) { } else if (tile.horizontalFlip) {
rotation = MathHelper.toDegrees(-MathHelper.PiOver2); tx += tileWidth + (sourceRect.height * scale.y - tileHeight);
ty += tileHeight; ty += tileHeight;
} else if (tile.verticalFlip) { } else if (tile.verticalFlip) {
rotation = MathHelper.toDegrees(MathHelper.PiOver2);
tx += tileWidth + (sourceRect.height * scale.y - tileHeight);
ty += (tileWidth - sourceRect.width * scale.x); ty += (tileWidth - sourceRect.width * scale.x);
} else { } else {
rotation = MathHelper.toDegrees(-MathHelper.PiOver2);
ty += tileHeight; ty += tileHeight;
// ty += (tileHeight - sourceRect.height * scale.y);
} }
}
// 如果我们没有旋转(对角线翻转)移动y轴
if (rotation == 0)
ty += (tileHeight - sourceRect.height * scale.y);
let pos = new Vector2(tx, ty).add(position); let pos = new Vector2(tx, ty).add(position);
if (tile.tileset.image) { if (tile.tileset.image) {
if (!tile.tileset.image.bitmap.getTexture(gid.toString())) { if (container){
tile.tileset.image.texture = new Bitmap(tile.tileset.image.bitmap.createTexture(gid.toString(), sourceRect.x, sourceRect.y, sourceRect.width, sourceRect.height)); let texture: egret.Texture = tile.tileset.image.bitmap.getTexture(`${gid}`);
container.addChild(tile.tileset.image.texture); if (!texture) {
texture = tile.tileset.image.bitmap.createTexture(`${gid}`, sourceRect.x, sourceRect.y, sourceRect.width, sourceRect.height);
} }
tile.tileset.image.texture.x = pos.x;
tile.tileset.image.texture.y = pos.y; tile.tileset.image.texture = new Bitmap(texture);
container.addChild(tile.tileset.image.texture);
if (tile.tileset.image.texture.x != pos.x) tile.tileset.image.texture.x = pos.x;
if (tile.tileset.image.texture.y != pos.y) tile.tileset.image.texture.y = pos.y;
if (tile.verticalFlip && tile.horizontalFlip){
tile.tileset.image.texture.scaleX = -1;
tile.tileset.image.texture.scaleY = -1;
}else if (tile.verticalFlip){
tile.tileset.image.texture.scaleX = scale.x;
tile.tileset.image.texture.scaleY = -1;
}else if(tile.horizontalFlip){
tile.tileset.image.texture.scaleX = -1;
tile.tileset.image.texture.scaleY = scale.y;
}else{
tile.tileset.image.texture.scaleX = scale.x; tile.tileset.image.texture.scaleX = scale.x;
tile.tileset.image.texture.scaleY = scale.y; tile.tileset.image.texture.scaleY = scale.y;
tile.tileset.image.texture.rotation = rotation; }
tile.tileset.image.texture.anchorOffsetX = 0; if (tile.tileset.image.texture.rotation != rotation) tile.tileset.image.texture.rotation = rotation;
tile.tileset.image.texture.anchorOffsetY = 0; if (tile.tileset.image.texture.anchorOffsetX != 0) tile.tileset.image.texture.anchorOffsetX = 0;
tile.tileset.image.texture.filters = [color]; if (tile.tileset.image.texture.anchorOffsetY != 0) tile.tileset.image.texture.anchorOffsetY = 0;
}
// tile.tileset.image.texture.filters = [color];
} else { } else {
if (tilesetTile.image.texture) { if (tilesetTile.image.texture) {
if (!tilesetTile.image.bitmap.getTexture(gid.toString())) { if (!tilesetTile.image.bitmap.getTexture(gid.toString())) {