Game Development Community

dev|Pro Game Development Curriculum

Plastic Gem #40: Custom Editor Menus

by Anthony Rosenbaum · 08/15/2008 (7:54 am) · 3 comments

Download Code File


i936.photobucket.com/albums/ad202/vincismurf/banner.jpg



Custom Editor Menus

Difficulty: Easy


This resource is design to show you how to add new sections to the menus for the TGE and TGEA in game editors. Note that TGE and TGEA has different approaches for creating menus GUIs so be sure to follow the section that applies to your engine. I have restarted the numbering for each engine.

TGE

We will add a new menu section called Plastic which will have two command in it separated by a separator

1) In a creatoreditorEditorGui.cs within function EditorGui::init(%this) add after
EditorMenuBar.addMenuItem("Window", "Terrain Texture Painter", 9, "", 1);


// > pg plasticMenu
   EditorMenuBar.addMenu("Plastic", 9);
   EditorMenuBar.addMenuItem("Plastic", "Command1", 1, "Ctrl-Alt 1", 1);
   EditorMenuBar.addMenuItem("Plastic", "-", 0);
   EditorMenuBar.addMenuItem("Plastic", " Command2", 2, "Ctrl-Alt 2", 1);
// < pg plasticMenu

The addmenu() method creates a new division in the menu bar called plastic and associates an ID for this division. The AddMenuItem method allow you to choose which section you want the new item to be placed in, provide text for the item and even provide a key bind for the command.

As you select an item from the menu the EditorMenuBar's onMenuItemSelect() method will be called. The parameters of this method are:

EditorMenuBar::onMenuItemSelect(%this, %menuId, %menu, %itemId, %item)

We can have several ways of determining which menu you selected. The default behavior of the function looks at %menu value in a switch statement, and then splits the execution to menu specific functions, we will do the same.

2) Add a new case to onMenuItem select after the "camera" section.


// > pg plasticMenu
      case "Plastic":
         %this.onPlasticMenuItemSelect(%itemId, %item);
   // < pg plasticMenu

The onPlasticMenuItemSelect() receives the selection values for the particular menu and uses a switch statement to execute the appropriate function.

3) Add after the function EditorMenuBar::onCameraMenuItemSelect


> pg plasticmenu
function EditorMenuBar::onPlasticMenuItemSelect(%this, %itemId, %item)
{
   switch$(%item)
   {
         case " Command1":
messageboxok("Plastic Menu Item", "Command 1 executed", "");
         case " Command2":
messageboxok("Plastic Menu Item", "Command 2 executed", "");
      default:
         echo("nothing on Plastic Menu for" SPC %item );
   }
}
// < pg plasticMenu

There you have it, save, load a mission and go into the editor, you will have a new Menu at your disposal. If you click the item a message box should appear informing you which command you executed. Try the binds, good stuff huh.

On to . . . .

TGEA

With a new engine comes a new way of doing things, which can be a good thing. In the case of TGEA, menus can be cascading, believe me this can be very useful when you get deep into tool development. In this example we will make a Plastic menu section with two items, one of the items will have a sub menu of two items.

We will start by creating the submenu for the menu item, by creating a PopupMenu() GUI and storing it within EditorGui's plasticSubMenu property.

1) In toolsmissionEditorscriptsmenus.ed.cs add this section at the top of the file


// > pg submenus
function EditorGui::buildMenusPlasticSubMenus(%this)
{
   // > pg plastic duplication speedmenu
   %this.plasticSubMenu = new PopupMenu()
   {
      superClass = "MenuBuilder";
      class = "EditorPlasticSubMenu";

      item[0] = "SubMenuItem1" TAB " Ctrl-Alt 1" TAB "MessageBoxOK("Plastic Menu", "Sub Menu 1", "");"
      item[1] = " SubMenuItem2" TAB " Ctrl-Alt 2" TAB "MessageBoxOK("Plastic Menu", "Sub Menu 2", "");";
   };
}
// < pg submenus

Now to create our submenus by calling buildMenusPlasticSubMenus in the function EditorGui::buildMenus

2) Add to EditorGui::buildMenus() before %this.menuBar = new MenuBar()


// > pg submenu
 %this.buildMenusPlasticSubMenus();
 // < pg submenu

That is just part of what we will be adding to buildMenus(). Below within the block for the new MenuBar we will create our plastic menu section and associate our submenu to one of the items.

3) In buildMenus() after the Lighting menu block


// > pg plastic menu
      new PopupMenu()
      {
         superClass = "MenuBuilder";
         class = "EditorPlasticMenu";
         barTitle = "Plastic";
         item[0] = "Section1" TAB %this.plasticSubMenu;
         item[1] = "-";
         item[2] = "Item 2" TAB " Ctrl-Alt 3" TAB "MessageBoxOK("Plastic Menu", "Menu Item 2", "");";      };
      // < pg


There you have it, now you have an interface into the TGEA editor menus. Like before selecting these items will show a message box.


The Next Gem

We will allow the GuiHealthBarHud to show a numerical value for one's health, similar to Halflife.

#1
08/15/2008 (9:24 am)
Coool
#2
08/21/2008 (8:21 am)
Thanks for posting this, I worked at the TGEA version for a while until I got it to work.

The trick seems to be adding a semicolon to the end of the first "item" statement in the function:

item[0] = "SubmenuItem1" TAB... ... Menu 1\", \"\");"; <-- add line termination here

as shown in the first code box above.

Otherwise, it will print all the palettes out at the right of the screen, neatly stacked, and not print the menu bar.

"Give me five lines of script in a man's hand, and I will find ten ways to hang myself with it."
#3
05/10/2009 (9:23 pm)
TGB??