!!! WIP !!!

5-Tile Dual-Grid Auto-Map for Godot
Addon Tutorial / Dev Log

  A Better Way

      Welcome! If you've ever used a TileMap in Godot, you may have gone on a similar journey to mine -- wanting to explore the built-in options for auto-tiling, looking into the Terrain system, realizing that you're expected to draw over 40 individual tiles for a fully functional set... and just going back to picking edge pieces manually, annoyed and defeated.

      If you're my doppelganger, you may have later run into this great video: Draw fewer tiles - by using a Dual-Grid system! from jess::codes, which goes through this problem/solution in depth and shares their 15-tile Godot implementation in C#.

      However... while watching the video, I couldn't help but notice that many of their 15 tiles were, functionally, a rotation of another tile's sprite. If our goal is to minimize tedium for artists with clever engineering, why aren't we using one tile for each connection type, then rotating them in code? We could take the minimum from 15 to just 5! We could free up more art time for tile variants, and fill them in randomly since we have full control over the tiling process!

  Rotate at Runtime

      It's easy to rotate tiles in the editor, so surely it should be easy in code, right? Well, it's a bit more esoteric -- we need to feed a binary byte into the oddy-named alt_id parameter in TileMapLayer.set_cell(). Fortunately, there's another great video: How To Rotate Tiles with Code in Godot from Coding With Russ, which helped me internalize this stuff. Here's what you'll need to know:

      We rotate tiles using 3 transform operations -- Flip Horizontal, Flip Vertical, and - the oddball - Transpose, which you can think of as a diagonal flip along an axis drawn from top-left to bottom-right.

      Taking from Russ's work, we'll be abbreviating the transforms to T, FH, FV. Transpose is applied before flips, so it's at the beginning of the list. Here's a visual of their effects when applied alone:

      We'll be encoding the byte using constants - e.g. TileSetAtlasSource.TRANSFORM_FLIP_H - and the | operator, which combines multiple "bit-flags" into our binary byte. Copying from Russ, I assigned these values to abbreviated constants in the AutoMapLayer class, to save a crazy amount of typing.

      For reference: here's how you would build bitflag bytes to rotate this stick figure to all 4 possible angles. I'll show the image at each step of transformation.

      Let's do that again, but flipping the stick figure to face counter-clockwise.

  Data structuring

      Now, we just need to assign these bytes to each tile. The solution from Jess used a dictionary to return int tile atlas coordinates based on "neighbor" sets. Since a byte is just an int manipulated at a lower level, we can use an Array[int] containing all 3 values.

      However, a data structure commited to memory wouldn't make sense here, since we're trying to randomize the output at runtime. Instead, I chose to use a match statement in AutoMapLayer.get_tile(), which you'll be overwriting later.

This is a paragraph! Here's how you make a link: Neocities.

Here's how you can make bold and italic text.

Here's how you can add an image:

Here's how to make a list: