Drawing grid resulting in offset tiles

[lubirb]

Hi there! Love2d newbie here.

I've created a table with a list of tiles, to be drawn out evenly-spaced in a 5x5 grid. First tile drawn at 0, 0.

However, on inspection, I see that the first tile ('A') does get drawn at 0, 0, but then the draw loop "restarts" so 'A' gets re-drawn at 0, 60 (where the 'B' tile would be expected). The remaining tiles get drawn after, resulting in an offset grid.

Screenshot 2024-12-07 at 1.48.41 PM.png (97.92 KiB) Viewed 915 times

Here is my code:

Code: Select all

local TILES_HORIZONTAL = 5
local MAX_TILES = 25
local INITIAL_X = 0
local INITIAL_Y = 0

local tile = {
  x = INITIAL_X,
  y = INITIAL_Y,
  tileFace = nil,
  letterValue = nil,
  width = 46,
  height = 46
}

function tile.create(tile)
  for t = 1, MAX_TILES do
    table.insert(tiles, {
      x = tile.x,
      y = tile.y,
      tileFace = love.graphics.newImage(letters[t][1]),
      letterValue = letters[t][2],
      width = tile.width,
      height = tile.height
    })
  end
end

function tile.drawTiles()
  	local countHorizontal = 0
	-- Adjust the space between the tiles
	local spaceX = 0
	local spaceY = 0

  	love.graphics.setColor(255,255,255,255)
	-- Iterate through all tiles and draw them to the screen
	for i, tile in ipairs(tiles) do
		if countHorizontal < TILES_HORIZONTAL then
      			love.graphics.draw(tile.tileFace, tile.x, tile.y, 0, 0.2, 0.2)
			spaceX = spaceX + 60
			tile.x = spaceX
      			tile.y = spaceY
			countHorizontal = countHorizontal + 1
		else
     			love.graphics.draw(tile.tileFace, tile.x, tile.y, 0, 0.2, 0.2)
      			spaceX = 60
     			tile.x = spaceX
			spaceY = spaceY + 60
      			tile.y = spaceY
      			countHorizontal = 0
		end
	end
end

I'm calling drawTiles() from within love.draw(). I understand that love.draw() gets called once per frame, so I understand the "restart". But why don't the initial x,y values for 'A' also get reset to 0, 0?

I appreciate a second pair of eyes! Been pulling my hair out trying to debug this. Thanks for the help!

[lubirb]

Quick update...

Figured out the indexing issue. Still confused as to why 'A' x,y jumps to 0, 60, but the other rows know to re-start at 0, 0. Thanks again!

Screenshot 2024-12-07 at 3.17.42 PM.png (94.97 KiB) Viewed 888 times

[darkfrei]

Set the cols and rows instead of pixels, set the x and y of tiles by creating, just by multiplying with width+offsetX, height+offsetY.