Rounded-Ends UI Bar

How would I make the ends of a Radial Bar rounded?
Note: I am not asking how to make the Image Type "Radial"!

Example:
Currently, my radial bars look like this: [Squared off ends]


I want to make it like this: [Rounded Ends]


Thanks!!!

 

Simple to add a circle at the end.

 

But how would you add a circle to the end? Sure, you could add a RawImage of a circle, but it wouldn't move with the Bar unless there was a script - do you know of any scripts to do this?

 

how do you create the radial bar? texture?

 

Image Component.
Image Type = Filled

 

So, you mask out the sector to create radialBar effect? You may just place image on top and mimic the rounded corner.

 

The point of a radial bar is that it moves - search up "Apple Watch Ring Animation" for a good visual on what radial bars do. From what I understand, just placing a image "on top" would not move with the bar.

 

What is the script you use to create the radialbar? You should able to calculate the position of each end of the radialbar.

 

I don't have a script to create the radial bar - it is an Image Component

 

So, just a static image?

 

Yes, it is an image of a Ring. Making the ImageType "filled" makes it into a Radial Bar.

 

Oh. I know how you do it. You may need extract script to doing what you need.

 

What is extract script?

 

try this