Let's look at the different elements that make up the Basic Hud and see some of the ways they can be implemented in a script. These examples should give you an idea of how to create each Hud element and later we'll look at putting them altogether into a complete Hud. In these examples we'll show each element as a set of items that are part of a menuDef so the item's window area is relative to that menuDef.
Player Health
There are three commands associated with the player's health. Two of them are ownerdrawflag commands that make an item visible based on a preset health level and the other is an ownerdraw command that displays the numerical health value. By combining these commands with some ordinary text and graphic items we can create an elegant Hud element for the player's health.
When showing the player's health it is nice if you can draw attention to it if the value drops to a critical level. One way to do this is to change the color of the area that displays the health value. To take it a step farther, it would be even better if we used a shader to make the color pulse and draw your attention. If we use this graphic :
ui/assets/hud/red_box.tga |
|
8x8 |
and this shader :
hudalert_red
{
nopicmip
nomipmaps
{
map ui/assets/hud/red_box.tga
blendFunc GL_ONE GL_ZERO
tcMod scroll 7.1 0.2
tcmod scale .8 1
rgbgen wave sin .25 .25 0 1
}
}
we could create an item like the following as the background for the health element when the health drops to a critical level.
itemDef
{
name "HealthAreaCritical"
rect 0 2 128 60
style WINDOW_STYLE_SHADER
background hudalert_red
visible MENU_TRUE
ownerdrawflag CG_SHOW_HEALTHCRITICAL
}
This is a normal graphic item that uses the hudalert_red shader as its background. The ownerdrawflag CG_SHOW_HEALTHCRITICAL command makes sure that this item is only visible if the health value is less than 25, a point at which it is considered to be critical.
If we want to have a background item for those times when the health is not at a critical level we could create an item like the following :
itemDef
{
name "HealthAreaNormal"
rect 0 2 128 60
style WINDOW_STYLE_FILLED
backcolor 0 1 0 1
visible MENU_TRUE
ownerdrawflag CG_SHOW_HEALTHOK
}
This is a regular item that fills the window area with the color green. The ownerdrawflag CG_SHOW_HEALTHOK command makes this item visible only if the health level is 25 or greater. By using these ownerdrawflag commands we can have multiple items sharing the same screen area but only have one displayed at a time, based on the health value.
All that is left is to display the actual health value.
itemDef
{
name "health"
rect 12 42 63 12
visible MENU_TRUE
decoration
textstyle ITEM_TEXTSTYLE_SHADOWED
forecolor 1 1 1 1
textscale .75
ownerdraw CG_PLAYER_HEALTH
}
The ownerdraw CG_PLAYER_HEALTH command provides the health value and it is displayed using the text formatting commands provided in the item. The text is drawn using the foreground color, which is white. An extra touch we can add here is to have the color of the text change depending on the health level. The addColorRange command is used to do this.
itemDef
{
name "health"
rect 12 42 63 12
visible MENU_TRUE
decoration
textstyle ITEM_TEXTSTYLE_SHADOWED
forecolor 1 1 1 1
textscale .75
ownerdraw CG_PLAYER_HEALTH
addColorRange -999 25 1 0 0 1
addColorRange 26 100 1 .75 0 1
addColorRange 101 999 1 1 1 1
}
By using these three addColorRange commands we change the foreground color based on the health value, as determined by the ownerdraw CG_PLAYER_HEALTH command. If the value is in the range -999 to 25 the color is red, 26 to 100 the color is yellow and from 101 to 999 the color is white. The health value is displayed in the foreground color so its color will change as its value changes.
Player Armor
There are three ownerdraw commands associated with the player's armor. Two of them are for displaying either a graphic or a model of the armor, while the other displays the armor level. We can combine these commands with more basic items to create the Hud element for armor.
A nice touch for some Hud elements is to make the background of their window area reflect the team you are on in team based games. In nonteam games you can just set the background to any suitable color. One method of doing this is as follows :
itemDef
{
name "armorareateam"
rect 0 13 125 48
visible MENU_TRUE
style WINDOW_STYLE_TEAMCOLOR
ownerdrawflag CG_SHOW_ANYTEAMGAME
}
itemDef
{
name "armorarea"
rect 0 13 125 48
visible MENU_TRUE
style WINDOW_STYLE_FILLED
backcolor 0 0 1 1
ownerdrawflag CG_SHOW_ANYNONTEAMGAME
}
What we have here is two items that occupy the same screen area, which we are using to display the armor amount. The item named armorareateam fills its window area with the color of the team the player is on. The ownerdrawflag CG_SHOW_ANYTEAMGAME command makes this item visible only if the game type is team based. The item named armorarea fills its window area with the color blue and the ownerdrawflag CG_SHOW_ANYNONTEAMGAME command in it makes this item visible only if the game type is nonteam based.
To make it clear that the value displayed in this screen area deals with armor we must show something to identify it as such. While we could just place some text there that says "ARMOR" there are more elegant methods open to us. We have a choice of displaying a graphic icon of armor or a model of the armor in our screen area, depending on which ownerdraw command we use. To display a model we could use something like this :
itemDef
{
name "armormodel"
rect 10 7 30 30
visible MENU_TRUE
decoration
ownerdraw CG_PLAYER_ARMOR_ICON
}
This will display the armor model if the value of the cg_draw3dIcons cvar is set to 1. Otherwise it will display a graphic icon of the armor. If we wish to display only a graphic icon then we'd use this :
itemDef
{
name "armoricon"
rect 10 7 30 30
visible MENU_TRUE
decoration
ownerdraw CG_PLAYER_ARMOR_ICON2D
}
Both of these fit their display in a 30x30 area.
The last thing needed to complete this element is the armor level value. This is displayed using a text item like the following :
itemDef
{
name "armorvalue"
rect 55 43 63 12
visible MENU_TRUE
decoration
textstyle ITEM_TEXTSTYLE_SHADOWED
textscale .75
forecolor 1 1 1 1
ownerdraw CG_PLAYER_ARMOR_VALUE
}
This displays the armor value in white using the text formatting commands in the item. Like the health element, we can make the color of the armor value reflect its value using the addColorRange command.
itemDef
{
name "armorvalue"
rect 55 43 63 12
visible MENU_TRUE
decoration
textstyle ITEM_TEXTSTYLE_SHADOWED
textscale .75
forecolor 1 1 1 1
ownerdraw CG_PLAYER_ARMOR_VALUE
addColorRange -999 25 .67 0 0 1
addColorRange 26 100 1 .75 0 1
addColorRange 101 999 .75 .75 .75 1
}
By using these three addColorRange commands we change the foreground color based on the armor value, as determined by the ownerdraw CG_PLAYER_ARMOR_VALUE command. If the value is in the range -999 to 25 the color is red, 26 to 100 the color is yellow and from 101 to 999 the color is grey. The armor value is displayed in the foreground color so its color will change as its value changes.
Player Ammo
Like the armor, there are three ownerdraw commands associated with the ammo for the currently selected weapon. Two of them are for displaying either a graphic or a model of the ammo, while the other displays the ammo amount. We can combine these commands with more basic items to create the Hud element for ammo.
Also like the armor element, we can make the background of the ammo element reflect the team color in team game mode and a selected color in nonteam games.
itemDef
{
name "ammoareateam"
rect 3 13 122 48
visible MENU_TRUE
style WINDOW_STYLE_TEAMCOLOR
ownerdrawflag CG_SHOW_ANYTEAMGAME
}
itemDef
{
name "ammoarea"
rect 3 13 122 48
visible MENU_TRUE
style WINDOW_STYLE_FILLED
backcolor 0 0 1 1
ownerdrawflag CG_SHOW_ANYNONTEAMGAME
}
What we have here is two items that occupy the same screen area, which we are using to display the ammo amount. The item named ammoareateam fills its window area with the color of the team the player is on. The ownerdrawflag CG_SHOW_ANYTEAMGAME command makes this item visible only if the game type is team based. The item named ammoarea fills its window area with the color blue and the ownerdrawflag CG_SHOW_ANYNONTEAMGAME command in it makes this item visible only if the game type is nonteam based.
This Hud element needs something to tell us what the value represents so we'll put a graphic icon or model in it to tell us that this is ammo. To display a model we could use something like this :
itemDef
{
name "ammomodel"
rect 10 7 30 30
visible MENU_TRUE
decoration
ownerdraw CG_PLAYER_AMMO_ICON
}
This will display the ammo model if the value of the cg_draw3dIcons cvar is set to 1. Otherwise it will display a graphic icon of the ammo. If we wish to display only a graphic icon then we'd use this :
itemDef
{
name "ammoicon"
rect 10 7 30 30
visible MENU_TRUE
decoration
ownerdraw CG_PLAYER_AMMO_ICON2D
}
Both of these fit their display in a 30x30 area.
The last thing needed to complete this element is the ammo level value. This is displayed using a text item like the following :
itemDef
{
name "ammovalue"
rect 55 43 63 12
visible MENU_TRUE
decoration
textstyle ITEM_TEXTSTYLE_SHADOWED
textscale .75
forecolor 1 1 1 1
ownerdraw CG_PLAYER_AMMO_VALUE
}
This displays the ammo value in white using the text formatting commands in the item. Like the armor element, we can make the color of the ammo value reflect its value using the addColorRange command.
itemDef
{
name "ammovalue"
rect 55 43 63 12
visible MENU_TRUE
decoration
textstyle ITEM_TEXTSTYLE_SHADOWED
textscale .75
forecolor 1 1 1 1
ownerdraw CG_PLAYER_AMMO_VALUE
addColorRange -999 5 1 0 0 1
addColorRange 6 999 1 .75 0 1
}
By using these three addColorRange commands we change the foreground color based on the ammo value, as determined by the ownerdraw CG_PLAYER_AMMO_VALUE command. If the value is in the range -999 to 5 the color is red and from 6 to 999 the color is yellow. The ammo value is displayed in the foreground color so its color will change as its value changes.
Player Head
There is only one ownerdraw command associated with displaying the player's head. This command will draw a model of the head unless the value of the cg_draw3dIcons cvar is set to 0. Then it will display a graphical icon. You can not use the ownerdrawflag CG_SHOW_2DONLY command to force a graphic icon to be displayed.
Similar to the elements shown above you can make this element's background reflect the team color or be set to a specified color for nonteam games. We will not look at that here, as it is identical to the above elements.
To display the head you would use something like this :
itemDef
{
name "playerhead"
rect 70 10 45 45
visible MENU_TRUE
decoration
ownerdraw CG_PLAYER_HEAD
}
This will fit the head into a 45x45 area.
Player Score
There are three ownerdraw commands pertaining to the personal score of the player. Two of these only refer to the player's score if the game is nonteam based. Otherwise they refer to the team's score. Therefore, for the player's score, we must show different information in the element depending on the game type.
There are two different ways of doing this. One way is to have two seperate menuDefs for the score element but only display the appropriate one for the current game type. This is done by including the proper ownerdrawflag command in the menuDef definition. The other way is to have one menuDef but use the ownerdrawflag commands in the items to make the correct ones for the game type appear. Either way works fine so the choice is up to you.
Using two menuDefs would look like :
menuDef
{
name "PlayerScore"
visible MENU_TRUE
rect 512 416 128 64
ownerdrawflag CG_SHOW_ANYTEAMGAME
itemDef
{
}
....
}
menuDef
{
name "PlayerScore"
visible MENU_TRUE
rect 512 416 128 64
ownerdrawflag CG_SHOW_ANYNONTEAMGAME
itemDef
{
}
....
}
If you were using only one menuDef then the ownerdrawflag CG_SHOW_ANYTEAMGAME and ownerdrawflag CG_SHOW_ANYNONTEAMGAME commands would appear instead in the items.
The player's score would be displayed by :
itemDef
{
name "Score"
rect 10 58 40 0
visible MENU_TRUE
textstyle ITEM_TEXTSTYLE_SHADOWED
text "Score:"
decoration
forecolor 1 1 1 1
textscale .25
ownerdraw CG_PLAYER_SCORE
}
The score is displayed using the text formatting commands in the item and in the color white.
For nonteam games you can also show the highest and the second highest score for the game like so :
itemDef
{
name "1stScore"
rect 10 45 65 12
visible MENU_TRUE
textstyle ITEM_TEXTSTYLE_SHADOWED
text "1st:"
decoration
forecolor .25 .25 1 1
textscale .25
ownerdraw CG_PLAYER_1STPLACE
ownerdrawflag CG_SHOW_ANYNONTEAMGAME
}
itemDef
{
name "2ndScore"
rect 70 45 65 12
visible MENU_TRUE
textstyle ITEM_TEXTSTYLE_SHADOWED
text "2nd:"
decoration
forecolor 1 0 0 1
textscale .25
ownerdraw CG_PLAYER_2NDPLACE
ownerdrawflag CG_SHOW_ANYNONTEAMGAME
}
Again these use the text formatting commands to display the information. Note that we use the ownerdrawflag CG_SHOW_ANYNONTEAMGAME command to make sure these only appear in nonteam games.
