I’m working on a snake game and I want to draw a pill shaped line to use for the snake. So I want to draw rounded line segments filled with one color (green) and outlined with another color (black). It is not one straight line, but rather several connected line segments. They are all connected at right angles, so 0, 90, 180 or 270 degrees. See mockup below
Someone suggested I use the default HTML lineCap function, however in Phaser graphics object this function is not available. The Phaser graphics object does have the moveTo and lineTo functions to draw lines, but the lineCap function is not available, is that correct?
If I understand correctly the Phaser graphics object is like a subset of the default HTML canvas, but then optimized for games, so optimized for drawing performance and WebGL intergration.
Is there maybe another way to draw such a rounded line in Phaser 3? Like use a different object, but which one? Or maybe draw the outline “by hand” so to speak, although I suspect that would become a pretty complicted algorithm. Also see my question on stackoverflow.