Stamina Circle GML Script

This block of code will programmatically draw a circle, and given current and max values for the meter, will animate based on that value. I based this off of the Breath of the Wild style stamina meter. Pretty straightforward and can look great with some simple styling.

var points = stam_max; //Total number of points on the circle to calculate. Used max stamina value in this case.
var centerX = window_get_width() - 32; //X coordinate for the center of the circle
var centerY = 32; //Y coordinate for the center of the circle
var radius = 16; //Radius of the circle
var slice = 2 * pi / points; //Calculates distance between points on the circle

for(var i = 0; i < points; i++){ //loops through each point
    var angle = slice * i; //calculates angle based on slice size
    var newX = centerX + radius * cos(angle); //calculates new X coordinate of point on circle
    var newY = centerY + radius * sin(angle); //calculates new Y coordinate of point on circle
    if(i <= stam){ //draw only the parts of the circle that are equal to or below our remaining stamina
        var hue = stam/stam_max * 80; //turns the stamina/max_stamina ratio into a percentage based on 0 (red) to 80 (green)
        draw_set_color(make_color_hsv(hue, 255, 255)); //set the draw color to the calculated hue
        draw_circle(newX, newY,3,false); //draw a 3px radius circle at the calculated point

The result looks like this, with a little setup:


Leave a Reply

Your email address will not be published. Required fields are marked *