[HELP]Circular Progress Bar

dierrera · July 20, 2015, 9:11pm

Hello UE Community

I want to make a circular progress bar using this pic and in this way

So, the thing is, i need to make my own component? and how i can make it?

anon44224379 · July 21, 2015, 2:01am

You can do this in UMG with just an image and an animation.

Create a UMG widget blueprint
add your image to the canvas panel
create an animation and name it. Animate the “Angle” parameter from zero to 360 over the period of time you desire (the amount of time will determine how fast it spins)
in the widget graph just call play animation on the animation, based on whatever input you want.

&stc=1

dierrera · July 21, 2015, 4:43am

Thank’s for the advise, but that’s not what i’m looking for

I guess i don explain what i want in the right way… My bad

Ok, let’s retry

What i want it’s to fill the meter (yeah, that is a meter) and fill it in a circular way. This is the meter idea

This is the meter in a 35%

And again in 50%

This is what i want to make. But thanks

anonymous_user_3a8723ae · July 21, 2015, 6:25am

hey there,

i think the best approach for you to do this is using a dynamic texture with scalars you provide in order to modify the behaviour.

Unfortunately im not good in dynamic textures, so i cant give you an example, but normally you have a value somewhere representing
the percentage which “fills” your image.

You then send your value to the dynamic texture (via SetScalar(by Name)).

You can bind those dynamic textures to an image in UMG, so you are able to call those SetScalarParameters…

anon44224379 · July 21, 2015, 2:48pm

In that case I would think using sprite sheets for you animation would be the easiest. Here’s a tutorial on the material creation:

There are lots of tutorials and threads on using sprite sheets if you do a search.

anonymous_user_741503d3 · July 21, 2015, 2:53pm

Check this thread:

And this page:

NickDarnell · July 21, 2015, 3:32pm

Yup - that’s the way to pull off this effect.

dierrera · July 22, 2015, 6:04am

Ok, the two links are great but i can’t still making what i want. But thanks, this is helpful

Two things

First, i want to fill the meter in this way.

Second, I don’t know if you can see it but the star doesn’t have all the colors that the original texture have

Here a pic of what have i done.

And thanks for all

dierrera · July 24, 2015, 5:28am

So… i think i need to make the sprite option, i guess