[HUD] Stylish health life bar problem

Hi guys,
Here I am, pretty new to Unity, trying to do all sorts of thing before taking it seriously.

Here's what blocking me today:
I want to do a sort of stylish health bar like this: http://image.noelshack.com/fichiers/2015/28/1436550908-resultwanted.jpg

I looked around for some tutorial, but all of them giving an output like that more or less: http://image.noelshack.com/fichiers/2015/28/1436551078-resultnotwanted.jpg

Instead of resizing, are there any ways to crop the yellow life bar ?

Thank in advance.

 

As with most programming problems, there are many, many solutions. Here's what I recommend:

Make 2 UI images, both with the yellow image, but turn the rgb values down on the one that renders in back so it appears greyscale. On the colored image, set the image type to "Filled" and the fill method to "Horizontal", then you'll be able to set the fill amount in-code (0 to 1). To access an image in-code (or any unity UI), you must have "using UnityEngine.UI;" at the top of your script

Best of luck!

 

Oh god, thank you, it worked!