Health Bar

Health Bar

The Health Bar feature of the game allows you to see the health of characters, buildings and other game aspects with a health stat.

Design

The goal is to use the component system already present in the game to be able to attach a HealthBarComponent to any entity with CombatStatsComponent. The HealthBarComponent is a renderable component that will show up in the game above characters centered. As shown below:

** ADD IMAGE **

The players health is constantly updated and the healthbar moves along with the player.

Technical

While designing the healthbar component there were a few technical challenges. The one that persisted the longest was the fact that the renderer wasn't rendering in pixels but units. Through some research it was realised how to render in pixesl. For more information on how to use RenderUtil see Java Doc [INSERT JAVADOC].

This realisation led to the creation of RenderUtil which is a set utilities to help one render in pixels. Also DrawableUtil was created to help with the creation of a pixmap to use for the actual display of the health.

The technical implementation followed the architecture that was already given that of creating loosely coupled components that can be attached to the entities. The HealthBarComponent implements renderable and as such as overrides draw(SpriteBatch). When called it correctly reflects the health of the character and renders it on the screen. The health is retrieve from the sister component CombatStatsComponent

** UML IMAGE **

Please note that the health bar's constructor must be called with two arguments. width and height both of which are in pixels. It should also be noted that CombatStatsCompnent must be added first to the entity before adding HealthBarComponent otherwise the behaviour is undefined.

How to attach to an entity:

   ghostKing
        .addComponent(new CombatStatsComponent(config.health, config.baseAttack))
        .addComponent(animator)
            .addComponent(new HealthBarComponent(100, 10))
        .addComponent(new GhostAnimationController());

Using RenderUtil

It uses a runnable callback for you to put in all your draws that should be rendered in pixels. It will switch back to units when it's done.

    /* We need to temporarily render in pixels */
        RenderUtil.renderInPixels(batch, () -> {
            this.progressBar.draw(batch, 1);
        });