top of page
Create an energy bar for the enemy.
We create a new file inside the content file and name it widget.
Inside the widget file, we create a file and name it allimages.
We will import the energy bar image from the file we downloaded from the link named (2)greenbar and (3)greenbar and store it in the allimages file.
1- First we have to add the enemy's energy bar and we can get it from this link
https://adwitr.itch.io/pixel-health-bar-asset-pack-2/download/eyJleHBpcmVzIjoxNzI3NjI5NDU5LCJpZCI6MjU2NDMyfQ%3d%3d.U7pr3Uza0NLMidLRly4JwY6DWTk%3d


In the widget file we will create the enemy's energy bar.
To create it, we have to left-click, then user interface, then widget blueprint, choose user widget, and name it orchealthbar.
User interface : It is everything that will appear on the user interface (energy bar, conversations)
widget blueprint : Allows the creation of visual elements on the user interface and their programming can be modified.


When you open Blueprint Power Bar, you will find a blank page.

At the top of the screen on the left there is a box called search pallete from which we can call up ready-made elements created by Unreal.
Since we want a power bar, the best item we can call is called progress bar and drag it to the middle.
On the details page on the right we will go to the style box
style: A box containing two types of images (background, fill)

In the style field there is a background image which will be the image of the empty enemy energy bar which will be (3)greenbar
There is a fill image which will be the filled enemy bar image which will be (2)greenbar.
We can change the value of the energy bar by controlling the percent rate below the box. progress
2- Install software and show the enemy's health bar in the game
When you open the Blueprint widget file (orchealthbar), there is a graph page at the top right where we can put all the software. Let's click on it.

When you open the Blueprint widget file ( orchealthbar ), there is a graph page at the top right where we can put all the software.
1- First let's go to the enemy blueprint file (bp_orc) and create a new variable of type float and call it ( maximumhealth ).
2- We call the variable ( maximumhealth ) and set its value to be ( orchealth )
We connect it with the BeginPlay event, then click Compile.
.....I will explain
3- Now we will go to the graph page in the Blueprint widget file and we will find that there is an event called event construct: an event that only works after the widget appears. ( orchealthbar ) On screen while playing.

4- We will find that there is a variable defined in the variables field with the name progressBar. Let us call it .
progressBar: The energy bar we created.
5- From the progressBar variable, we create a point ( set percent ).
set percent: We set the energy bar value which will be of float type and the value will be from 0 to 1.
How did you know that the value will only be from 0 to 1? By going to the design page ( designer ) then the percent field, we will find that the upper limit value is 1 and the lower limit is 0.


6- Now we have to call a reference to the enemy ( bp_orc ) by creating a new variable and calling it orcReference
The reference will serve as a variable from which we can import all of the enemy's saved data and software.

7- We will click on the variable type and write in the search box the name of the enemy’s blueprint, which is ( bp_orc ), then another page will appear to determine the reference type, and we will choose ( objectreference ).

8- We call the character reference, and from the reference we extract the two energy values for the enemy that we created in the enemy blueprint, which are maximum health and orchealth .

9- We create a divide point .
We will divide the orchealth value by the Maximumhealth value and then connect it to a point set percent to give us only a value between 0 and 1.

10- We will create a custom event and name it UpdateOrchHalthbar.
An event that loads the damage value of the enemy with each hit onto the energy bar, and we can call it at any time.

10- We will create a custom event and name it UpdateOrchHalthbar.
An event that loads the damage value of the enemy with each hit onto the energy bar, and we can call it at any time.
3- Show the enemy's health bar in the game
Now we have to open the enemy's blueprint file and go to the viewport page and do the following:
1- On the display frame page, in the component box at the top left, we write widget in the search box.

2- On the details page, in the user interface field, we will find the widget class option. We choose the energy bar that we created (Orcehealthbar).
3- We adjust the axis of the energy bar to be above the enemy by rotating it at a 90 degree angle .

4- Change the space option from world to screen.
The reason for this is to keep the enemy's energy bar on the screen at all times and wherever the enemy moves .

In the Blueprint widget file we created a variable that holds all the enemy's saved data and software and named it orcReference.
What we want to do now is to go to the enemy's blueprint and call the orcReference variable so that the enemy's energy bar appears every time we start playing.
We can call it by doing the following:
5- We will call the widget from the component box at the top left.
6- From the widget point, we extract the get widget point : a point that enables us to take the value of any widget that was created.
7- From the get widget point, we extract the cast to point . Orchealthbar : Gets the value and data of the enemy's health bar widget.
8- From cast point to Orchealthbar and in part as Orchealthbar we extract point
set orcReference : A point that defines a new value for the enemy reference , and its value will be the current enemy blueprint (self).
9- We convert as Orchealthbar to value( promote as variable ) So that it can be a reference that we can call up at any time.
Reference containing the Blueprint widget data for the enemy's energy bar and the enemy's Blueprint ( self ).
When you start playing, the enemy's energy bar will appear and move with the enemy.


3- Show the enemy's health bar when exposed to damage
First, we have to stop the enemy's energy bar from appearing when starting the game by clicking on widget from the details box, then typing visible in the search box and making it unchecked. We will find that when starting the game, the enemy's energy bar will not appear.


Now we have to put the software that will make the enemy's energy appear only during the strike and to do that we have to do the following:
1- Go to the enemy blueprint file and call widget from the component menu.
2- From the widget point, we extract the set visibility point : This point shows or hides the enemy’s energy bar, and it will work immediately after the enemy is damaged (transition to the damage animation).
3- Copy the two points widget and set visibility and will close after enemy death (transition to corpse animation)


4- We call the value As Orchealthbar and extract the point from it
update orcHealthbar : is An event that loads the value of the damage dealt to the enemy with each hit on the energy bar, and its value is the result of dividing the enemy's energy (orchealth) by its maximum energy (maximum health).
This code point will run immediately after receiving event anydamage
(orchealth).


bottom of page