Dusty

Basic knowledge and values for UI coding and menus. Based off Affinity's original guide. Hopefully it will be helpful to you. menuDef: name - this is the name you use when referring to the menu through commands such as "open" or "close", not the actual name of the .menu file fullScreen - The main menu has to be fullscreen, other menus can open as a small window. rect - sets the position and the resolution of the menu. If fullScreen is set to 1, it should be always set to 0 0 640 480. An item's rectangle gets drawn starting with the top left corner going downward and to the right. visible - defines the visibility of the menu. Better set it to 1. focusColor - sets the color of the item that is in focus (= in contact with the mouse). desc... - the description-text that appears when you hover over the buttons (usually located at the bottom of the menu). descX, descY - the positioning of the desc-text. descScale - the size of the desc-text. descColor - the color of the desc-text. descAlignment - the alignment of the desc-text. Itemdef The Background (for example the Star Wars-logo on the top): name - sets the name of the item. Can be important if you want to open or focus items. group - you can refer to a group of items by name saying "hide (groupname) ;" or "show (groupname) ;" to have a whole bunch of items operate/be controlled as one style - defines the style of the item. WINDOW_STYLE_EMPTY no background WINDOW_STYLE_FILLED filled with background color WINDOW_STYLE_GRADIENT gradient bar based on background color WINDOW_STYLE_SHADER gradient bar based on background color WINDOW_STYLE_TEAMCOLOR team color WINDOW_STYLE_CINEMATIC cinematic rect - the position and the resolution of the item. An item's rectangle gets drawn starting with the top left corner going downward and to the right (further explanation in the end of the tutorial.) background - the path of the background-image. Can also be a path to a shader-file. DOES NOT NEED a file extension like .jpg or .tga forecolor - the fore color used in the item. 0 0 0 0; each 0 except the last represents a color, see below. visible - defines the visibility of the item, if 1 the item shows by default on loading the menu, if 0 you must manually show the item but it will not show by default decoration - makes you not touching and picking the item with the mouse. The Button (for example the Loadgame-button) Pretty similar to the background-items. You can actually also use an image to be a button. But in JK:JA there are only text-buttons used. text - the path to the text-string (@MENUS_YES for example, use these for multi-language support), or you can write text in " " marks (i.e. "Bla bla bla") descText - the path to the description text-string, works the same as text font - the font used for the text (1-4). textscale - the size of the text; but be forewarned; with values besides 1 as text alignment algorithms don't work as well textaligny, textalignx - changes the position of the text relative to the rect of the menu item, so if the menu item starts at x = 100 and you put 100 here, the text will start at 200 textalign - the alignment of the text; see alignment styles below for more info textstyle - there are different textstyles, like shadowed text, blinking; values are 0-2 IIRC type - important command that can be used to implement listboxes, checkboxes, etc. ITEM_TYPE_TEXT simple text, this will highlight though when the mouse hovers over it even though you can't click it like a button, make this a decoration if you don't want that to happen ITEM_TYPE_BUTTON button, basically text with a border, however it has an action block (see below) ITEM_TYPE_RADIOBUTTON toggle button, may be grouped ITEM_TYPE_CHECKBOX check box ITEM_TYPE_EDITFIELD editable text that is loaded to a cvar ITEM_TYPE_COMBO drop down list //DOES NOT WORK IN JA ITEM_TYPE_LISTBOX scrollable list, this takes a few extra parameters I don't remember right now (elementheight, elementwidth are two of them I believe, check raven's .menu files to see how they do them) ITEM_TYPE_MODEL model, used for model viewers like the custom character screen I believe ITEM_TYPE_OWNERDRAW owner draw, name specs what it is; this is CODED, use this if you have a hardcoded menu item you want to refer to ITEM_TYPE_NUMERICFIELD editable text, associated with a cvar; probably only takes numbers ITEM_TYPE_SLIDER mouse speed, volume, etc.; takes something like sliderwidth, sliderheight, and some other values I believe ITEM_TYPE_YESNO yes no cvar setting, text for the menu item will display automatically as Yes/No ITEM_TYPE_MULTI multiple list setting, enumerated, click/right-click to cycle back and forth ITEM_TYPE_BIND binds the cvar to the chosen key ITEM_TYPE_TEXTSCROLL scrolls text, use this to make scrollable text boxes ITEM_TYPE_INTSLIDER mouse speed, volume, etc.; needs parameters for width, height, and scale like an ITEM_TYPE_LISTBOX, check Raven's files to see what they are, I don't remember off the top of my head The "on" commands Only used in the menuDef: onOpen - stuff that happens when the menu gets opened onEsc - stuff that happens when the menu gets closed Events used in the itemDefs: (these execute commands shown below) Action - gets executed when you click on the item. For example a new menu opens. mouseEnter - gets executed when you touch the item with the mouse. mouseExit - gets exectued when you leave the item with the mouse. doubleclick - gets executed when you doubleclick the item. - commands you can use are show, hide, open, close, and exec: (separate consecutive commands with a ; symbol) show - shows the named menu item or group of items hide - hide the named menu item or group of items open - use this to open a menu (make sure you close the existing menu first unless you want the new menu to open on top of the existing one!); i.e. "open ingame_setup" close - closes the named menu; a useful command I often use is "close all" which closes all menus currently open before I open a new menu play - plays the sound file path you give exec - probably one of THE most powerful commands you can use; allows you to execute a chain of commands as if you typed them into the console; i.e. " exec "helpusobi 1; g_gravity 100" ", use " " and ; for chains of commands just like a normal .cfg script Remember! Always put a semi-colon ( ; ) after each command except the last one inside braces or you may get weird bugs sometimes. Rect The rect-command works like this: rect X Y W H X = horizontal position Y = vertical position W = width H = height An item's rectangle gets drawn starting with the top left corner going downward and to the right, so keep that in mind when choosing height, width, and position! Colors The colors work like this: color R G B T Values go from 0 to 1, with 1 being the highest, and 0 being the lowest. Set to 1 1 1 1 to get a white color. R = red G = green B = blue T = transparency ; 1 is completely non-transparent whereas 0 is invisible Text Alignment Text alignment has 3 styles: ITEM_ALIGN_RIGHT - This lines up the beginning of the text with the rect of the menu item, so the text will start at the item's x position example - [TEXT ], [LONGTEXT] (TEXT or LONGTEXT (longtext just shows how a bigger/longer line of text compares to a smaller one) is whatever the menu item's text/string is, whereas the [ ] represents the menu item's interaction rectangle or rect) ITEM_ALIGN_LEFT - This shifts the text to the left of the menu item so that where the text ends, the rect of the menu item starts example - TEXT[ ] , LONGTEXT[ ] ITEM_ALIGN_CENTER - This centers the text half-way between aligning to the left or the right, so about half of the text will be inside the rect and about half will be on the left side outside the rect. example - TE[XT], LONG[TEXT]