How To Add Crosshair To Hud Tf2

This guide has been ported over from the quondam HUDS.TF Guides section. Credit for this Guide goes towards Komorebi.

Introduction
This part of the tutorial is a bones overview of what exactly a HUD crosshair is. More avant-garde users should skip ahead to Implementation.

Team Fortress 2's heads up display, or HUD equally it is colloquially known, is a user interface, also known as a UI. Information technology displays data relevant to the user while in-game, such every bit health, ammo, the scoreboard, and much more. It is controlled by text documents that determine positioning, size, visibility, colour, and everything else nigh all of its moving bits and pieces. These documents, saved every bit .res files, can be edited by the user to alter existing $.25 and pieces, which volition henceforth referred to every bit controls, or, more interestingly, at least for our purposes, add new controls. I technique users have been using since every bit early as 2009 is to place a command into their HUDs to serve every bit a crosshair. That is, something that will tell them where the eye of their screen is. In that location are two primary methods of doing this: text crosshairs and prototype crosshairs.

Text Crosshairs :
The first method is to only insert a text box into the hud and and then load a custom font which contains the crosshair of your choice. This method's advantages are that the crosshair's color tin can be changed easily and it can be animated to change color upon damage (whenever you hit someone), a feature found in many of the Quake games, precursors to the TF series in several ways. For users searching for a more in-depth explanation of the custom font or who are interested in creating their own font, skip ahead to Creating Your Ain Crosshairs.

Paradigm Crosshairs :
The second method is to but insert an paradigm file into the hud. The advantages this method brings are that the size of the crosshair can be changed easily and it tin can be toggled (turned on or off at will) in a couple ways that text crosshairs can't be. If you are adequately experienced with these crosshairs you might know near the method of implementing them as in game crosshairs, in which instance yous would want to skip ahead to In-Game Paradigm Crosshair.

ane. Implementation

For both methods the crosshair is created past inserting a new control in HudLayout.res. There are several other steps that must be taken as well to ensure that your crosshair functions as intended. Everything that is necessary for both crosshairs is listed beneath.

Text :

1. Add the physical font file to resource or resource/fonts.
   
2. Reference the font file at the very bottom of ClientScheme.res in the section entitled "CUSTOM FONT FILES". Make sure the numbers are in ascending club (i then 2 so 3 etc.).
   

   Code:
   

   }
"vi"
{
"font" "resource/TF2Build.ttf"
"name" "TF2 Build"
"russian"
{
"range" "0x0000 0xFFFF"
}
"polish"
{
"range" "0x0000 0xFFFF"
}
"turkish"
{
"range" "0x0000 0xFFFF"
}
}
"7"
{
"font" "resource/fonts/crosshairs.ttf"
"name" "crosshairs"
}

3. Create a definition for the font in ClientScheme.res under the section entitled "FONTS", which is pretty early in the file.
   

   Code:
   

   //
