Howdy
I’m planning out a new project and i’ve been experimenting with several ways of getting the structure of a game in place but I need some assistance! I’m doing this within storyboard but i’ve only printed the relevant section of code.
So I’ve created a 2D array of tiles. Each tile is initially represented by bluetile.png. When this tile is tapped by the user I want it to change colour. I envisioned doing this by changing the image to redtile.png. There will be several colours in the game and I need a structure to record the current colour of the tile so it knows what colour to change to next, ie red change to blue then to green then yellow etc.
I iterate through the array and add event listeners along the way, seems like the most effective way of coding this?
Heres the tile code:
[lua] function createTiles()
tileColour = {
{1,1,1,1},
{1,1,1,1},
{1,1,1,1},
{1,1,1,1},
}
tileTable = {}
posX = 20
posY = 20
for y = 1, 4 do
tileTable[y] = {}
for x = 1, 4 do
tileType = tileColour[y][x]
if tileType == 1 then
tileTable[y][x] = display.newImageRect(“images/tileBlue.png”, 40, 40)
tileTable[y][x].x = posX
tileTable[y][x].y = posY
tileTable[y][x].type = 1
tileTable[y][x]:addEventListener(“touch”, onTouch)
group:insert(tileTable[y][x])
elseif tileType == 2 then
tileTable[y][x] = display.newImageRect(“images/tileRed.png”, 40, 40)
tileTable[y][x].x = posX
tileTable[y][x].y = posY
tileTable[y][x]:addEventListener(“touch”, onTouch)
elseif tileType == 3 then
tileTable[y][x] = display.newImageRect(“images/tileGreen.png”, 40, 40)
tileTable[y][x].x = posX
tileTable[y][x].y = posY
tileTable[y][x]:addEventListener(“touch”, onTouch)
end
posX = posX + 40
posY = posY
end
posX = 20
posY = posY + 40
end
end
createTiles()
[/lua]
So thats simple enough. However I’m struggling to work out the best way to work the touch functions to change the colour and store the colour back into the array of tiles. This code simply changes them to the next colour in line however it only does it once :
[lua]
function onTouch(event)
changeTile = event.target
if changeTile.type == 1 then
changeTile = display.newImageRect(“images/tileRed.png”, 40, 40)
changeTile.type = 2
changeTile.x = event.target.x
changeTile.y = event.target.y
event.target:removeSelf()
elseif changeTile.type == 2 then
changeTile = display.newImageRect(“images/tileGreen.png”, 40, 40)
changeTile.type = 3
changeTile.x = event.target.x
changeTile.y = event.target.y
event.target:removeSelf()
elseif changeTile.type == 3 then
changeTile = display.newImageRect(“images/blue.png”, 40, 40)
changeTile.type = 1
changeTile.x = event.target.x
changeTile.y = event.target.y
event.target:removeSelf()
end
end
[/lua]
It suddenly becomes much more complex when you factor in 2 other colours and finding a way of storing the current colour of each tile in the array. I don’t really know how to put changeTile back into the array with its updated colour.
In summary: What I think I need to be able to do is to detect the location of the tile within the tileTable[y][x] from the tap event, pull it out as an object, change its image file to another tile dependent on what its type was previously and then slot it back into the array in the same place having moved its .type onto a new colour. Hope that make sense?!
I also need to have a structure in place to be able to alter the tile colours randomly. I’ve searched the forums and the tutorials but I’m struggling to find answers. Can anyone point me in the right direction? Advanced advice on data structures, objects and touch events needed!
Thanks for reading this far!
Iain