Creating a Team-Menu

From Valve Developer Community
Revision as of 09:53, 25 September 2007 by So.Suddenly (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

[originally from sourcewiki.org]

The Source SDK already has most of the code you will need for a team menu, but not everything. Valve must want us to learn by filling in the gaps. ;)

My goal in this first step is to enable a team-selection menu, using the available code as much as possible. I do not implement actual teamplay at this time; it's just the VGUI menu without underlying game logic.

Creating the Viewport

First you should take a look at the VGUI2 Overview. You will learn that the base for all VGUI panels (not class-based, but where VGUI-objects are attached) is a viewport. This viewport is created in cl_dll/sdk/clientmode_sdk.pre in the method ClientModeSDKNormal::InitViewport: 

void ClientModeSDKNormal::InitViewport()
{
  m_pViewport = new SDKViewport();
  m_pViewport->Start( gameuifuncs, gameeventmanager );
}

I wrote this just for information, so you know, where the voodoo begins - you don't need to change anything here :)

Creating the panel

Let's take a look at the CBaseViewport, which handles all the different Panels used by the mod. It is defined in cl_dll/game_controls/vgui_TeamFortressViewport.pre.

This function creates all panels known to this viewport: 

void CBaseViewport::CreateDefaultPanels( void )
{
  AddNewPanel( CreatePanelByName( PANEL_SCOREBOARD ) );
  AddNewPanel( CreatePanelByName( PANEL_INFO ) );
  AddNewPanel( CreatePanelByName( PANEL_SPECGUI ) );
  AddNewPanel( CreatePanelByName( PANEL_SPECMENU ) );
  // AddNewPanel( CreatePanelByName( PANEL_TEAM ) );
  // AddNewPanel( CreatePanelByName( PANEL_CLASS ) );
  // AddNewPanel( CreatePanelByName( PANEL_BUY ) );
}

Since you want to get the team menu, remove the comment before PANEL_TEAM.

The "real" creation is done in CBaseViewport::CreatePanelByName, a function which takes the panelname as string and creates a corresponding class. The panel names are referenced in game_shared/viewport_panel_names.h, e.g. 

#define PANEL_TEAM "team"

PANEL_TEAM creates the class CTeamMenu, which contains all the functionality of that panel and is implemented in game_controls/teammenu.pre. So uncomment that, too. 

  else if ( Q_strcmp(PANEL_TEAM, szPanelName) == 0 )
  {
    newpanel = new CTeamMenu( this );
  }

Implementing the Menu

The class CTeamMenu is nearly functional; the only thing missing is the function which handles the messages created by the panel. Open game_controls/teammenu.h to add the declaration of the new function OnCommand to the class. Find 

// command callbacks

and add 

 void OnCommand( const char *command );

Then add the implementation in game_controls/teammenu.pre: 

void CTeamMenu::OnCommand( const char *command )
{
  if ( Q_stricmp( command, "vguicancel" ) )
  {
    engine->ClientCmd( const_cast<char *>( command ) );
  }
  Close();
  gViewPortInterface->ShowBackGround( false );
  BaseClass::OnCommand(command);
}

You don't see anything done here with the commands. They are passed to the baseclass where hopefully they will be employed in a useful manner, but that is beyond the scope of this tutorial.

Another thing you need to modify: Remove (comment) any lines containing "m_pMapInfo", since you don't need nor create it for that panel. Also remove the line "LoadMapPage( m_szMapName );", because there's no need to get the mapinfo, if it is not displayed.

Defining the layout

The layout and contents of your panel can be defined solely by a resource file. If you don't need to do customized things (e.g. displaying gamemode-dependent buttons or map information), you won't require any more to complete your menu.

Most resources are missing in the Source SDK; the team menu resource is no exception. You need to create one yourself (or copy from any cache-file), the standard path would be <modname>/multimod/resource/ui/Teammenu.res. I think the format is self-explanatory, and you find an example on the right.

It defines one panel (team), one label (joinTeam) and five buttons (jointeam1, jointeam2, jointeam3, autojoin, CancelButton) The interesting part in the button-definition is "Command", because this defines, which command the client executes, if he presses that button.

You don't need to edit the file by hand. Valve included a nice tool with which you may change it ingame, as mentioned in VGUI2 Overview (again). Just press SHIFT+CTRL+ALT+B to open the VGUI Build-Mode editor:


http://www.valve-erc.com/srcsdk/VGUI2/vgui2_4.jpg 

