- Home /
Create a bar that has 4 colours in it
Hi, I've been stuck on this one for awhile, I am trying to make a bar that has each players colour inside of it and depending each players percentage value the fill will change.
I am trying to create a way to visually represent 4 players scores against each other and thought this might be the best way.
https://imgur.com/gallery/tiebgNW
I was trying to use a gradient for this purpose but couldn't get my head round it (documentation is quite scarce on it).
Answer by Casiell · Mar 02, 2020 at 11:29 AM
Simplest way is to create a bar container (empty game object) with whatever total size you want. Then create 4 (or however many) UI Images you want, and color each of them to whatever color you need.
Now for the layout:
Container object needs Horizontal Layout Group
Each image needs Layout Element with Flexible Width checked
From your script set the value of that Flexible Width to whatever percentage each player should have
Notes: this way uses UI system, so you will need all the things associated with it, like Canvas etc
Well I feel dumb, you learn something new everyday! I didn't even know the layout elements even existed. Thank you very much, you have saved me a week of headache
Your answer
Follow this Question
Related Questions
Image Filling To Obtain Color Scale 0 Answers
WaterProDaytime with color gradient 1 Answer
Button image sprite colour change 1 Answer
Apply gradient between two colors on x amount of objects 1 Answer