Hi folks. I’m evaluating Tiled for a game I’m working on. One of the things my game needs is to be able to associate tiles together for Y sorting, as my game is top-down. When a sprite is higher on the screen than another sprite, it should be sorted behind it. When a sprite is lower on the screen than another sprite, it should be sorted in front of it.
A problem occurs when this approach is taken with tiles. When the player character’s Y position is compared against the Y position of a wall, it should compare against the entire wall, not against all the individual tiles that make up the wall. If the player is compared against each tile in the wall, he may end up being sorted between the wall’s tiles.
What I need is some way to create an object that associates multiple tiles. I was wondering if this could be achieved by creating a tile object that holds multiple tiles, like a saved stamp. I could design my wall out of multiple tiles in a tilesheet, then create one tile object that encapsulates that stamp design. Is something like this possible in Tiled?
Alas, Tile Objects can only contain one tile. The Tile Stamp tool just places regular tiles, so while it can do the cosmetic part of what you need, it can’t automatically associate data with them. To do what you need in Tiled, you’d need to create a second tileset that’s an Image Set and has your wall sections already built in it (if your main tileset is structured appropriately, you could even reuse the same image), and use Tile Objects with that, with each “tile” being an entire wall section.
An alternative approach could be an Automap rule that detects wall segments and creates Objects with the relevant properties, but then you’d need to modify your importer or game code to treat tiles connected with these objects as something special rather than just regular tiles.
Hmm, regardless of whether Tiled could support this feature, which indeed it currently doesn’t, I heavily doubt this problem will actually occur. Did you already run into it or is it just a theory that it might happen?
If you’re placing your wall parts as tile objects and they all have the same Y position, then the only way it could happen that some are in front and some are behind the player is if the player also has the exact same Y position. In this case, the drawing order isn’t well defined. Normally, the player can’t walk into the wall, so the situation that it shares its Y position with the wall while also touching it is usually avoided.
Alternatively, you could place your wall on a tile layer rather than an object layer. If the wall is made up of parts this usually works quite well. In Tiled, tiles can extend beyond the tile grid so even higher walls can be done this way. And in this case, you only need to compare the Y position of the entire row of tiles against the player’s position, in order to know what to draw first.
It is happening in my project. In my code, all sprites are dynamically sorted based on their Y position. If my character is lower on the screen than a tile, they are rendered on top of it. If they are higher on the screen than a tile, they are rendered behind it. Problems happen if the player’s sprite is bigger than their collision volume, allowing parts of their texture to overlap with tiles in the tilemap even if the collision prevents them from entering that space. We end up with weird edge cases, where a player is beside a wall, and their Y position is between two of the tiles that make up the wall. If this happens, and the player’s sprite is overlapping with them, the lower tile can actually be drawn on top of the player sprite, breaking the illusion that the wall is one big object and not multiple tiles.
The reason I wanted a way to associate tiles is so that my engine can group the tiles into one bigger object and Y-sort with that object instead of its individual tiles, which would prevent this issue.
If I’ve not explained this well enough, I can grab some screenshots later and draw a wee diagram. It’s much easier to explain visually.
Your suggestion of using the tile layer to define individual objects is interesting, though it would result in an explosion in the number of layers being used. That might work for what I need, I will have to give that a try.
A screenshot may certainly help, but I think I know what you mean.
Another thought I had what could be a solution for you, is when you have another aspect to sort sprites on. For example, to sort all “static objects” before or after “player sprites” when their Y positions are the same.
For anyone googling this exact problem, who finds this post specifically and is unsatisfied with the conclusion, the present workaround in early 2024 is you need to create tilesets of different heights, all of which can be used on the same map.
Again, this assumes you have a similar problem to OP: You want to place tiles or objects that are ‘multi-tile’ and have them sort to the lowest tile’s y value. Why? Usually to place trees, walls, and other obstacles your player will be able to walk both in front of, and behind.
Let’s take an example: You are working with 48x48 tiles, and you want to place tiles or objects that are 3 tiles tall. Take all your graphics that are three tiles tall and and which need to be z-sorted according to y coordinate, and put them inside their own tileset. Then, when importing your tileset, indicate that the tiles are 114px tall and 48 px wide. Tada: You can now paint your map with these 3-tile tall objects as if they were one tile, and they will obey your requisite sorting laws.
(Another method is using image collections, but that’s a lot of work if you now need to save out 60 different pillars and trees into individual files; but I’m making a note of it in case it suits your specific project)
Thank you for the “as of 2024” update - I arrived here from google.
Two questions - you say “114”, I assume you meant 144? Just want to be sure I’m not missing some important subtle thing.
I’m working with an Isometric map. I’ve been playing with a new tileset and setting up offsets but can’t seem to get it to work. I’ve been playing with offsets, but no matter where I set the tile it gets the sorting wrong on a different side. Is there an isometric-friendly version of the “2024” solution?
As it turns out, we’re in the midst of switching to a top-down perspective so the isometric issues aren’t relevant any longer, but we’re struggling with a related problem.
We are putting our on-the-grid game objects in separate tilesets from the map. These tilesets are set to have Tile Render Size at Tile Size and then the game object sprites themselves are scaled to have the correct number of pixels so they’re sized correctly.
These game objects get placed in a separate layer.
However, when the tiles are placed on the map, their origin ins the bottom-left of the tile and we want it to be the top-left. See attached image which shows the tile rendering off the map rather than on the top-right corner.
We cannot use the Horizontal/Vertical offset of the laywer because our game object tiles might be of different sizes.
The tile alignment in Tile Layers cannot be changed except through offsetting. Since per-tile offsets aren’t available yet, the only option is the per-tileset offset, which would only work if your tiles have some padding in the art that would allow all of them to work with the same offset, or are the same size.
Another option is to use an Object Layer instead. Tile Objects will use the Tileset’s Object Alignment property (which you can set to Top Left). You can use snapping to place the objects on the grid.
(In the future, please create a new thread instead of posting about an unrelated issue in an existing thread!)
