Recently, I made a Model which could be useful to most games. Yep, you read the Topic, it’s a Circular Progress. Simple and fast, so I decided to share it.
I made all necessary things for Circular Progress, such as:
Allow to change Color and Transparency of each part.
Can be used with any Decal.
Can change Circular Progress direction.
To make Circular Progress work, you only need to change percentage between 0 and 100. You can also use tween on percentage. If it is greater than 100 (less than 0), it will stays at 100 (0). So it doesn’t affect Circular Progress.
Those things is placed inside LocalScript, but LocalScript is placed inside Percentage value (Progress > Percentage > {LocalScript} > {All options}).
When I first did this (way back when), it was a technical challenge and there were next to no guides on how to do it. Today, thanks to you and a few others, resources are rapidly being made available.
Thanks! I just saw this but Ill be using this for the game I am working on. Also this can be used for a game if say you want to equip something OR a first person shooter if you want to steady the weapon.
This is really going to be useful, right now I’m currently in the process of making a alternative health bar based on this (I even went as far as using the health color change function used in the old top bar health GUI, so it’ll change color depending on how much damage you took).
It’s not really ready to be shown yet, I need to iron out some bugs, notably because I had to do some mathematic black magic to get a percentage of your current health (so you can set your character’s max health).
For reference (or those trying to achieve the same thing) here’s the formula I had to use:
local Humanoid = path.to.your.characters.humanoid -- Obviously, replace this with the actual path to your character and its Humanoid, I like to use ":FindFirstChildOfClass("Humanoid")" in these instances, so you don't have to deal with the humanoid object's name.
Humanoid.Health / Humanoid.MaxHealth * 100
Also had to run it through math.ceil() else the script would act a bit odd.
EDIT: Attached it here, but beware, my code is a veeeeeerrrrrryyyyy rough draft, I have designed it so it can be removed from it without any problems. RoundHealthBar.rbxm (11.3 KB)
Edit: not to be pedantic, but I noticed when the bar is at 0, there’s two faint lines on the top and bottom, it’s not really a deal-breaker but it’s a small detail that I noticed.
Dang it. I just managed to do the same thing using ViewportFrames containing invisible blocks adorned with half-circles. I didn’t think about using rotated gradients!
It’s been so long now without any new features. At this time, I feel I can add it to Circular Progress now;
What’s new?
Starter Point is only on Top, which is boring. So I decided to allow to change Starter Point where Progress should go.
There are only 2 direction for Progress to go. I added a “Middle” direction; both side will run at same time while keeping Percentage right.
What changed?
In the previous Circular Progress, a script still run without changing Percentage. That caused really bad performance. In this Update, the script will now only run when Percentage is changed or Property of Value in the script is changed.
Flip Progress Value now changed to String Value and named “Direction”.
Circular Progress.rbxm (7.5 KB)
If you want to ask something or have a feedback, don’t forget to reply. That really help me.
Thanks for testing, and stay safe.
Image doesn't appear while editing.
For some players who asking that Image isn’t loading in Studio: when you change Image ID in script, it will appear when you run the game, but if you want to change the image you want while still in editing, go to both Frame and change ImageLabel Id
Why there's a line when I change screen size?
this happen when Circular Progress Size is in an odd number. Well, an even number can be divided by 2, but odd number leaves with 1 pixel, and that’s why it happens. To me, it doesn’t matter at all.
Why is the Progress keep changing?
Open script, to go line 140 and delete all text from 140 to 145 and the Progress will stay still.
I can't open this file.
This is a Roblox Model file, drag it into Roblox Studio and it should be there.