Hello I am creating my first isometric game. I have floor tiles which are 112*56 in size.
This is a simple strategy game I am making, it's an existing game, I just copied the idea for practice since I don't have anything else to do.
Each game object should be located inside the floor tile, like floor tile is the base, it can't be outside of it. All entities will be inside one floor tile, or separated.
When I try to place a rock in tiles[0][1]
, this happens:
(source: gyazo.com)
When I try to place it at tiles[9][9] (corner) this happens (With red borders, so you can see offsets):
(source: gyazo.com)
I am not really sure what creates this big padding when the tiles go further. The further they are, the bigger padding they will have from the tile I think.
I use this formula to locate tiles:
int x = (this.x * width / 2) - (this.y * width / 2);
int y = (this.x * height / 2) + (this.y * height / 2);
x = i
y = j
I've tried making offY variable, where it does imageHeight - floorTileHeight = 18
, and then do int y = offY - (... formula for y ...)
but no luck, the position is always randomised. Works for one position, won't work for further position.
this is the water floor tile (112x56):
this is the rock tile (112x74):
I've added red borders so you can see how big it is.
What is causing this padding between tiles when I place them?
EDIT
I am using Slick2D game library.
EDIT 2
In my program, my graphics are separated into Layers. Each layer implements Layer.
I have the layer Board, which is responsible about everything that happens on the board, the floor, it's entities, and nature objects.
That layer Board, has 2 more sub-layers in it, Nature and Entity.
Currently I am having problems with the Nature layer, which is responsible for drawing nature objects like Rocks, flowers, and more.
public class Nature implements Layer {
private Tile[][] tiles = new Tile[15][10];
public Nature() {
tiles[9][9] = new Tile(9, 9, 0, 0, Tiles.ROCK);
// tiles[0][0] = new Tile(0, -22, Tiles.ROCK);
// tiles[0][1] = new Tile(0, -22, Tiles.ROCK);
}
@Override
public void render(Graphics g) {
for (int i = 0; i < this.tiles[0].length; i++){
for (int j = 0; j < this.tiles[1].length; j++){
Tile tile = this.tiles[i][j];
if (tile == null)
continue;
tile.render(g);
}
}
}
@Override
public void update() {
// TODO Auto-generated method stub
}
}
The actual tile class which does the drawing:
public class Tile {
private int offX;
private int offY;
private int x;
private int y;
public TileSprite sprite;
public Tile(int x, int y, Tiles tile) {
this(x, y, 0, 0, tile);
}
public Tile(int x, int y, int offX, int offY, Tiles tile) {
this.x = x;
this.y = y;
this.offX = offX;
this.offY = offY;
this.sprite = new TileSprite(tile);
}
public int getOffX() {
return this.offX;
}
public int getOffY() {
return this.offY;
}
public TileSprite getSprite() {
return this.sprite;
}
public int getWidth() {
return this.sprite.getSprite().getWidth();
}
public int getHeight() {
return this.sprite.getSprite().getHeight();
}
public void render(Graphics g) {
int width = this.getWidth();
int height = this.getHeight();
int x = (this.x * width / 2) - (this.y * width / 2);
int y = (this.x * height / 2) + (this.y * height / 2);
x -= width / 2;
y -= height;
g.drawImage(this.sprite.getImage(), x, y);
}
}