Fretta Derma Panel

From GMod Wiki

Go to: Fretta Articles

Overview

The Fretta Game Base uses its own basic VGUI system to make nice looking panels in gamemodes. Examples include the team selection and splash screens that appear in any game that uses Fretta. But if you want to create your own, there are a series of functions and hooks at your disposal to create such a panel. Because Fretta uses Derma elements to create this panel, it's very customizable. However, the panel must be created from a table, because it's not an official VGUI object.

Usage

Here's the team menu created using Fretta's Derma Panel:

 
local TeamPanel = nil
 
function GM:ShowTeam()
 
	if ( !IsValid( TeamPanel ) ) then 
 
		TeamPanel = vgui.CreateFromTable( vgui_Splash )
		TeamPanel:SetHeaderText( "Choose Team" )
 
		local AllTeams = team.GetAllTeams()
		for ID, TeamInfo in SortedPairs ( AllTeams ) do
 
			if ( ID != TEAM_CONNECTING && ID != TEAM_UNASSIGNED && ( ID != TEAM_SPECTATOR || GAMEMODE.AllowSpectating ) ) then
 
				if ( ID == TEAM_SPECTATOR ) then
					TeamPanel:AddSpacer( 10 )
				end
 
				local strName = TeamInfo.Name
				local func = function() RunConsoleCommand( "changeteam", ID ) end
 
				local btn = TeamPanel:AddSelectButton( strName, func )
				btn.m_colBackground = TeamInfo.Color
				btn.Think = function( self ) 
								self:SetText( Format( "%s (%i)", strName, team.NumPlayers( ID ) ))
								self:SetDisabled( GAMEMODE:TeamHasEnoughPlayers( ID ) ) 
							end
 
				if (  IsValid( LocalPlayer() ) && LocalPlayer():Team() == ID ) then
					btn:SetDisabled( true )
				end
 
			end
 
		end
 
		TeamPanel:AddCancelButton()
 
	end
 
	TeamPanel:MakePopup()
 
end
 

In order to create the panel, you first define a variable to include it in, such as TeamPanel in the example above. The panel must be drawn in a function, then its elements must be added, and must finally be made to pop up.

How-To

The example above is somewhat complex and might be difficult to understand, but explains how the functions are used very well. Now I'll break the code down and create a buy menu for my gamemode.

First, I begin by defining the variable to store the panel in:

 
local BuyMenu = nil
 

Notice that I've set it to nil. This is so that the menu is not recognized and its elements are added properly in a logical order. Next we add the function to draw the panel:

 
function GM:ShowBuyMenu()
 

When this function is run client-side, it will draw my panel, once I'm done coding it, of course. Now I'm going to add a line that checks to see if my panel exists yet.

 
	if ( !IsValid( BuyMenu ) ) then
 

This checks to see if BuyMenu is a valid variable. It isn't when it's first defined, so I can set its properties up. Now I'm going to create the panel and give it a nice header:

 
		BuyMenu = vgui.CreateFromTable( vgui_Splash )
		BuyMenu:SetHeaderText( "Buy Menu" )
 

These lines create the buy menu as a Fretta Derma Panel and also set its header (the text displayed at the top of the panel) to Buy Menu. Now I want to set the text on the side to something that explains what this panel does.

 
		BuyMenu:SetHoverText( "Buy all your weapons and items here." )
 

Now along the right side of the panel, it will explain what it does. The hover text can be set to anything and can also be retrieved using GetHoverText(). But what good is a menu without some buttons?

 
		local function1 = function() LocalPlayer():Give( "weapon_shotgun" ) end
		local Button = BuyMenu:AddSelectButton( "Shotgun", function1 )
		Button.m_colBackground = Color(255, 90, 90, 255)
 

This will add a button that when pressed will give the player a shotgun, but what if they need some ammo for it? We'll add another button that's disabled if the player doesn't have a shotgun, but gives the player some shotgun ammo when pressed.

 
		local function2 = function() LocalPlayer():GiveAmmo( 30, "buckshot" ) end
		local Button2 = BuyMenu:AddSelectButton( "Shotgun Ammo", function2 )
		Button2.m_colBackground = Color(255, 90, 90, 255)
 
		Button2.Think = function( self )
			self:SetDisabled( !LocalPlayer():HasWeapon( "weapon_shotgun" ) )
		end
 

This one is a little more complex. Instead of just being active all the time, if the player does not have a shotgun, it will be disabled. The player will need a shotgun before he can buy shotgun ammo. Now that we have our buttons, we need to add a cancel button in case we don't want to buy anything, and finally we need to make the whole thing appear.

 
		BuyMenu:AddCancelButton()
 

That's really all there is to adding a cancel button. The panel will take care of the rest. But now we want to make the panel pop up when the function is run, so we'll add a final few lines.

 
	end // We need to close that previous if statement
 
	BuyMenu:MakePopup()
end // Close the whole thing
 

And that's all there is to it. You might want to hook it to a console command so that players can get to it easily. The panel needs to be in a client-side file to run correctly, so be careful where you put it.