Drawing an empty circle in BGL

(duendecat) #1


I’m trying to figure out a way to draw an empty circle (i.e. the appearance of a curved line following a circumference) using bgl in the game engine. I’ve made a few attempts and have trawled google with no success so far, and so I was wondering if anyone knows of a method of doing this that doesn’t require any external modules like tkinter.

The purpose of this is to create a circular health bar. I’ve made similar UI elements before using 3D objects and scene overlay, but I prefer the reliability of using bgl and being able to place GUI elements precisely with relation to screen size / edges.

If anybody can give me any pointers or advice on this I’d be massively grateful. Thanks!

(BluePrintRandom) #2

yeah, don’t use any of that…

tutorial incoming.

(Cotaks) #3

look at this wonderful custom healthbar resource by sdfgeoff:


prefer the reliability of using bgl and being able to place GUI elements precisely with relation to screen size / edges

Ah ok, this is not using bgl

(BluePrintRandom) #4


ring_fill.blend (606 KB)

(dtrip) #5

I think I got it =

Make the health bar in sections that rotate into each other and then disappear.

The first one is 180 degrees and rotates for the first half of damage.
The next is 90 degrees and rotates for the next 25% of damage.
Next 45 degrees
Next 22.5 degrees
Next 11.25
Next 5.66
Next 2.83

Now the last one is small enough (2.83 degrees out of 360) , so that the rotation can be ignored
If you want more detail you need to write a number anyway. So just do not rotate the last bit, no big deal.

When you get a health power up, you need to re-spawn the appropriate parts and rotate them to place.

Included is a demo with hard-coded logic animation, to demonstrate how it works. It does not fill the health bar
back. Just press P to play it. Then press Z and play it again with wireframe, or select and rotate the parts or change
them color, to see what is really happening.

Good luck!

PS: Sorry I did not see the previous response in time. It seems a better solution than mine. Perhaps do that instead :slight_smile:


healthBarDemo.blend.zip (78.6 KB)

(duendecat) #6

Wow, thanks for the quick (and in depth) response guys. The wrectified example looks the most like what I’m looking for, and is probably a better solution to the bgl method. A good starting point.

For the sake of anyone reading this post in the future who is trying to figure out what I was originally looking for, this is where I’d gotten up to:

draw_circle_2d(50, (1.0, 1.0, 1.0, 0.8), width/2, height/2)

def draw_circle_2d(self, percentage, color, cx, cy):

	end_point = int((percentage * 360) / 100)

	theta = 2 * 3.1415926 / 360
	c = math.cos(theta)
	s = math.sin(theta)
	x = 0
	y = 90

	bgl.glHint( bgl.GL_POINT_SMOOTH_HINT, bgl.GL_NICEST );
	bgl.glBlendFunc(bgl.GL_SRC_ALPHA, bgl.GL_ONE_MINUS_SRC_ALPHA);


	for i in range (end_point):
		bgl.glVertex2f(x + cx, y + cy)

		t = x
		x = c * x - s * y
		y = s * t + c * y

This works (now) and is based on the code in this post:

(smithian) #7

Try this. It’s just set up for top view rather than from the camera. Either the Timst3r or Blender Guru came up with it.


healthy-circle.blend (552 KB)