mirror of
https://github.com/photonstorm/phaser
synced 2024-11-27 07:01:20 +00:00
Added tile border support to dynamic tilemap
This commit is contained in:
parent
bd363553ba
commit
b61635b51b
6 changed files with 28 additions and 20 deletions
|
@ -1,4 +1,4 @@
|
|||
var CHECKSUM = {
|
||||
build: '18c0acb0-5b49-11e7-8d14-217ddc0d000b'
|
||||
build: '3742be10-5b7d-11e7-8005-ef6dcee762ca'
|
||||
};
|
||||
module.exports = CHECKSUM;
|
|
@ -15,8 +15,9 @@ var BuildFromConfig = function (state, config)
|
|||
var tileHeight = GetValue(config, 'tile.height', 16);
|
||||
var tileTexture = GetValue(config, 'tile.texture', null);
|
||||
var tileFrame = GetValue(config, 'tile.frame', null);
|
||||
var tileBorder = GetValue(config, 'tile.border', 0);
|
||||
|
||||
var map = new Tilemap(state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileTexture, tileFrame);
|
||||
var map = new Tilemap(state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileBorder, tileTexture, tileFrame);
|
||||
|
||||
BuildGameObject(state, map, config);
|
||||
|
||||
|
|
|
@ -15,6 +15,7 @@ function Tile(properties)
|
|||
this.visible = true;
|
||||
this.textureWidth = properties.textureWidth;
|
||||
this.textureHeight = properties.textureHeight;
|
||||
this.border = properties.border;
|
||||
}
|
||||
|
||||
Tile.prototype.setId = function (id)
|
||||
|
@ -23,10 +24,12 @@ Tile.prototype.setId = function (id)
|
|||
var tileWidth = this.width;
|
||||
var tileHeight = this.height;
|
||||
var setWidth = this.textureWidth / tileWidth;
|
||||
var halfTileWidth = (tileWidth) * 0.5;
|
||||
var halfTileHeight = (tileHeight) * 0.5;
|
||||
var rectx = (((tileId % setWidth)|0) * tileWidth) + halfTileWidth;
|
||||
var recty = (((tileId / setWidth)|0) * tileHeight) + halfTileHeight;
|
||||
var tileWidthBorder = (tileWidth + this.border * 2);
|
||||
var tileHeightBorder = (tileHeight + this.border * 2);
|
||||
var halfTileWidth = tileWidthBorder * 0.5;
|
||||
var halfTileHeight = tileHeightBorder * 0.5;
|
||||
var rectx = (((tileId % setWidth)|0) * tileWidthBorder) + halfTileWidth;
|
||||
var recty = (((tileId / setWidth)|0) * tileHeightBorder) + halfTileHeight;
|
||||
|
||||
this.frameX = rectx;
|
||||
this.frameY = recty;
|
||||
|
|
|
@ -27,7 +27,7 @@ var Tilemap = new Class({
|
|||
|
||||
initialize:
|
||||
|
||||
function Tilemap (state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, texture, frame)
|
||||
function Tilemap (state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileBorder, texture, frame)
|
||||
{
|
||||
GameObject.call(this, state, 'Tilemap');
|
||||
|
||||
|
@ -38,6 +38,7 @@ var Tilemap = new Class({
|
|||
this.mapHeight = mapHeight;
|
||||
this.tileArray = [];
|
||||
this.culledTiles = [];
|
||||
this.tileBorder = tileBorder;
|
||||
this.setTexture(texture, frame);
|
||||
this.setPosition(x, y);
|
||||
this.setSizeToFrame();
|
||||
|
@ -60,9 +61,11 @@ var Tilemap = new Class({
|
|||
{
|
||||
var tileArray = this.tileArray;
|
||||
var mapData = this.mapData;
|
||||
// var frame = this.frame;
|
||||
var border = this.tileBorder;
|
||||
var tileWidth = this.tileWidth;
|
||||
var tileHeight = this.tileHeight;
|
||||
var tileWidthBorder = tileWidth + border * 2;
|
||||
var tileHeightBorder = tileHeight + border * 2;
|
||||
var width = this.texture.source[0].width;
|
||||
var height = this.texture.source[0].height;
|
||||
var mapWidth = this.mapWidth;
|
||||
|
@ -76,13 +79,13 @@ var Tilemap = new Class({
|
|||
for (var x = 0; x < mapWidth; ++x)
|
||||
{
|
||||
var tileId = mapData[y * mapWidth + x];
|
||||
var halfTileWidth = (tileWidth) * 0.5;
|
||||
var halfTileHeight = (tileHeight) * 0.5;
|
||||
var rectx = (((tileId % setWidth)|0) * tileWidth) + halfTileWidth;
|
||||
var recty = (((tileId / setWidth)|0) * tileHeight) + halfTileHeight;
|
||||
var halfTileWidth = (tileWidthBorder) * 0.5;
|
||||
var halfTileHeight = (tileHeightBorder) * 0.5;
|
||||
var rectx = (((tileId % setWidth)|0) * tileWidthBorder) + halfTileWidth;
|
||||
var recty = (((tileId / setWidth)|0) * tileHeightBorder) + halfTileHeight;
|
||||
var tx = x * tileWidth;
|
||||
var ty = y * tileHeight;
|
||||
|
||||
|
||||
tileArray.push(new Tile({
|
||||
index: x + y,
|
||||
id: tileId,
|
||||
|
@ -95,7 +98,8 @@ var Tilemap = new Class({
|
|||
frameWidth: tileWidth,
|
||||
frameHeight: tileHeight,
|
||||
textureWidth: width,
|
||||
textureHeight: height
|
||||
textureHeight: height,
|
||||
border: border
|
||||
}));
|
||||
}
|
||||
}
|
||||
|
|
|
@ -7,9 +7,9 @@ var TilemapFactory = {
|
|||
|
||||
KEY: 'tilemap',
|
||||
|
||||
add: function (mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, texture, frame)
|
||||
add: function (mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileBorder, texture, frame)
|
||||
{
|
||||
return this.children.add(new Tilemap(this.state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, texture, frame));
|
||||
return this.children.add(new Tilemap(this.state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileBorder, texture, frame));
|
||||
},
|
||||
|
||||
make: function (config)
|
||||
|
|
|
@ -374,10 +374,10 @@ SpriteBatch.prototype = {
|
|||
var sra, srb, src, srd, sre, srf, cma, cmb, cmc, cmd, cme, cmf;
|
||||
var halfTileWidth = (width) * 0.5;
|
||||
var halfTileHeight = (height) * 0.5;
|
||||
var u0 = (rectX - (halfTileWidth - 0.5)) / textureWidth;
|
||||
var v0 = (rectY - (halfTileHeight - 0.5)) / textureHeight;
|
||||
var u1 = (rectX + (halfTileWidth - 0.5)) / textureWidth;
|
||||
var v1 = (rectY + (halfTileHeight - 0.5)) / textureHeight;
|
||||
var u0 = (rectX - halfTileWidth) / textureWidth;
|
||||
var v0 = (rectY - halfTileHeight) / textureHeight;
|
||||
var u1 = (rectX + halfTileWidth) / textureWidth;
|
||||
var v1 = (rectY + halfTileHeight) / textureHeight;
|
||||
var scrollX = camera.scrollX * scrollFactorX;
|
||||
var scrollY = camera.scrollY * scrollFactorY;
|
||||
|
||||
|
|
Loading…
Reference in a new issue