Custom Healthbar

By default, the Replicated Health System component uses a simple animated healthbar to inform the player of his current health. You do not have to use this default health bar, you can implement your own. The following document explains how to connect your own health bar to the RHS.

---

How does it work?

The default healthbar is not directly tied to the RHS component, but is a completely independent system. Based on the component settings, you can set a class for the widget to be generated when the component is loaded. The widget itself contains all the logic to respond to a given set of values. Inside the widget, we used the event dispatchers of the RHS component to change the widget data based on events in the component.

For example, in our default widget, the progress value is always recalculated when the "On Health Data" dispatcher event is called. To get the values used to calculate the new progress, we used the "Return Health Data" function from the RHS component. After the new progress is calculated, we use two custom functions to update the health bar.

How can you make your own Healthbar

If you do not want to use the healthbar provided by us, you can of course use your own created healthbar. Since there are several ways how a healthbar can be designed, we will leave you creative freedom in how you design and manage your healthbar, so the exact process on how to create a healthbar will not be covered in here. What will be covered here is how you can connect your custom healthbar to the Replicated Health System in one simple step. To better illustrate this, we will use the included healthbar as an example.

Create an Update Event

In your custom health bar widget, you need to create an event that can be called whenever you want to update your healthbar percentage value. We have included the Return Percentage function in the RHS component that will automatically return the current health percentage for you.

Get reference to the RHS Component

The next step is to find a way to reference the RHS component that created this widget. To do this, we used the Get Owning Player Pawn node, and from there we used the Get Component by Class node to return the RHS component if valid. Referencing the RHS component should happen fairly early in the life of your widget, at least before any logic could happen that would use the reference. We used the BeginPlay event.

Bind to Event Dispatchers

Now that you have a reference to the RHS component and have created an event that updates the percentage of your custom health bar, we are ready to proceed with the final step to get your custom health bar working. The magic words to achieve the desired behavior are Event Dispatchers! Dispatchers can be used to hook logic to specific events in the RHS Component and any other blueprint in your game!

To bind to an event dispatcher, you must drag from the RHS component reference and search for the desired dispatcher event. In our case, we want to bind to the "On Health Data Changed" dispatcher. This dispatcher event will then be fired each time the health data within the component is changed. Once you have the bind node in your blueprint graph, the next thing you need to do is connect it to the event you just created (the one that sets the new percentage value). Here you can now use the Return Percentage function within the RHS component to get & set the current percentage value.