I have an app the is a tile game. Tiles are placed in layers (1 to 5) as well as rows and columns… giving it a 3D effect. The problem is tiles can be placed on 50% boundarys… like this
Before the board is displayed the tiles are sorted (note the number on each one).
They are sorted first by their column (left to right), then by row (top to bottom)
The idea being that when they are drawn in the proper order, the edges are obscured by the tile to the right and/or below (like the 2nd set in the example)
Obviously there needs to be another/better way to order the tiles before drawing them
I think the first set really should be ordered 0,3,6,2,5,4
but the fact that those rows start offset is the problem
Any ideas?
note : this example is ONE layer only… but each layer would have the same sort rules “within” the layer
if you sort by top, then left
and then draw those with the lowest top (0,3,6), next larger (2,5), then largest (4)
then 2,5 will overlay 0,3,6
and 4 will overlay 2,5
I have code to do this in one sorting pass
basically construct an int64 out of top left then sort those int 64’s
assuming your list of tilesis in an array named tiles
dim mb as new memoryblock(8)
dim sortvalues() as int64
for i as integer = 0 to tiles.ubound
mb.Int32Value(0) = tiles.top
mb.int32Value(4) = tiles.left
sortvalues.append mb.Int64Value(0)
next
sortvalues.sortwith tiles
So each tile has 3 values, LAYER, XPOS and YPOS
Currenlty sorted by LAYER, YPOS, XPOS
which is exactly what Norman proposed… my code is more brute force, a bubble sort, but speed isn’t an issue… and not XPOS and YPOS are DOUBLE (1.0, 1.5, 2.0, 2.5 etc)
var swap : Bool
if currentLayout.tiles.count>2 {
for i in (0...currentLayout.tiles.count-2) {
for j in (i+1...currentLayout.tiles.count-1) {
swap = false
let ci = currentLayout.tiles[i]
let cj = currentLayout.tiles[j]
if cj.layer<ci.layer { swap = true }
if swap==false && ci.layer==cj.layer && ceil(ci.Xpos)>ceil(cj.Xpos) {swap=true }
if swap==false && ci.layer==cj.layer && ci.Xpos==cj.Xpos && ceil(ci.Ypos)>ceil(cj.Ypos) {swap=true }
if swap {
(currentLayout.tiles[i],currentLayout.tiles[j])=(currentLayout.tiles[j],currentLayout.tiles[i])
}
}
}
Looking at your image, I would say that is not correct.
You should first draw the top row (so 0,3,6,7,9,15) then the next one (2,5,8,10,16), etc. That would result in the correct image, and that would actually be what you would get if you sorted by layer, ypos, xpos, but you seem to be sorting by layer, xpos, ypos right now.
Why do you need to order them before drawing them? Unless there’s a stupid number of them then most current hardware will brute force a back to front, left to right, top to bottom just on xyz checks alone? It’ll only by X x Y x Z iterations to get all tiles shown.
there is a max of 144 at a time… they all draw on the same z-plane…
and it isn’t worth the effort to tie anything to a GPU… rather defeats x-plat … since this is going to be on macOS, iOS and tvOS by the time I am done…