- Joined
- Jun 9, 2007
- Messages
- 2,493
Read before starting
In this guide i will teach you how to create a dialog, or to be more specific, a health bar.
This guide will step by step tell you what to do in order to create a Health Bar (Picture Below)
![Healthbar2[1][1].png](https://www.hiveworkshop.com/data/attachments/61/61001-a99e06d45b2dfb2d1fdd2094f99adfea.jpg "Healthbar2[1][1].png")
![Healthbar1[1][1].png](https://www.hiveworkshop.com/data/attachments/61/61002-e168ad57d57f1e2aa9afc831fb5e451c.jpg "Healthbar1[1][1].png")
Before you read this guide, you should already know how to work with the trigger editor, i will not explain how to create triggers, variables, etc.
Note: If the width of an dialog item is 0, it will set the width to "infinite", so that means that if a unit have 0 health, the bar will go all the way to the edge of the dialog.
An easy way to solve this is to add a "+ 1" to the width calculations, that way it will never reach 0 in width and you wont have to worry about this.
Also keep in mind that this system gives you an exact value of the units health, mana, shield, vitality, or whatever you decided to choose.
This is a picture to show what i mean:
![ExactValue[1][2].png](https://www.hiveworkshop.com/data/attachments/61/61003-e06b01fafffe85d6f5d47a7f30599cc3.jpg "ExactValue[1][2].png")
If you want to change this so that it only shows a clean number, set "Any Precision" in the Update triggers text actions to 0. This will set the amount of decimals used to 0.
Okay, so lets get started.
1. Creating the dialog
a) Create a trigger, i decided to name it "Unit Bar UI ini"
b)Set the event in your newly created trigger to Map initialization
c)Create the dialog by using the action: Create Dialog
You will now get this:
in the dialog size the first value is the width of the dialog, and the second value is the height. This may get quite confusing later, as the actual frame of the dialog counts toward the total size, so you will have to add that into your calculations.
at (0, 0) you choose the position of the dialog, relative to X of the screen. the first value is the X position of the dialog, and the second value is the Y position of the dialog. X is from what point of the screen (0, 0) will be.
d)Create a global variable of the type Dialog for your newly created dialog so that it can be modified later on. I will call it" Unit Bar UI Dialog"
e)Set the variable to your newly created dialog by going back to your trigger and add this action: Set Variable
You will now get this line:
Like this
Create your own health bar. (This is the hardest part of the tutorial)
a) Create a dialog image by using the action: Create Dialog Item (Image). You will get this:
Something that is worth mentioning is that you anchor the object relative to the dialog this time, and not the entire screen.
Offset is already explained in the 1st part aswell.
The tooltip is what message you want to appear in a small box when you mouse-over the dialog item.
So if you set it to Health Bar, it will say "Health Bar" when you mouse-over the item in-game.
The image path is the image that you will use for the object. I will use this image: Assets\Textures\ui_loadingbarsegment_center.dds
and for the type, just choose normal as i wont explain how the others work, atleast now not.
And for the tiled set options, just ignore them, they have no effect on the normal type that we use.
b) Create a global variable of the type Dialog Item and set it to the dialog item you just created.
Now we want a string on the bar that display your health like this: 150/150
c) First create a dialog object of the type label. You will get this:
Do not use the writeout option. It will make the characters appear one by one, and we do not want that. So set it to false. You can just ignore the duration, as it wont do anything with writeout disabled.
d) Create a global variable and set it to the dialog item that we just created, so that we can change the text later.
We have now finished the layout of the dialog and the ini trigger is done.
3. Keeping the Health Updated
In order to do this we need a unit.
This part is almost only about math, so you may get stuck on this part if you have problems with math.
a) We want to keep the health updated, so create a new trigger, and use the event:
Now click on Text and choose "Combine Text Multiple".
When you select your action, there will appear a small box below the trigger box. It should appear like this:
Now change "Players: All Players" to convert player to player group, then owner of triggering unit and then triggering unit.
The box will now appear like this:
Now the box will change again. Click on "Unit: Triggering Unit" and choose the unit you want.
Now click on "Text <Text+>" again and simply enter a / and then press OK.
go click "Text <Text+>" for the last time and choose the function Convert Real to Text.
Click on Value: 0.0 and once again choose the function "Unit Property".
Now set "Unit: Triggering Unit" to the unit you choosed before.
Change "Property: Life" to "Property: Maximum Life".
It should now look like this:
Now for the Actual Health Bar.
c) Add the action "Set Dialog Item Size" It should now appear like this:
Set Height to the function "Dialog Item Height" and change "Used dialog item" too the health bar dialog item.
Set the Width to the function "Arithmetic Multiple (Integer)".
Now check the box below the trigger and you should see something like this:
Now click on "Values <Integer+>" and set it to function "Arithmetic Multiple (Integer)"
Change the operator below to "Operator: *".
Click on "Values <Integer+>" below the Operator and set it to your health bars default width. For me its 280.
Click on "Values <Integer+>" once again and this time choose "Convert Real to Integer".
Change "Value: 0.0" to the function Unit Property and set Unit to your choosen unit.
Now change the Property to "Property: Life (Percent)" and you are done.
Go up to the "Values <Integer+>" at the very top and click on it. Set the value to 100.
Now change "Players: All Players" to convert player to player group, then owner of triggering unit and then triggering unit.
The box should now look something like this:
This is what my ini trigger looks like:
In this guide i will teach you how to create a dialog, or to be more specific, a health bar.
This guide will step by step tell you what to do in order to create a Health Bar (Picture Below)
Before you read this guide, you should already know how to work with the trigger editor, i will not explain how to create triggers, variables, etc.
Note: If the width of an dialog item is 0, it will set the width to "infinite", so that means that if a unit have 0 health, the bar will go all the way to the edge of the dialog.
An easy way to solve this is to add a "+ 1" to the width calculations, that way it will never reach 0 in width and you wont have to worry about this.
Also keep in mind that this system gives you an exact value of the units health, mana, shield, vitality, or whatever you decided to choose.
This is a picture to show what i mean:
If you want to change this so that it only shows a clean number, set "Any Precision" in the Update triggers text actions to 0. This will set the amount of decimals used to 0.
Okay, so lets get started.
1. Creating the dialog
a) Create a trigger, i decided to name it "Unit Bar UI ini"
b)Set the event in your newly created trigger to Map initialization
c)Create the dialog by using the action: Create Dialog
You will now get this:
-
Dialog - Create a Modal dialog of size (500, 400) at (0, 0) relative to Center of screen
in the dialog size the first value is the width of the dialog, and the second value is the height. This may get quite confusing later, as the actual frame of the dialog counts toward the total size, so you will have to add that into your calculations.
at (0, 0) you choose the position of the dialog, relative to X of the screen. the first value is the X position of the dialog, and the second value is the Y position of the dialog. X is from what point of the screen (0, 0) will be.
d)Create a global variable of the type Dialog for your newly created dialog so that it can be modified later on. I will call it" Unit Bar UI Dialog"
e)Set the variable to your newly created dialog by going back to your trigger and add this action: Set Variable
You will now get this line:
-
Variable - Set Variable = Value
Like this
-
Dialog - Set Unit Bar UI Dialog = (Last Created Dialog)
-
Unit Bar UI ini
-
Events
-
Game - Map initialization
-
-
Local Variables
-
Conditions
-
Actions
-
Dialog - Create a Modal dialog of size (500, 400) at (15, 15) relative to Top Left of screen
-
Variable - Set Unit Bar UI Dialog = (Last created dialog)
-
-
Create your own health bar. (This is the hardest part of the tutorial)
a) Create a dialog image by using the action: Create Dialog Item (Image). You will get this:
-
Dialog - Create an Image for Dialog (Last created dialog) with the dimensions (200, 50) anchored to Top Left with an offset of (50, 50) setting the tooltip to "" using the image Assets\Textures\white32.dds as a Normal type with tiled set to true tint color White and blend mode Normal
Something that is worth mentioning is that you anchor the object relative to the dialog this time, and not the entire screen.
Offset is already explained in the 1st part aswell.
The tooltip is what message you want to appear in a small box when you mouse-over the dialog item.
So if you set it to Health Bar, it will say "Health Bar" when you mouse-over the item in-game.
The image path is the image that you will use for the object. I will use this image: Assets\Textures\ui_loadingbarsegment_center.dds
and for the type, just choose normal as i wont explain how the others work, atleast now not.
And for the tiled set options, just ignore them, they have no effect on the normal type that we use.
b) Create a global variable of the type Dialog Item and set it to the dialog item you just created.
Now we want a string on the bar that display your health like this: 150/150
c) First create a dialog object of the type label. You will get this:
-
Dialog - Create a Label for Dialog (Last created dialog) with the dimensions (200, 50) anchored to Top Left with an offset of (50, 50) with the text Text color set to White text writeout set to false with a writeout duration of 2.0
Do not use the writeout option. It will make the characters appear one by one, and we do not want that. So set it to false. You can just ignore the duration, as it wont do anything with writeout disabled.
d) Create a global variable and set it to the dialog item that we just created, so that we can change the text later.
We have now finished the layout of the dialog and the ini trigger is done.
3. Keeping the Health Updated
In order to do this we need a unit.
This part is almost only about math, so you may get stuck on this part if you have problems with math.
a) We want to keep the health updated, so create a new trigger, and use the event:
-
Events
-
Unit - Any Unit Life changes
-
-
Dialog - Set (Last created dialog item) text to Text for (All players)
Now click on Text and choose "Combine Text Multiple".
When you select your action, there will appear a small box below the trigger box. It should appear like this:
-
Set Dialog Item Text
-
Dialog Item: Unit Bar Health Text
-
Text: Combine Text Multiple
-
Text <Text+>
-
-
Players: All Players
-
Now change "Players: All Players" to convert player to player group, then owner of triggering unit and then triggering unit.
The box will now appear like this:
-
Set Dialog Item Text
-
Dialog Item: Unit Bar Health Text
-
Text: Combine Text Multiple
-
Text <Text+>
-
Text: Convert Real To Text
-
Value: 0.0
-
Precision: Any Precision
-
-
-
-
Players: Convert Player To Player Group
-
Player: Owner Of Unit
-
Unit: Triggering Unit
-
-
-
Now the box will change again. Click on "Unit: Triggering Unit" and choose the unit you want.
Now click on "Text <Text+>" again and simply enter a / and then press OK.
go click "Text <Text+>" for the last time and choose the function Convert Real to Text.
Click on Value: 0.0 and once again choose the function "Unit Property".
Now set "Unit: Triggering Unit" to the unit you choosed before.
Change "Property: Life" to "Property: Maximum Life".
It should now look like this:
-
Set Dialog Item Text
-
Dialog Item: Unit Bar Health Text
-
Text: Combine Text Multiple
-
Text <Text+>
-
Text: Convert Real To Text
-
Value: Unit Property
-
Unit: Triggering Unit
-
Property: Life
-
Current: Current
-
-
Precision: Any Precision
-
-
Text: "/"
-
Text: Convert Real To Text
-
Value: Unit Property
-
Unit: Triggering Unit
-
Property: Maximum Life
-
Current: Current
-
-
Precision: Any Precision
-
-
-
-
Players: Players: Convert Player To Player Group
-
Player: Owner Of Unit
-
Unit: Triggering Unit
-
-
-
Now for the Actual Health Bar.
c) Add the action "Set Dialog Item Size" It should now appear like this:
-
Dialog - Set (Last created dialog item) size to (200, 50) for (Player group((Owner of (Triggering unit))))
Set Height to the function "Dialog Item Height" and change "Used dialog item" too the health bar dialog item.
Set the Width to the function "Arithmetic Multiple (Integer)".
Now check the box below the trigger and you should see something like this:
-
Set Dialog Item Size
-
Dialog Item: Unit Bar Health Bar
-
Width: Arithmetic Multiple (Integer)
-
Operator: +
-
Values <Integer+>
-
-
Height: Dialog Item Height
-
Dialog Item: Used Dialog Item
-
Player: 1
-
-
Players: All Players
-
Now click on "Values <Integer+>" and set it to function "Arithmetic Multiple (Integer)"
Change the operator below to "Operator: *".
Click on "Values <Integer+>" below the Operator and set it to your health bars default width. For me its 280.
Click on "Values <Integer+>" once again and this time choose "Convert Real to Integer".
Change "Value: 0.0" to the function Unit Property and set Unit to your choosen unit.
Now change the Property to "Property: Life (Percent)" and you are done.
Go up to the "Values <Integer+>" at the very top and click on it. Set the value to 100.
Now change "Players: All Players" to convert player to player group, then owner of triggering unit and then triggering unit.
The box should now look something like this:
-
Set Dialog Item Size
-
Dialog Item: Unit Bar Health Bar
-
Width: Arithmetic Multiple (Integer)
-
Operator: /
-
Values <Integer+>
-
Values: Arithmetic Multiple (Integer)
-
Operator: *
-
Values <Integer+>
-
Values: 280
-
Values: Convert Real To Integer
-
Value: Unit Property
-
Unit: Triggering Unit
-
Property: Life (Percent)
-
Current: Current
-
-
-
-
-
Values: 100
-
-
-
Height: Dialog Item Height
-
Dialog Item: Unit Bar Health Bar
-
Player: 1
-
-
Players: Convert Player To Player Group
-
Player: Owner Of Unit
-
Unit: Triggering Unit
-
-
-
This is what my ini trigger looks like:
-
Unit Bar UI ini
-
Events
-
Game - Map initialization
-
-
Local Variables
-
Conditions
-
Actions
-
Dialog - Create a Modal dialog of size (350, 85) at (15, 15) relative to Top Left of screen
-
Variable - Set Unit Bar UI Dialog = (Last created dialog)
-
Dialog - Create an Image for Dialog (Last created dialog) with the dimensions (280, 32) anchored to Top Left with an offset of (34, 21) setting the tooltip to "" using the image Assets\Textures\ui_loadingbarsegment_center.dds as a Normal type with tiled set to true tint color White and blend mode Normal
-
Variable - Set Unit Bar Health Bar = (Last created dialog item)
-
Dialog - Create a Label for Dialog (Last created dialog) with the dimensions (200, 50) anchored to Top Left with an offset of (120, 27) with the text "150/150" color set to Black text writeout set to false with a writeout duration of 2.0
-
Variable - Set Unit Bar Health Text = (Last created dialog item)
-
Dialog - Show Unit Bar UI Dialog for (All players)
-
-
-
Unit Bar Update
-
Events
-
Unit - Any Unit Life changes
-
-
Local Variables
-
Conditions
-
Actions
-
Dialog - Set Unit Bar Health Text text to (Combine ((Text(((Triggering unit) Life (Current))) with 0 decimal places), "/", (Text(((Triggering unit) Maximum Life (Current))) with 0 decimal places))) for (Player group((Owner of (Triggering unit))))
-
Dialog - Set Unit Bar Health Bar size to ((/ ((* (280, (Integer(((Triggering unit) Life (Percent) (Current)))))), 100)), (Height of Unit Bar Health Bar for (Owner of (Triggering unit)))) for (Player group((Owner of (Triggering unit))))
-
-
Last edited:
