LowRezJam Day 2 - Adding Tools
August 7, 2023 | Tags: programming gamedev lowrezjam
Welcome back to Day 2 (should I call it day 2 since it’s the second day I’m working on it, or day 7 since it’s the seventh day?) of LowRezJam! I didn’t work on my project very much over the past few days since I was sick. (It was just a cold, nothing too serious. I’m feeling much better now!) However, I did finish most of the drawing tools.
Video Demo #
In the video I show off all of the tools that I’ve added so far: line, circle, fill bucket, and color picker.
The line tool draws a straight line between any two points. You use it by first choosing a start point of the line (with left click), and then choosing an endpoint of the line. It uses Bresenham’s line algorithm to draw the points on the field.
The circle tool draws a circle of a given radius at a given point. Similarly to the line tool, you select the midpoint of the circle first and then specify the radius by choosing a second point at whatever distance you want from the midpoint. It uses Bresenham’s circle algorithm to draw the circle. (Thank you Bresenham!)
The fill tool fills in an area bounded by a different color. Simply select the region you want to fill, and the color you selected will be filled in. We use the flood fill algorithm, which simply recursively searches all adjacent tiles, filling in the ones matching the replace color and skipping all others (though, I’m using a stack instead because I need to avoid recursion).
Finally, there is the color picker tool, which sets the current color to be the color under the mouse cursor.
There is a debug menu (accessible with DPad right) that shows the current mouse position, the current color, and the currently selected tool.
Each of these tools have their processes happen slowly. PICO-8 is of course fast enough to do each of these simple algorithms very quickly (in less than a frame!). However, I think it looks cool to have these happen slower, even if it’s not nessecary, so we can see an animation of the algorithms working. In order to slow down these algorithms, I used PICO-8’s coroutines. Coroutines are kind of like generator function in JavaScript. Coroutines let you pause execution of a function using yield(). We yield after an iteration of each of these algorithms to make the process take longer. However, for flood fill, I think yielding after every iteration makes it too slow. Instead I use a countdown timer to make sure we yield every 5 iterations. (This is why I needed to avoid recursion for the fill algorithm, because recursion would make it too hard to yield.) I’m not sure what the perfect value is for flood fill. For line and circle, I yield every time, but for flood fill, yielding every time is too slow, IMO. I have it set to every five times, but I think that might still be too slow. However, yielding every 10 times makes it faster than I’d like.
What Next #
The next thing I want to work on is the menu for changing colors and tools with the mouse. Right now I have the colors and tools set to cycle on buttons, which can be annoying. Having a better way to switch colors and tools would certainly make this easier to use.