"Resource/UI/TeamMenu.res"
{
 "team"
{
 "ControlName"  "CTeamMenu"
 "fieldName"  "team"
 "xpos"  "100"
 "ypos"  "60"
 "wide"  "240"
 "tall"  "290"
 "autoResize"  "0"
 "pinCorner"  "0"
 "visible"  "1"
 "enabled"  "1"
 "tabPosition"  "0"
 "settitlebarvisible"  "0"
 "title"  "#Frame_Untitled"
}
"joinTeam"
{
 "ControlName"  "Label"
 "fieldName"  "joinTeam"
 "xpos"  "20"
 "ypos"  "20"
 "wide"  "200"
 "tall"  "30"
 "autoResize"  "0"
 "pinCorner"  "0"
 "visible"  "1"
 "enabled"  "1"
 "tabPosition"  "0"
 "labelText"  "#TM_Join_Team"
 "textAlignment"  "center"
 "dulltext"  "0"
 "brighttext"  "0"
 "font"  "MenuTitle"
 "wrap"  "0"
}
"jointeam1"
{
 "ControlName"  "Button"
 "fieldName"  "jointeam1"
 "xpos"  "20"
 "ypos"  "60"
 "wide"  "200"
 "tall"  "30"
 "autoResize"  "0"
 "pinCorner"  "2"
 "visible"  "1"
 "enabled"  "1"
 "tabPosition"  "3"
 "labelText"  "#TM_Join_Team_1"
 "textAlignment"  "west"
 "dulltext"  "0"
 "brighttext"  "0"
 "wrap"  "0"
 "Command"  "jointeam 1"
 "Default"  "0"
}
"jointeam2"
{
 "ControlName"  "Button"
 "fieldName"  "jointeam2"
 "xpos"  "20"
 "ypos"  "100"
 "wide"  "200"
 "tall"  "30"
 "autoResize"  "0"
 "pinCorner"  "2"
 "visible"  "1"
 "enabled"  "1"
 "tabPosition"  "4"
 "labelText"  "#TM_Join_Team_2"
 "textAlignment"  "west"
 "dulltext"  "0"
 "brighttext"  "0"
 "wrap"  "0"
 "Command"  "jointeam 2"
 "Default"  "0"
}
"jointeam3"
{
 "ControlName"  "Button"
 "fieldName"  "jointeam3"
 "xpos"  "20"
 "ypos"  "140"
 "wide"  "200"
 "tall"  "30"
 "autoResize"  "0"
 "pinCorner"  "2"
 "visible"  "1"
 "enabled"  "1"
 "tabPosition"  "5"
 "labelText"  "#TM_Join_Team_3"
 "textAlignment"  "west"
 "dulltext"  "0"
 "brighttext"  "0"
 "wrap"  "0"
 "Command"  "jointeam 3"
 "Default"  "0"
}
"autojoin"
{
 "ControlName"  "Button"
 "fieldName"  "autojoin"
 "xpos"  "20"
 "ypos"  "180"
 "wide"  "200"
 "tall"  "30"
 "autoResize"  "0"
 "pinCorner"  "2"
 "visible"  "1"
 "enabled"  "1"
 "tabPosition"  "1"
 "labelText"  "#TM_Auto_Join"
 "textAlignment"  "west"
 "dulltext"  "0"
 "brighttext"  "0"
 "wrap"  "0"
 "Command"  "jointeam 0"
 "Default"  "0"
}
"CancelButton"
{
 "ControlName"  "Button"
 "fieldName"  "CancelButton"
 "xpos"  "20"
 "ypos"  "240"
 "wide"  "200"
 "tall"  "30"
 "autoResize"  "0"
 "pinCorner"  "2"
 "visible"  "1"
 "enabled"  "1"
 "tabPosition"  "0"
 "labelText"  "#TM_Cancel"
 "textAlignment"  "center"
 "dulltext"  "0"
 "brighttext"  "0"
 "wrap"  "0"
 "Command"  "vguicancel"
 "Default"  "1"
}
}

Displaying the menu

The only thing missing to show the menu is a command, which invokes it. cl_dll/game_controls/vgui_TeamFortressViewport.pre already implements a function to show any panel (e.g. "showpanel team" in the console) 

CON_COMMAND( showpanel, "Shows a viewport panel <name>" )

but a teamselection-command is no big deal: 

CON_COMMAND( chooseteam, "Opens a menu for teamchoose" )
{
 if ( !gViewPortInterface )
  return;
 gViewPortInterface->ShowPanel( "team", true );
}

If you use use the command "chooseteam" in the console, this code will be executed and if the viewport was created successfully, it will show the menu.

Localization

Unlike written in the VGUI2 Overview, the translation file is not loaded automatically. Here's a statement about that from the coding-list: 

If you are loading the game via the parameters:

-game "c:\absolutepathto\moddir"

The localization file will not load.  This is because the '<moddir>_' prefix
is loaded from the -game parameter.  This is a bug in the engine, and I have
reported it.  I am told that this is being fixed.

If you wish to temporarilly get around this, copy your mod into
SteamApps/<username>/half-life 2/<moddir> and run HL2 with

-game moddir

That is - run it without any qoutes, and use the relative folder name.. the
same way as you would have loaded a HL1 mod.

For now you need to load the file yourself, for example in the viewport-constructor. Look into cl_dll\game_controls\vgui_TeamFortressViewport.pre and find "CBaseViewport::CBaseViewport". Then add the AddFile-function after "SetProportional": 

CBaseViewport::CBaseViewport() : vgui::EditablePanel( NULL, "CBaseViewport")
{
 gViewPortInterface = this;
 ...
 ...
 SetProportional( true );

 vgui::localize()->AddFile( vgui::filesystem(), "resource/<modname>_%language%.txt" );
 ...
}

Finally the translation file itself, resource/<modname>_%language%.txt. Be sure you save it as unicode. 

"lang"
{
 "Language" "English"
 "Tokens"
 {
  "TM_Join_Team"     "Choose a team"
  "TM_Join_Team_1"   "Join team 1"
  "TM_Join_Team_2"   "Join team 2"
  "TM_Join_Team_3"   "Join team 3"
  "TM_Auto_Join"     "Auto-select"
  "TM_Cancel"        "Cancel teamchoice"
 }
}

If you take a look back at TeamMenu.res, you'll find labeltexts beginning with a '#'. Such labels are replaced by their counterpart in the translation-file, only without the '#'. For example #TM_Join_Team will be replaced with "Choose a team", if your steamlanguage is set to english. For other languages you need to create additional files, like <modname>_german, <modname>_french.txt, etc.

Retrieved from "https://developer.valvesoftware.com/w/index.php?title=Creating_a_Team-Menu&oldid=59470"