How to create a Casting Bar in UMG?

Development Programming & Scripting UI
, , , ,
1

How would I go about creating a casting bar for spells in my game? I already have a basic UI made with UMG that shows the health of my character. I know I should be using a UMG progress bar but I don’t know what variable to use as a cast time to bind to it. I thought maybe this is what a timeline is for but I’m not sure. Any tips? :]

2

You could have a variable “CastTime” on your spells and pass this to the “CastBar” widget.

Then you could use a tick variable to count the seconds from 0 to the passed “CastTime” and maybe also check every tick if the player is still casting with a bool on the player (that you probably already got for other things).

Would that be an idea? (:

3

So you have a “Set Timer” node that fires a function to cast the spell?

I don’t know your exact setup, but you can just put in the Function name like you did with your “Set Timer” node.

You just need to devide the return Value of “Get Timer Elapsed Time” and dievide it by the Casttime, because the Progress bar goes from 0.0 to 1.0.

For example if your Cast is 3 seconds long, you would set the Cast Bar Value to “Get Timer Elapsed Time” / 3.

Here are some screenshots, but this will be different from your setup, since i just created everything in the Widget it self. I guess your Set Timer etc is inside the Spell BP.

For testing i created this function (inside the Widget. I guess yours is in the Spell BP)

http://puu.sh/efQ51/cf1b1596f4.png

Then i called the Timer on Construct (you may do the same, but you will need to plugin the actual Spell Actor into the Object input of “Set Timer”.

http://puu.sh/efQ4p/74f2d657e6.png

I put in a simple Progress Bar and clicked on “Bind” at the right side of this screen at “Percent”. This will change “Bind” to the Function Name it is binded to (not your Spell function, but the function that handles the value for the progress bar)

http://puu.sh/efQa5/b263913a21.png

And here i took the binding and divided the Elapsed Time of that Timer by the 3 Seconds my Spell lasts.

http://puu.sh/efQ6R/46e3014b62.png

This is how it works, but you may change this a bit.

If you run into problems, please post your Spell and Widget Setup, so i can recreate it and show you how you need to do it.

4

I found a great way to do it using timers, but I just need to figure out how to use the “Get Timer Elapsed Time” node to then plug its return value into a progress bar. Do you happen to know how to use this node? :]

5

Holyyyyyyyyyy **** it’s WORKING!!!

The problem was that I didnt really understand where to call the Get Timer Elapsed Time node. I was calling it in the Mage blueprint (where the CastFrostbolt function is located) and then in the binding graph I was not specifying in what object this CastFrostbolt function actually was, I had nothing entered in the Object input.

What I was trying to do originally was to store the Return value of Timer Elapsed Time in a variable and then pass that variable to the binding graph but clearly I wasnt doing it properly. I would never have guessed the division by the duration of the cast time, to be honest im not sure if I understand why you have to do that.

Thank you so much!

6

The devision is easy. A progress bar works with values from 0.0 to 1.0.

So passing a value from 0 seconds up to 3 seconds will fill the bar at 1 second, because that would be 100%. What you really want is, to have 3 seconds as 100%. So to have 3 seconds equal to 1.0, you need to devide it by 3.

3 / 3 = 1.0

1 .5 / 3 = 0.5

etc.

So after 1.5 seconds, the bar would be half full. If you wouldn’t devide by 3 seconds, it would already be full at 1 second, like i told above.

The 3 seconds are the casttime as you already understood. I just took 3 seconds for an example.

7

Sorry I forgot to reply but I understand now :slight_smile: Thanks again!