Adding Your Logo to the Menu: Difference between revisions
TSGAMEMING (talk | contribs) No edit summary |
No edit summary |
||
(10 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
{{ | {{LanguageBar|title = Adding your logo to the menu}} | ||
[[File:Gamelogo.jpg|thumb|TF2's logo (in the original version shown here) is 512x128px.]] | |||
Instead of displaying your mod's name as a string of characters, you can have a logo image. To do this: | |||
# Add <code>gamelogo 1</code> to the top of [[gameinfo.txt]] (same block as <code>game</code>, <code>type</code>, etc.). | |||
# Create <code><mod>\resource\GameLogo.res</code>, a text file, with this template: | |||
<source lang=ini> | |||
Resource/GameLogo.res | |||
{ | |||
GameLogo | |||
{ | |||
ControlName EditablePanel | |||
fieldName GameLogo | |||
xpos 0 | |||
ypos 0 | |||
zpos 0 | |||
wide 256 // Right - left | |||
tall 128 // Bottom - top | |||
autoResize 1 | |||
pinCorner 0 | |||
visible 1 | |||
enabled 1 | |||
offsetX 0 // X-axis position | |||
offsetY 0 // Y-axis position | |||
} | |||
Logo | |||
{ | |||
ControlName ImagePanel | |||
fieldName Logo | |||
xpos 0 // -Left | |||
ypos -64 // -Top | |||
zpos 0 | |||
wide 256 // Scaled VTF width | |||
tall 256 // Scaled VTF height | |||
visible 1 | |||
enabled 1 | |||
image ui_logo | |||
scaleImage 1 | |||
} | |||
} | |||
</source> | |||
The path of the <code>image</code> field is relative to <code>materials\'''vgui\'''</code>. As you can see in the example above, the TF2 logo is actually stored in <code>materials\logo\</code>! | |||
Do not include a file extension in the path. | |||
{{tip|Removing your text from the gameinfo.txt under the name '''title''' will remove the font title and will only provide the logo.}} | |||
{{tip|When [[Creating a Material|creating your logo]], use the [[UnlitGeneric]] shader, do not generate mipmaps for the texture, and disable LOD.}} | |||
{{tip|If your game logo has an alpha channel (transparency) then add <code>"$alphatest" "1"</code> to your game logo's .vmt otherwise it'll look opaque in-game.}} | |||
Draft of some documentation: | |||
* GameLogo width and height seems to define the "bitmap size" the logo is drawn on | |||
* Logo width and height seems to define the actual draw size of the logo. | |||
* GameLogo xpos and ypos doesn't seem to do anything. | |||
* GameLogo offsetX and offsetY will move the "bitmap" around. | |||
* Logo xpos and ypos seems to set the topleft position of the logo being drawn in the bitmap. | |||
* The drawn logo has its bottom aligned to the top of the menu items, when offset X and offset Y are 0. Applying the offsets will move it around. | |||
* The logo doesn't scale with the UI. The GameLogo/wide and tall measures are in absolute pixels, as well as offsetX and offsetY. | |||
So if Logo width/height is larger than GameLogo width/height, the image will be cropped. Negative values let you crop the top and left of the logo. With the width and height of GameLogo, you could crop the right and bottom. | |||
The idea here is to create your logo inside a VTF, which needs to follow the VTF aspect ratio and size rules. Then you use Logo width and height to scale the VTF, and GameLogo to crop it how you want it. | |||
[[Category:Modding]] | [[Category:Modding]] | ||
[[Category:Material System]] | [[Category:Material System]] |
Latest revision as of 06:06, 9 August 2025
Instead of displaying your mod's name as a string of characters, you can have a logo image. To do this:
- Add
gamelogo 1
to the top of gameinfo.txt (same block asgame
,type
, etc.). - Create
<mod>\resource\GameLogo.res
, a text file, with this template:
Resource/GameLogo.res
{
GameLogo
{
ControlName EditablePanel
fieldName GameLogo
xpos 0
ypos 0
zpos 0
wide 256 // Right - left
tall 128 // Bottom - top
autoResize 1
pinCorner 0
visible 1
enabled 1
offsetX 0 // X-axis position
offsetY 0 // Y-axis position
}
Logo
{
ControlName ImagePanel
fieldName Logo
xpos 0 // -Left
ypos -64 // -Top
zpos 0
wide 256 // Scaled VTF width
tall 256 // Scaled VTF height
visible 1
enabled 1
image ui_logo
scaleImage 1
}
}
The path of the image
field is relative to materials\vgui\
. As you can see in the example above, the TF2 logo is actually stored in materials\logo\
!
Do not include a file extension in the path.



"$alphatest" "1"
to your game logo's .vmt otherwise it'll look opaque in-game.
Draft of some documentation:
- GameLogo width and height seems to define the "bitmap size" the logo is drawn on
- Logo width and height seems to define the actual draw size of the logo.
- GameLogo xpos and ypos doesn't seem to do anything.
- GameLogo offsetX and offsetY will move the "bitmap" around.
- Logo xpos and ypos seems to set the topleft position of the logo being drawn in the bitmap.
- The drawn logo has its bottom aligned to the top of the menu items, when offset X and offset Y are 0. Applying the offsets will move it around.
- The logo doesn't scale with the UI. The GameLogo/wide and tall measures are in absolute pixels, as well as offsetX and offsetY.
So if Logo width/height is larger than GameLogo width/height, the image will be cropped. Negative values let you crop the top and left of the logo. With the width and height of GameLogo, you could crop the right and bottom.
The idea here is to create your logo inside a VTF, which needs to follow the VTF aspect ratio and size rules. Then you use Logo width and height to scale the VTF, and GameLogo to crop it how you want it.