//////////////////////// FONTS /////////////////////////////
//
// describes all the fonts
Fonts
{
// fonts are used in order that they are listed
// fonts listed later in the guild will only exist used if they fulfill a range not already filled
// if a font fails to load then the subsequent fonts will replace

   "fogCrosshair"
{
"1"
{
"proper name" "Crosshairs"
"tall" "28"
"condiment" "0"
"antialias" "1"
"weight" "0"
"outline" "1"
}
}
"fogCrosshairSmall"
{
"ane"
{
"name" "Crosshairs"
"tall" "24"
"additive" "0"
"antialias" "one"
"weight" "0"
"outline" "1"
}
}
"fogCrosshairSmooth"
{
"1"
{
"name" "Crosshairs"
"tall" "28"
"additive" "0"
"antialias" "1"
"weight" "0"
"outline" "1"
}
}

4. Create the control in HudLayout.res, examples are below under Examples.
   

Image:

1. Salve the paradigm file you lot would like to use as a .vtf or valve texture format file and make certain there is an accompanying .vmt file that has the same proper noun. If you are using someone else's piece of work this is near likely done.
   
2. Make sure the .vmt file references the right .vtf. The .vmt, or valve material type, should look like this:
   

   Code:
   

   "UnlitGeneric"
{
"$translucent" ane
"$basetexture" "vgui\replay\thumbnails\*your file proper noun*"
"$yertexcolor" 1
"$no_fullbright" 1
"$ignorez" 1
}

   *name of your file* needs to be the same as the proper noun of the .vmt and the .vtf, to clarify.
   
3. Create a re-create of both files and motion the copies into custom/ *any name*/materials/vgui/replay/thumbnails.
   
4. Either create the control in HudLayout.res if you want to employ the crosshair that manner or reference it in console as an in-game crosshair. If you wish to pursue the 2nd option and so skip ahead to In-Game Image Crosshair.
   

Text Example:

Code:

"TextExample"
{
"controlName" "CExLabel"
"fieldName" "TextExample"
"visible" "1"
"enabled" "1"
"visible_minmode" "1"
"enabled_minmode" "ane"
"xpos" "c0"
"ypos" "c0"
"zpos" "0"
"wide" "100"
"tall" "100"

"font" "fogCrosshair"
"labelText" "+"
"fgcolor" "White"
"textAlignment" "heart"
}

Image Example:

Lawmaking:

"ImageExample"
{
"controlName" "CTFImagePanel"
"fieldName" "ImageExample"
"visible" "1"
"enabled" "ane"
"visible_minmode" "one"
"enabled_minmode" "1"
"xpos" "c0"
"ypos" "c0"
"zpos" "0"
"wide" "100"
"tall" "100"

"alpha" "255"
"image" "replay/thumbnails/*your file proper noun*"
"scaleimage" "1"
}

2. Customization

Changing Your Crosshair
Let's say you notice a crosshair that you honey, simply it's just a tad too big. Or perchance it's a piddling also green for your taste. This is solved past editing the parameters in the control you put in HudLayout.res. After each modify you should open the developer's console and type the control "hud_reloadscheme". This will reload all of the hud files and employ your changes. In this way you can see the effects of your edits without needing to restart the game. Running TF2 in windowed no border at your resolution makes alt-tabbing in and out of game quicker and easier so I'd recommend that besides. How do you lot actually modify anything, yous say? Beneath is an explanation of how you can tweak your crosshair's size, color, and positioning.

Resizing
For paradigm crosshairs, this is equally elementary as editing the wide and tall values in the control. For text crosshairs, the size of the text you have created is determined past the font definition in ClientScheme.res. You volition need to edit the existing definition, or, more efficient, create a new 1 that's a little dissimilar. Here'south how.

Thanks to Lange for letting me point you to his explanation. Antialiasing is pretty different in fonts, and doesn't e'er work, and so try enabling/disabling information technology yourself and meet.

In addition to antialiasing, you might want to change "outline" to "1", which volition put a blackness outline around your crosshair. It might be a bit buggy or pixelated, notwithstanding, so, same every bit your crosshair, examination out enabling and disabling information technology for optimum results.

Back to resizing. Something a lot of hud makers practise to make things easier is to create many definitions for the aforementioned font. This is because the only way to change the size of a font is to change the font definition. So, an piece of cake shortcut is to proper noun each definition according to the size it is. For example, make one called crosshair12, with the tall value beingness 12, another named crosshair14 with the alpine value of 14, all the mode up to 54, which is the highest alpine value that TF2 accepts. This is useful because TF2 doesn't reload ClientScheme.res (or the main menu, for that matter, if y'all're interested) when you type hud_reloadscheme in console, so y'all need to restart the game each time you lot change ClientScheme. By creating lots of font definitions yous can test out new sizes for text boxes without restarting the game.

Irresolute Colour
This time, the roles are reversed. Text crosshairs are easy, and image crosshairs are difficult. To change the color of a text crosshair all you have to do is change the value of "fgcolor". I elaborate on how exactly to change fgcolor beneath under Specific Parameters. For prototype crosshairs, information technology is significantly more difficult: you need to actually edit the .vtf file itself and alter the color in an image editor. This requires VTFedit to convert your .vtf to a .png or any other editable file blazon, then editing it in Photoshop or something similar. More than data on this can be constitute in the department below entitled Creating Your Own Crosshairs.

Changing Position
Shifting the position is equally simple as irresolute the xpos, ypos, and zpos under the control in HudLayout.res. This includes if y'all desire to put your xhair underneath something else, like an outline for the in-game ones. More data on these parameters below under Basic Parameters.

Fixing Cutting Off Problems
Having a trouble with your hud crosshair being cut off? If you are, and so there are three possibilities. I: if you're using an image crosshair, that the file was saved incorrectly in VTFedit. If you fabricated your crosshair yourself this is entirely possible, if you didn't make information technology (and you've seen screenshots of what information technology's supposed to await similar) this isn't the instance. Ii: if you're using a text crosshair, it's possible that the wide and tall values nether your control are too pocket-size, and that the text is being cutting off. This is explained in the image below.

And then, increasing the wide and tall values might fix your problem. The 3rd possibility is but relevant if it'due south a text crosshair and you're using a mac; sometimes fonts get cut off in TF2 on macs: this is due to differences in how the Macintosh and Windows Operating Systems handle fonts and therefore how TF2 expects its fonts to exist handled. It'southward on Valve's stop, and the only solutions are to realign the characters in a font editor or to convert it to an image crosshair. Or, of form, y'all could partition your mac and run both windows and mac os, which I would strongly recommend if you want to play TF2 in a non-casual setting.

3. Parameters

Beneath I will give an explanation of what each parameter under the control does. More experienced users might want to jump to Specific Parameters to skip the basic parameters.

Basic Parameters
These are the basic parameters which are relevant to both image and text crosshairs. I would recommend scrolling back up to cheque the examples above if you're confused at whatever point, to remind yourself what the whole picture looks like.

ControlName
This refers to what blazon of command you lot're creating. To reiterate, control is only a fancy proper name for the bits and pieces of your HUD: each command is just an chemical element or part of the interface that contains text, an paradigm, or any variety of things. There are iii bones types of controls but only two are relevant for the purpose of hud crosshairs.
Labels: These are text boxes. The two basic types are Label and CExLabel.
Panels: Pictures and blocks of color. For our purposes basically just images. The bones types are ImagePanel and EditablePanel.
The 3rd type, which is not relevant for our purposes, is Buttons. These are clickable elements composed of either a text box, and epitome, or both. Buttons are not commonly used to create Crosshairs. The bones types are Push, ImageButton, CExButton, CExImageButton.

FieldName
Elementary, the name of the control. Tin can only incorporate letters and numbers and must be the unique name of the control. If you lot're editing an existing control don't touch this.

Visible
This determines whether the control is drawn. As one would expect, '1' means visible, '0' means invisible.

Enabled
This determines whether the control is even loaded. The deviation between this and visible is that some elements are turned on or off past the game. Disabling these elements ways they're never going to be seen. Making them invisible might hateful that they're seen part of the time. For hud crosshairs the distinction doesn't matter turn either to 0 to make it invisible and one to brand it visible. There is one notable exception which volition be discussed after in the 3D PlayerModel Backgroundsection.

Xpos
This parameter determines the position in the x direction of the left side of the control relative to the parent control. Basically, how far to the right or left. Another fashion of thinking about it is that changing this value moves the crosshair horizontally. For hud crosshairs the parent control is usually simply the hud, in which case the crosshair is positioned relative to the screen. By default the numbers are how far abroad from the left side of the screen. Calculation a 'c' in front means that the control is placed relative to the middle of the screen. Adding an 'r' in front means that the control is positioned relative to the right side of the screen. This parameter accepts negative values, which are flipped around, as you would wait, by calculation an 'r'. Minus values can also be used, past adding "-" earlier the value. Check out this image if you're still dislocated.

Ypos
This parameter determines the position of the acme of the control relative to the parent control in the y direction. In other words, up or downward, or in the vertical direction. By default it is from the pinnacle of the screen. Adding a 'c' as a prefix measures from the heart, an 'r' prefix measures from the bottom of the screen. This parameter accepts negative values, which are, once more, flipped by adding an 'r'.

Zpos
This parameter determines the position of the control in the z-direction, also known as into or out of the lath. More than colloquially, this determines whether or non your crosshair is behind or in front of other stuff, or determines which layer the control is located in. The way this works is that controls are drawn by the game in order from lowest to highest, so the command with the most negative 'Zpos' volition be fatigued first, then the least negative progressively, the least positive, finally the most positive. The college the 'Zpos', the farther forward the control, or the more stuff information technology will be on top of. The lower, the farther away the control, or the more stuff it volition exist below.

Wide/Tall
The width and summit of the control. Text will need to be completely contained inside the control or parts of it may be cut off. For images, this simply resizes the prototype. You lot cannot resize a text crosshair this fashion, you need to change the font definition in ClientScheme.res or reference a different font, more on that bachelor in Resizing. If your crosshair is half-visible, this could be the reason. Putting 'f0' gives you the full screen size.

Specific Parameters

As you can see, this is where more differences beginning to arise in the implementation of epitome crosshairs and text crosshairs.

Text:

Font
This is the name of the font file that you wish to use. The font file should be defined in ClientScheme.res. You check out more about installing fonts by reading our Font Installation guide.

LabelText
This is what the text box will actually say. In our case this means which crosshair in the font file is referenced. For case, here is an image of the crosshairs included in Fog'south Custom Crosshair Pack.

FgColor
This stands for foreground colour and is the color that y'all will see your text every bit. The syntax for this parameter is < R G B A >, with R significant Cherry, Thousand beingness Greenish, B being Blue, and A being Alpha. Blastoff determines how transparent the color is, but it sometimes doesn't office correctly in TF2 for custom crosshair fonts, non sure why. For setting the colors, the accustomed values are whatever integer from aught to ii hundred l five. Each number determines how much of that color is nowadays. So, < 255 0 0 255 > would hateful the text volition exist all ruddy, < 255 255 0 255 > would mean the text would be equal parts cherry and light-green and then would manifest itself as yellow. You don't need to put in whatsoever '<'s, I simply put them in to separate the values from the text. Make sure it is surrounded by parentheses. You can besides but reference the name of a colour which is installed in ClientScheme.res, here's the definition for 'White', which I used in the example, in ClientScheme. Colors are defined at the offset. As y'all can see all colors are defined past the code I explained higher up.

Lawmaking:

Colors
{
"Orangish" "178 82 22 255"
"OrangeDim" "178 82 22 120"
"LightOrange" "188 112 0 128"
"GoalOrange" "255 133 0"
"TFOrange" "145 73 59 255"

"White" "235 235 235 255"
"Red" "192 28 0 140"
"RedSolid" "192 28 0 255"

If you lot're still confused check out this image.

TextAlignment
This parameter has two sets of accepted values: left-right values and upwards-downward values. Get-go off, hither are the left-right values: 'East', which represents alignment to the correct, 'Due west', which represents alignment to the left, and 'Center', which is self explanatory. Now, for the upwardly or downwardly: "Due north" for up, "South for down. Another, simpler way to explain is that this property uses the key directions for values, also as "Left" and "Right". To enter more than one alignment you must utilize the fundamental directions with the vertical alignment starting time, for example "N-West" for elevation left alignment. Basically, think of the text as being inside of a box. The box is what the control creates, more accurately what the control really is, and you ascertain the wide and alpine values for it. Centre would make the text aligned to the heart of the box. W would put information technology on the left side of the box. Due east would put it on the right side of the box. For controls which contain dynamic text such equally your health and ammo, changing the alignment is very useful.

Equally you lot can come across in the images on the right, if yous align the ammo in prune to the Due west (like the top ii images) then it can clash with the ammo in reserve if the amount of ammo loaded changes, for example the medic has forty needles loaded at once while the soldier has four rockets. You can meet the trouble. Aligning the ammo in clip to the e (like the lesser two) fixes the problem, now information technology can't ever clip.

Image:

Alpha
This is the equivalent of the fourth value in fgcolor, if you recall that. If not, information technology's essentially a numerical value for transparency, 0 beingness and so transparent that information technology's invisible and 255 being then 100% visible, not transparent at all.

Prototype
This tells the game where the file that is going to exist loaded is. You simply put the file directory here and the game will look there for a .vmt file named appropriately and will and then load the .vtf referenced by that .vmt.

ScaleImage
Every bit far as I can tell this is either cleaved or doesn't exercise anything, I've never seen any difference when I enabled it or disabled it. Flame's one-time hud guide concurs and Doodle's Hud Guide doesn't mention information technology.

4. Creating your ain Crosshairs

Get-go of all you need to decide if the crosshair y'all want to create is an paradigm or a text crosshair.

This is a distinct reward of image crosshairs, it's significantly easier to create your own. All you need to practise is open up Photoshop, or, if you don't take it, GIMP is a groovy free alternative which I personally employ and would highly recommend. Then simply create your crosshair or open up an prototype of one from another game and save it as a .png or a .jpg.

Here are some useful tips for using GIMP to create a crosshair if you lot don't have feel with the application.

• Showtime, go to file>new to create a new file. You are going to desire your dimensions to be a power of 2 by some other power of ii.
  
  
• I ordinarily use 1024 by 1024 or 512 past 512, a square file is easier to heart regardless of crosshair shape and then I'd advise making it foursquare.
  
• Before y'all hit "OK" go to the arrow virtually "Advanced Options", click it, then get to "Make full With" and select "Transparency" from the drop-down carte.
  
• Now you accept your canvas on which to create your crosshair.
  
• The very nuts are this: create a choice and fill it with a color. To this end, some useful tools are the selection tools, rectangle, ellipse, free select, etc. Here are some tips and tricks to using these tools.
  
• Showtime off, whenever you are using a tool it'south a good idea to have the "Tool Options" window open. If you don't run into it get up to Windows>Dockable Dialogs>Tool Options. This is extremely useful.
  
• For making a circumvolve exist uniform/perfect you can simply set aspect ratio to be one:ane or change the dimensions manually in the same (Tool Options) window. Obviously the same tin can exist used to mess with a rectangular option/make it square.
  
• If you are copying and pasting/editing a pre-existing crosshair an extremely useful tool is the "Select Past Color" tool. It selects all pixels in the image of the color that y'all click on.
  
• For whatever of these pick tools information technology'south useful to be able to subtract or add together to it easily, then take notation of the buttons at the pinnacle of the "Tool Options" window: they change the manner of pick you are currently in, from making a new option to calculation/subtracting/intersecting with the electric current 1. For case, to make a ring you make a circle then change the way to decrease from selection and put a smaller circumvolve inside. In that location are an affluence of GIMP tutorials on the subject field, and a video does it much better than I tin. Another example is that maybe selecting by color didn't become everything you lot hoped it would. Modify to "Add together to Pick" and you tin can easily add together dissimilar shades of the same color which you lot desire to include that weren't picked upward.
  
• Another useful trick for selecting by color is that if in that location is an image and yous want to effectively get rid of a inform background you tin can select the background then striking Edit>Clear to send it to transparent or Select>Capsize to invert the selection, effectively selecting every pixel in the image that is Not the color you selected. The invert selection button is immensely useful in multiple other ways also.
  
• One more useful tool is "Align" to align your selection or layer to the center of the image for the easiest time making a multiple layered image look great. For example, to brand the backgrounds to the health cantankerous I used in my hud here:
  Photo Album for what it looks similar.

  I made a circumvolve selection, went to tool options, changed the size to 300 x 300, went to align tool, eye aligned it, then filled the whole thing with blue or black or whichever. So I made a rectangular selection, made it 75 10 200 ( I recollect, don't quite think), centered it with the align tool. And so I went to edit>clear to ship that rectangle in the middle to transparent. And then I fabricated another rectangular selection, 200 x 75 this time, and center aligned information technology, then "cleared" that ane too. The event satisfies my perfectionistic (is this a discussion?) OCD tendencies.

From here you can either use the VTF photoshop plugin or the GIMP VTF plugin to export to a .vtf file. If you adopt, at that place is also VTFedit. VTFedit is what I'm going to be using in my example and works with any image from either Photoshop or GIMP and then if you lot want me to walk you through it I suggest you get that.

Your next challenge is successfully changing the settings so that your crosshair doesn't await similar shit in game. The method of irresolute your epitome to a .vtf that I'm familiar with is VTFedit, and then that's what I'm going to exist using in my examples. I'm fairly certain both plugins are similar to VTFedit when information technology comes to settings but I'm not certain.

Equally a side note, all of what I'one thousand maxim below nigh VTFedit is applicable to all custom materials, non crosshairs.

VTFedit Settings:

• Hit File>Import
  
• Navigate to the image you created and hit import.
  
• In the "import settings" window you are going to want to change tabs to "General" if y'all aren't already in that location and use the following settings:
  

Import Settings:

Normal Format: DXT5
Alpha Format: DXT5
Texture Type: shouldn't really matter for most, employ "Surround Map" just in case.

Resizing is interesting. VTF files demand to take specific dimensions. They need to be a power of two past a power of 2. Remember to a higher place, when I said to create the new file in GIMP to have a ability of 2 by a ability of 2? 1024 x 1024 or 512 ten 512? This was why. The ideal scenario is that you did as I suggested, in which instance your crosshair will not be distorted at all.
Resize: united nations-tick
Resize Filter: n/a
Sharpen Filter: n/a

If yous used someone else's prototype, or for any reason the dimensions are wrong/not a power of 2 by another power of 2, then you volition want to use these settings beneath.
Resize: Nearest power of 2
Resize Filter: Box
Sharpen Filter: None

Clamp: un-tick
Mipmaps: united nations-tick
Normal Maps: united nations-tick

To confirm, it should look similar this:

Now you are done with Import Settings and tin can hit "OK". The next thing you need to do is to make sure the correct flags are checked nether "Prototype" in the tab to the left. You want the post-obit to be checked (some of them might already be done):

Flag Settings:

point-sample
SRGB
Clamp-s
Clamp-t
no mipmaps
no level of detail
8-chip alpha

Then click on "salvage as" and proper noun information technology whatsoever you wish. The .vtf will eventually need to exist placed incustom/*any folder proper name*/materials/vgui/replay/thumbnails (this is because for whatever reason that file directory is not checked by sv_pure so it will work on whatever server, more than info hither), so you tin salve it there now if y'all wish. At present y'all're done with the .vtf!

Your side by side chore is to create a .vmt file to accompany your .vtf. I The .vmt is just a text certificate that lets the game know how to use the .vtf. Information technology is the vmt file that the game actually looks at, not the .vtf.  personally don't apply VTFedit'southward function to create your own .vmt as I do it by hand but y'all certainly tin can do then if y'all wish. It is nether Tools>Create VMT File. If you utilise it you simply select your saved .vtf as the base texture. If you wish to practice it by paw, simply make a new text document and paste this in:

Code:

"UnlitGeneric"
{
"$translucent" 1
"$basetexture" "vgui\replay\thumbnails\*your file name*"
"$yertexcolor" one
"$no_fullbright" 1
"$ignorez" one
}

For more advanced users: there are many interesting things that can be done with vmts, such as making everything beneath information technology transparent, or making information technology spin or modify colour when you are moving. More info on that can exist institute here. To note: I couldn't personally go the proxy "PlayerDamageTime" to work at all, which is disappointing because if information technology had worked one could create a textile in their hud that would change color or go visible only when the player had crit-heals. I personally was going to make an outline for the wellness cross, or a bar under the wellness, although something almost the crosshair would be cool too. JarateKing, who knows much more almost material proxies than I practise, likewise failed, so that item proxy might not work in TF2, unfortunately.

Hither is an example vmt where the crosshair would rotate, pulse blue, and flash light-green when you are moving:

Lawmaking:

"UnlitGeneric"
{
"$translucent" "one"
"$basetexture" "vgui\replay\thumbnails\crosshair_kent_010"

"$angle" "0.0"
"$translate" "[0.0 0.0]"
"$center" "[0.5 0.5]"

"$color" "[0.0 0.0 0.0]"
"$speed" "0"

"$vertexcolor" "i"
"$no_fullbright" "one"
"$vertexalpha" "one"
"$ignorez" "1"

"Proxies"
{
// Rotates the crosshair
"LinearRamp"
{
"charge per unit" "600" // Accommodate this, college spins faster
"initialValue" "0.0"
"resultVar" "$bending"
}
"TextureTransform"
{
"translateVar" "$interpret"
"rotateVar" "$angle"
"centerVar" "$middle"
"resultVar" "$basetexturetransform"
}

// Makes the crosshair pulse blue
"Sine"
{
"sinemin" "0.3"
"minemax" "0.5"
"sineperiod" "1"
"resultVar" "$color[2]"
}

// Makes the crosshair light up light-green when the player is moving
"PlayerSpeed"
{
"resultVar" "$speed"
}
"Clamp"
{
"min" "0.five"
"max" "1.0"
"srcVar1" "$speed"
"resultVar" "$colour[1]"
}

// Enable animation in the crosshair, set framerate
//"AnimatedTexture"
//{
// "animatedtexturevar" "$basetexture"
// "animatedtextureframenumvar" "$frame"
// "animatedtextureframerate" "30"
//}
}

}

More info on this specific crosshair constitute in the youtube video.

Another example:

More info on this specific vmt including a download link can be found hither.

Here is an example .vmt where it would mask everything below it and make it transparent, which tin be used to make anything in your hud partially transparent, even your viewmodels.

Lawmaking:

"Refract"
{
"%keywords" "tf"
"$refractamount" "0.0"
"$refracttint" "{255 255 255}"
"$refractblur" "0.0"

"$calibration" "[1 i]"
"$normalmap" "vgui/replay/thumbnails/REFRACTnormal"
}

Here is more than information on transparent viewmodels with this method.

The path to create your ain text crosshair is one I confess I personally have never done. I do, nevertheless, empathize the basic concept. What y'all will demand to practice is to create a vector image of the crosshair that you lot want to utilise, the application to use for that is probably Adobe Illustrator, a gratuitous application I have used is Inkscape, which is uniform with GIMP. I wouldn't highly recommend Inkscape but you can easily Google alternatives yourself. Then get your easily on a font editor, FontForge probably beingness the best, although in that location are many other alternatives. Import your vector prototype into your custom font and save it as a .ttf or .otf and voíla. Google will demand to be your friend on this one as I cannot assistance yous much, pitiful.

5. Toggling

Toggling your hud crosshair means turning it on or off at will. Essentially, you could implement it into a crosshair switcher, such as Broesel's or the ane made by TF2mate's config generator. Or yous could but enable information technology for sure classes. The possibilities are only limited by the fact that there are just two ways to brand a hud crosshair visible/invisible at volition, however, at that place is some other method to turn ane on or off by form.

Minmode

This is the "traditional" method to toggle a hud crosshair on or off because it's very piece of cake to alter your hud if you lot already have a hud crosshair to implement this. All that is necessary is to alter the parameters of visible_minmode and enabled_minmode to 0 on ane crosshair and 1 on the other and to change the parameters of visible and enabled to 1 on ane crosshair and 0 on the other. It will look similar this:

Code:

"TextExample"
{
"controlName" "CExLabel"
"fieldName" "TextExample"
"visible" "ane"
"enabled" "one"
"visible_minmode" "one"
"enabled_minmode" "1"
"xpos" "c0"
"ypos" "c0"
"zpos" "0"
"wide" "100"
"tall" "100"

"font" "fogCrosshair"
"labelText" "+"
"fgcolor" "White"
"textAlignment" "heart"
}
"ImageExample"
{
"controlName" "CTFImagePanel"
"fieldName" "ImageExample"
"visible" "i"
"enabled" "1"
"visible_minmode" "1"
"enabled_minmode" "1"
"xpos" "c0"
"ypos" "c0"
"zpos" "0"
"wide" "100"
"alpine" "100"

"blastoff" "255"
"prototype" "replay/thumbnails/*your file name*"
"scaleimage" "ane"
}

In this instance, ImageExample, the image crosshair, would merely exist visible when minmode is on, or, when cl_hud_minmode is set to 1. On the other paw, TextExample, the text crosshair, would only be visible when minmode is off, or, when cl_hud_minmode is set to 0. In this way you tin can use a panel command to plough your crosshair on or off every bit you delight. However, this is the method that I referenced earlier equally beingness by class, meaning I recommend putting the command in your course configs to turn the crosshair on or off based on which class you lot are. The reason is that toggling this control causes in-game stutter, which makes sense: after all, the command is essentially telling the game to reload every unmarried hud file, similar to a hud_reloadscheme.

Accomplishment Tracker

This method is a bit more than complicated, but the concept remains elementary. Basically, TF2 has the capacity to brandish information virtually your progress on an in-game achievement of your choice, and you can toggle this feature on or off with a panel control. To use this with a crosshair all you demand to practice is edit the file that controls the panel that tracks an achievement. Essentially y'all remove the parts apropos achievements and replace them with your crosshair, which is now independent in a command which is toggleable with the console command hud_achievement_tracker (1 for on, 0 for off, as is standard).

You're going to want to replace the contents of your HudAchievementTrackerItem.res with this:

Code:

"Resources/UI/HudAchievementTrackerItem.res"
{

//crosshair showtime

//crosshair finish

  "HudAchievementTrackerItem"
{
"ControlName"   "EditablePanel"
"fieldName"     "HudAchievementTrackerItem"
"xpos"          "0"
"ypos"          "0"
"zpos"          "999"
"wide"          "f0"
"tall"          "480"
"visible"       "0"
"enabled"       "1"

      "PaintBackgroundType"   "2"
}

  "AchievementName"
{
"ControlName"   "Label"
"fieldName"     "AchievementName"
"labeltext"     ""
"xpos"          "9999"
"ypos"          "9999"
"wide"          "170"
"tall"          "10"
"zpos"          "four"
"textinsetx"    "v"
"font"          "AchievementTracker_Name"
"textAlignment"     "northward-w"
}

  "AchievementNameGlow"
{
"ControlName"   "Label"
"fieldName"     "AchievementNameGlow"
"labeltext"     ""
"xpos"          "9999"
"ypos"          "9999"
"wide"          "170"
"tall"          "10"
"zpos"          "4"
"fgcolor_override"      "235 226 202 255"
"font"          "AchievementTracker_NameGlow"
"textinsetx"    "5"
"textAlignment"     "north-westward"
}

  "AchievementDesc"
{
"ControlName"   "Label"
"fieldName"     "AchievementDesc"
"labeltext"     ""
"xpos"          "9999"
"ypos"          "9999"
"broad"          "120"
"tall"          "xviii"
"zpos"          "four"
"textinsetx"    "5"
"fgcolor_override"      "235 226 202 255"
"font"          "AchievementTracker_Desc"
"wrap"          "i"
"TextAlignment"     "north-due west"
}

  "ProgressBarBG"
{
"ControlName"       "ImagePanel"
"fieldName"     "ProgressBarBG"
"xpos"      "9999"
"ypos"      "9999"
"broad"      "100"
"alpine"      "6"
"fillcolor"  "250 234 201 51"
"zpos"          "4"
"visible"       "i"
"enabled"       "1"
}

  "ProgressBar" // electric current completed
{
"ControlName"   "ImagePanel"
"fieldName"     "ProgressBar"
"xpos"          "9999"
"ypos"          "9999"
"broad"          "0"
"tall"          "half-dozen"
"fillcolor"     "251 235 202 255"
"zpos"          "v"
"visible"       "1"
"enabled"       "1"
}
}

and ctrl+f for and replace the data about HudAchievementTracker in HudLayout.res with this:

Lawmaking:

"HudAchievementTracker"
{
"ControlName"   "EditablePanel"
"fieldName"             "HudAchievementTracker"
"xpos"                  "0"
"NormalY"               "0"
"EngineerY"             "0"
"wide"                  "f0"
"tall"                  "480"
"visible"               "one"
"enabled"               "1"
"zpos"                  "1"
}

Then merely paste the control for your crosshair into the section in the offset link entitled "crosshair". More information tin exist constitute at this link.

3D PlayerModel Background

This method is fairly simple but a lot of users have troubles with it for whatever reason. Basically: Valve added a feature to utilize, instead of the default class epitome, a dynamic and three dimensional player model complete with accurate weapons, hats, and running/swimming postures. Due to functioning issues, Valve added a panel control to toggle the feature on or off. By replacing the background that accompanies, by default, this feature, with our ain image crosshair, we can so toggle the crosshair on or off at will. I would recommend only using this method if you can live without the 3D model. If you lot exercise wish to use it, all that is necessary to practice this is to supplant the post-obit control in HudPlayerClass.res with your crosshair.

Then, using my previous example image crosshair, it would expect something like this:

Lawmaking:

"classmodelpanelBG"
{
"ControlName" "CTFImagePanel"
"fieldName" "classmodelpanelBG"
"visible" "0"
"enabled" "1"
"visible_minmode" "0"
"enabled_minmode" "1"
"xpos" "c0"
"ypos" "c0"
"zpos" "0"
"wide" "100"
"tall" "100"
"alpha" "255"
"paradigm" "replay/thumbnails/*your file name*"
"scaleimage" "1"
}

The only thing to be careful about is that yous have visible set to 0 and enabled gear up to 1. As explained under their corresponding sections nether Basic Parameters, this ensures that you tin can really turn it off or on. If enabled and visible are both set to 0 your crosshair will never show upwardly because information technology volition never be loaded by the hud. If both are set up to ane and so the crosshair will always be visible and you won't be able to truly 'toggle' it on and off.

Another affair you may want to do is scroll down a trivial bit in HudPlayerClass.res and change xpos to "9999" under "classmodelpanel". This will move the actual 3d model off the screen so it doesn't plow on and off too. This way but your crosshair will be visible.

In-Game Epitome Crosshair

It turns out, past using the panel, that you can actually reference one of your images that yous've saved to the directory "materials/vgui/replay/thumbnails" as an in-game crosshair. That is, it's possible to "trick" the game into using your image instead of a default crosshair. This allows you to change it using the "options" window (or console commands) to control color and size. Yous cannot, nevertheless, switch between your new custom crosshair and other default ones.

All you need to do to use this method if you so desire is to make sure the .vtf and the accompanying .vmt are correctly created and placed and and then blazon in console the following:

Code:

cl_crosshair_file ../replay/thumbnails/*crosshair name*

Make sure to replace *crosshair name* with the name of your file and double-check that you accept set the .vmt file correctly. The simply other weird restriction is that, although it will work on servers with sv_pure set to 2, yous need to load it up in a server with sv_pure set to 0 showtime. All this means is that some servers restrict the usage of custom textures and so yous should click the "create new server" button on your main menu right after you start TF2 then copy paste the command in console after you've joined the map. Every bit soon as you've done this you're good to join whatever server and your crosshair should remain, at which bespeak y'all tin can modify the color with console commands or a crosshair switching script. You could arrive bigger and red for your melee and smaller and red for your primary, for example, or have it change to a different colour for every direction that you lot motion like stabby does.

vi. Postnotes

The caption images were all created using the font "Novecento" every bit an example, this is the font that Garm3n introduced in his Rex, 8MD, VIP, and KTC HUDS and their variants. It was popularized in yAhud, created past whayay, and information technology is a free font so I feel no qualms near using it in these diagrams.

The HUD I was using to create the caption images is the default HUD, so if things look different and you're confused by some aspect of your custom HUD or its code, that could be the cause.

If y'all're still confused about anything feel gratuitous to send me a individual message through teamfortress.television set or add me on steam, I'd be happy to help walk you through anything else.

Credits

This guide was written by Komorebi, whose initial middle-school allonym was Han Brolo. He likewise gives thanks to CollyCat, Magma, Pwny_, omnibombulator, Lange, Mana and Putter for diverse aid with the guide.

As far as usage of this guide goes: use it however/whenever you wish! Please experience to mail corrections if I've made a mistake or suggest improvements that could be made.

How To Add Crosshair To Hud Tf2,

Source: https://huds.tf/site/s-In-Depth-HUD-Crosshair-Guide

Posted by: murraycallather.blogspot.com

Share this post