Adding Your Logo to the Menu

From Valve Developer Community
Revision as of 06:08, 21 June 2008 by Noxter (talk | contribs) (→‎Steps)
Jump to navigation Jump to search

In this tutorial, you will be taught how to add your own custom logo (or anything you'd like) to the Main Menu in a Half-Life 2 Single Player modification. This should work for any type of mod you chose.

Techniques Used:

  • Create a custom panel
  • Centering a panel
  • Making a transparent image show on a panel

Known Bugs:

  • When viewing a dialog (such as the Options dialog) the image will not fade to black.

Шаги

Откройте солюшен Game_Sdk в VS.NET (только для Visual Studio .NET 2003).

Под папкой "Source Files", создайте новый .cpp файл. Назовем этот файл "vgui_Panel_Top.cpp".

В основном мы сделаем "невидимую панель" которую мы сможем расположить где угодно в меню. Логотипом можна сделать любую картинку.

Ниже указан исходный код который должен местить ваш "vgui_Panel_Top.cpp" файл :

vgui_Panel_Top.cpp

#include "cbase.h"
#include "vgui_Panel_Top.h"
#include "vgui_controls/Frame.h"
#include <vgui/ISurface.h>
#include <vgui/IVGui.h>

using namespace vgui;

// memdbgon must be the last include file in a .cpp file!!!
#include "tier0/memdbgon.h"

//-----------------------------------------------------------------------------
// Purpose: Displays the logo panel
//-----------------------------------------------------------------------------
class CTopPanel : public vgui::EditablePanel
{
	typedef vgui::EditablePanel BaseClass;

public:
	CTopPanel( vgui::VPANEL parent );
	~CTopPanel();

	virtual void ApplySchemeSettings( vgui::IScheme *pScheme )
	{
		
		BaseClass::ApplySchemeSettings( pScheme );
	}

	// We want the panel background image to be square, not rounded.
	virtual void PaintBackground()
	{
		SetPaintBackgroundType( 0 );
		BaseClass::PaintBackground();
	}

private:
	
};
//-----------------------------------------------------------------------------
// Purpose: Constructor
//-----------------------------------------------------------------------------
CTopPanel::CTopPanel( vgui::VPANEL parent ) : BaseClass( NULL, "CTopPanel" )
{
	
	SetParent( parent );
	SetProportional( true );
	SetVisible( true );
	ActivateBuildMode();       // Activate build mode until we finish setting it up.
	SetScheme("ClientScheme");

	// Size of the panel, since your logo is a VTF, you should set this (width,height) to the proper dimensions
	SetSize(256,128);

	// Loading the .res file.
	LoadControlSettings( "resource/UI/TopPanel.res" );

	vgui::ivgui()->AddTickSignal( GetVPanel(), 100 );

	// center the image and move it down
	int wide, tall;
	GetSize( wide, tall );
	SetPos( ( ScreenWidth() - wide ) / 2, 140 ); // SetPos(width from left, height from top)
}


//-----------------------------------------------------------------------------
// Purpose: Destructor
//-----------------------------------------------------------------------------
CTopPanel::~CTopPanel()
{
}

// Class
class CTop : public ITop
{
private:
	CTopPanel *TopPanel;
	vgui::VPANEL m_hParent;

public:
	CTop( void )
	{
		TopPanel = NULL;
	}

	void Create( vgui::VPANEL parent )
	{
		// Create immediately
		TopPanel = new CTopPanel(parent);
	}

	void Destroy( void )
	{
		if ( TopPanel )
		{
			TopPanel->SetParent( (vgui::Panel *)NULL );
			delete TopPanel;
		}
	}

};

static CTop g_Top;
ITop *Top = ( ITop * )&g_Top;

Alright, so here we have created our Top class. If you compile and run it now, nothing will happen. This is because we need to Create it.

Open up vgui_int.cpp (same folder, Source Files).

Add an include for your panel.

vgui_int.cpp

#include "vgui_Panel_Top.h"

Scroll down to where the function VGui_CreateGlobalPanels is. Now, somewhere in there, add this:

vgui_int.cpp

// Custom Panel
VPANEL GameUiDll = enginevgui->GetPanel( PANEL_GAMEUIDLL);
Top->Create( GameUiDll );

Example:

vgui_int.cpp

void VGui_CreateGlobalPanels( void )
{
	VPANEL gameParent = enginevgui->GetPanel( PANEL_CLIENTDLL );
	VPANEL toolParent = enginevgui->GetPanel( PANEL_TOOLS );

	// console->Create( parent );
	// Part of game
	textmessage->Create( gameParent );
	internalCenterPrint->Create( gameParent );
	loadingdisc->Create( gameParent );
	messagechars->Create( gameParent );

	// Custom Panel
	VPANEL GameUiDll = enginevgui->GetPanel( PANEL_GAMEUIDLL);
	Top->Create( GameUiDll );

	// Debugging or related tool
	fps->Create( toolParent );
	netgraphpanel->Create( toolParent );
	debugoverlaypanel->Create( toolParent );
}

Сдесь мы говорим VGUI создать эту группу при запуске игры.

Далее, после строк VGui_Shutdown(). Добавте это где-нибудь:

vgui_int.cpp

Top->Destroy();

This is to make sure to clean up the panel when starting a game and whatnot.

Next, navigate to the Header Files folder. Create a new .h file, vgui_Panel_Top.h. It should contain:

vgui_Panel_Top.h

#include <vgui/VGUI.h>

namespace vgui
{
	class Panel;
}

class ITop
{
public:
	virtual void		Create( vgui::VPANEL parent ) = 0;
	virtual void		Destroy( void ) = 0;
};

extern ITop *Top;

Here we have our Create and Destroy function references so we can call them from vgui_int.cpp. If you are new to creating panels, the extern ITop *Top; line tells the code to define "Top" to call our panel; remember the Top->Create( GameUiDll ); from vgui_int.cpp.

OK, the coding is finished. Now we need to create a res file. Navigate to your SourceMods/your_mod/resource/ui folder. Create a new .res file, and name it TopPanel.res.

Put this in for now:

TopPanel.res

"resource/UI/TopPanel.res"
{
	"CTopPanel"
	{
		"ControlName"		"EditablePanel"
		"fieldName"		"CTopPanel"
		"xpos"		"192"
		"ypos"		"70"
		"wide"		"256"
		"tall"		"128"
		"autoResize"		"0"
		"pinCorner"		"0"
		"visible"		"1"
		"enabled"		"1"
		"tabPosition"		"0"
	}
	"ImagePanelLogo"
	{
		"ControlName"		"ImagePanel"
		"fieldName"		"ImagePanelLogo"
		"xpos"		"0"
		"ypos"		"0"
		"wide"		"256"
		"tall"		"128"
		"autoResize"		"0"
		"pinCorner"		"0"
		"visible"		"1"
		"enabled"		"1"
		"tabPosition"		"0"
		"image"		"logo"
		"scaleImage"		"0"
	}
}

As you can see, there is an ImagePanel here. If you read it, the "image" parameter is set to "logo". This is important: Your logo must be a VTF file and must have a VMT file located in the materials/vgui folder. You don't need to have the extension because Source is smart that way.

Use vtex to convert your TGA file to a VTF file (remember, width and height must be powers of 2). Put the VTF file where you want and put the VMT into the materials/vgui folder. Your .res file's "image" parameter points to the VMT. Open up the VMT file and make sure the $baseTexture points to your VTF file (wherever it's located). Example:

logo.vmt

"UnlitGeneric"
{
	"$baseTexture" "vgui/logo"
	"$vertexcolor" 1
	"$vertexalpha" 1
	"$ignorez" 1
	"$no_fullbright" "1"
	"$nolod" "1"
}

The VTF must be somewhere in the materials folder.

To have transparency in your TGA, set the background transparent and use 32-bit/pixel, vtex will then make your logo have a transparent background.

Now, compile and run your mod. In the center of the screen there should be your logo. The VGUI Build Mode Panel should also be visible. You can customize the panel to your needs and then comment out ActivateBuildMode(); in your code (vgui_Panel_Top.cpp).

Notes

If you want to change the name of the panel for easier reference (such as LogoPanel) just replace wherever the word "Top" appears with the word "Logo" including your .cpp and .h files.