Circled-shaped HP bar with alpha mask

Thanks man! Put your round bars in good use. They works perfectly. Do you happen to know the best way to make the bars so that the egdes are round-shaped? Do i need to draw some texture or sprite and add material to mask the rough corners?

dbc1407aa51d414d86b9a0b12f6d84b09d951213.jpeg

Yeah. And i wasn’t referring to your circle-shaped HP-bar but rather the XP bar that is next to it :). It would be much better if it have a soft edges. I was just wondering what would be best way to approach doing it.

Thank you so much man. I have been looking all over forums for this and you did it with a unique style. My issue now is bringing interactive materials, like the health bar in your video, into the in-game HUD.

This is very awesome stuff. Now I have a question/request. Is there a way to reverse the order? Make it feel up and possibly change colors as it fills up? Say I have an energy bar that I refill with say holding down a key.
Same setup but I reverse it in what node?

Could you possibly explain how to apply materials inside the in-game HUD designer ?

I downloaded your stuff, but I was unable to use it. I put those files in my project and there are broken links in the blueprints. I’m somewhat of a noob, but it would be helpful if you posted them in a complete ready to use sample project or gave a bit of instructions. Also, I just want something super simple and mono colored. Thanks.

I was having the same problem. My solution was to copy every function and material in same folder. Then i needed to set the function again. It is very easy because it will give you dropdownlist where you just select the right function in right place. You do these in material editor. Check every material inlcluded with download provided and set the functions.

Thanks a lot ! Using this as a loading/selection indicator for a Leap Motion controlled UI. Only one problem though, I’m applying your material to a UMG Widget and it doesn’t seem to work in the published version of the project.
Running in the editor works fine but in the published project the circle doesn’t appear at all. Any ideas? Thanks!

Hey JBaldwin, this is awesome stuff, thank you very much for providing this stuff. I was searching for a way to show the health of my creeps in 3d space and this provided all i need ;).

Im hijacking this thread to show you that i have been working on the same thing, almost. Its a pure material based (no textures) circle menu, ‘fully dynamic’! :smiley:

http://locktd.com/wp-content/uploads/2014/12/Untitled-24.png

It has a neat “pulsing” effect for hovering (would love to show a video but i got no internet)
When you create it you input an array of strings (any number) and it creates the menu automagically.

Well… it is almost fully material based, any idea how i can recreate this alpha image with pure nodes?

http://locktd.com/wp-content/uploads/2014/12/circletm.png

If anyone has time, could you explain (like you would to a 3 year old child) how to implement JBaldwins shader into HP widget.

The download doesn’t seem to work well with 4.8 :confused:

Did get the VectortoradialValue to work though with a bit of messing around.

You may have to play with the UV ranging depending on if you want your clock to start along the x-axis or go CW or CCW.

This clock goes from +X CCW around to +X again.

Hey Guys,
I found this thread couple of hours ago and managed to implement JBaldwins Dynamic Radial System successfully in UE 4.10.4
And I’m pretty happy with the result. Thanks so much for creating this and making it available to everyone.

What I’m trying to do now is a similar health bar like in Kingdom Hearts 2.

d23d93a3441aa4365d9b160ddbd6d15f474c667d.jpeg

So basically a bar that starts as a radial bar and then switches into a horizontal bar.
I think there are two ways to get this to work, but I don’t even know if they are possible and that’s why i’m asking you guys for help.

The first solution I thought about, would be to create a similar shader like the one JBaldwin uses to create a radial progress bar.
Sadly I’m still a beginner in UE4 and don’t know that much about shader and dynamic material, yet. Thats why I think this might be a little bit too complicated for me, but with a little bit help, I might be able to pull it off.

The second solution would be to split the health bar into 2 bars, one radial bar and one horizontal bar and put them right next to each other. Then I would need to make sure both of them use similar dynamic materials so it looks like it’s actually only one health bar. So I would need two dynamic materials one for a horizontal bar and one for a radial bar, which both use the same “core” shading. For this I’ll need a little bit help figuring out which nodes I’ll need from Jbaldwins Dynamic Radial System in the new dynamic material to make the horizontal bar look similar to the radial bar.

So what do you think? Are those ideas even possible? Is there a better way to do this?

At the risk of sounding like a fawning fan boy I am in awe of your talent and intellect. I’m using this amazing gift now and I can’t thank you enough. It adds some much to my game. It may seem like a small thing to you but it is not to me.

Thanks again,

Arthur

Incase you are still looking for somehing, I found this, link is in the description:

Thx a lot for sharing, this is really nice and easy to use.

Hey there, I was wonder what the function was with the XYsplit is called? If it’s another function you made what’s it look like thanks!

It helps a lot to me. thank you~:)

Revisiting this post after a few years - for my current project our mock up actually features segments exactly like this!
When your posts says “no textures” did you manage to cut the lines in the bars dynamically? For instance, if each segment indicated 50 health, and one character had 500 and one had 700, they would need a different number of segments/separator lines.

If so, it would be fantastic if you could give me a breakdown of how you achieved this!