GUI/Buttons/Invisible Buttons

From TDN

Introduction

This little guide will give you a solution to creating buttons that have no background or border, and appear as text. Similar to what you find in Half-Life 2's main menu.

Setup

If you want to use a unique font for the main menu, but want to remain with a readable font for the options and other areas, you will need to place a new font and define it correctly as described in the Using New Fonts article.

The next step will be to define the font in the customprofiles.cs of your mod folder. The profile that is used as a base is the default button profile.

// NORMAL BUTTONS
if(!isObject(GuiButtonProfile)) new GuiControlProfile (GuiButtonProfile)
{
   opaque = true;
   border = true;
   // fontColor = "7 9 169";
   fontColor = "255 255 255";
   fontColorHL = "100 100 100";
   fillColor = "232 232 232";
   fixedExtent = true;
   justify = "center";
	canKeyFocus = false;
};

Duplicate this profile and rename the profile from GuiButtonProfile to GuiMenuButtonProfile since this is for the mainmenu; this needs to be done on both names. It should result in the following:

// MENU BUTTONS
if(!isObject(GuiMenuButtonProfile)) new GuiControlProfile (GuiMenuButtonProfile)


Defining the button

Two key variables are needed to make the button transparent; border and fillColor. Set Border to false, set the alpha value of the fillColor to 0 resulting in "232 232 232 0". You will result in a borderless and transparent button. Use fontType to link your new font in and voila.

// MENU BUTTONS
if(!isObject(GuiMenuButtonProfile)) new GuiControlProfile (GuiMenuButtonProfile)
{
   opaque = true;
   fontColor = "255 255 255";
   fontColorHL = "100 100 100";
   fillColor = "232 232 232 0";
   fixedExtent = true;
   justify = "center";
	canKeyFocus = false;
   border = false;

// font
   fontType = "Libel Suit";
   fontSize = 25;
   fontCharset = CHINESEBIG5;
};

Select your profile from the profile list in the GUI editor and you should get this:

new GuiButtonCtrl(Quit) {
      Profile = "GuiMenuButtonProfile";
      HorizSizing = "center";
      VertSizing = "top";
      position = "265 413";
      Extent = "110 20";
      MinExtent = "8 8";
      Visible = "1";
      Command = "quit();";
      text = "Quit";
      groupNum = "-1";
      buttonType = "PushButton";
         helpTag = "0";
   };