Improve visual aesthetics of HP Bars

[azriel91]

In GitLab by @azriel91 on Mar 30, 2019, 13:58

What HP Bars can do:

• ✅ Generate gradient texture
• ✅ Generate texture with different colours per pixel (plus padding pixels)
• ✅ Generate sprite sheet with 1 pixel sprites
• ❌ Entity for bar background
• ✅ Entity for actual hp
• ❌ (Optional) Entity for outline (visual polish)
• ✅ Transform using scaling to alter the "actual hp" length (because texture and sprite sheet are immutable after loading)
• ✅ Attach to parent entity using Parent component

To make them look better, we should:

• Have another entity for the background and outline.
• Perhaps have multiple gradient stops (current yellow isn't prominent).

Maybe wait for rendy to be integrated first, since our other PR isn't being accepted.