User Interface Editor – Arma 2

From Bohemia Interactive Community
Revision as of 13:27, 23 February 2020 by Lou Montana (talk | contribs) (Lou Montana moved page User Interface Editor (Arma 2) to Arma 2: User Interface Editor: (Arma 2) → Arma 2:)
Jump to navigation Jump to search

Installation

Download GUI editor

Download Preview Mission


Copy file stra_gui.pbo into your Arma 2 or Arma 2: OA addons folder.

Running

Place Functions module and during game, execute following code: 

[] call BIS_fnc_GUIeditor;

First steps

  • GUI Editor is transferring data to and from game by copying to clipboard. To load some interface, simply copy it (Ctrl + C) and import it in game using Ctrl + L.
  • Same way, when exporting, result is again copied to clipboard and you can paste it using Ctrl+V anywhere you need.
  • When GUI Editor is started, it automatically tries to load content from clipboard.
  • Custom params (Ctrl + RMB) are params which are exported, but their effects cannot be seen in editor itself.
    • If you define some param which is already set by classic editing (idc, text, position ...), custom param will have larger priority.

Controls

LMB

  • Click and hold over GUI element - Move element
  • Ctrl - Align to grid
  • Alt - Modify size
  • Alt + Shift - Modify size with constant proportions

RMB

  • Click on GUI element - Modify element parameters
  • Ctrl + Click on GUI element - Modify custom element parameters (changes won't be visible)
  • Click on free space - Add a new element

Key Shortcuts

  • H - Help
  • G - Show/hide grid
  • Ctrl + G - Modify grid parameters
  • Alt + G - Create grid on element under cursor
  • Shift + G - Toggle between Absolute and Safezone grid
  • Ctrl + N - Add a new element
  • Delete - Delete a current element
  • Ctrl + C - Copy a current element
  • Ctrl + X - Cut a current element
  • Ctrl + V - Paste a copied element
  • Ctrl + Z - Undo
  • Shift + Ctrl + Z - Redo
  • Ctrl + S - Clipboard Export to GUI editor format
  • Alt + Ctrl + S - Clipboard Export to GUI editor format with linebreaks
  • Shift + Ctrl + S - Clipboard Export to a config format
  • Shift + Ctrl + S + (1-9) - Clipboard Export to a config format with given number of tabs (1-9)
  • Ctrl + L - Clipboard Import from GUI editor format
  • Ctrl + P - Clipboard Export parent classes
  • Shift + Ctrl + P - Clipboard Export grid proportions
  • Ctrl + I - Import from config
  • Space - Highlights all elements (including invisible ones)

Position types

Following variants determine in what format the element position will be saved

  • Absolute - absolute position, remains same no matter what UI size or aspect ratio is.
  • Safezone - GUI elements stretches based both on UI width and height. Result may differ on different aspect ratios.
  • Grid - Position is calculated as multiplier of grid parameters.


Control Panels

  • Workspace

    Workspace

  • Edit Element

    Edit Element

  • Edit Element Custom Params

    Edit Element Custom Params

  • Exported Dialog

    Exported Dialog


Export

Editor format

Ctrl + S

Starts with dollar symbol ($). When you copy this format to clipboard, it can be loaded in editor using Ctrl+L 

$[1.03,[["safezoneX","safezoneY","safezoneW","safezoneH"],"safezoneW / 32","safezoneH / 20"],[1000,"",[1,"",["0.3125 * safezoneW + safezoneX","0.35 * safezoneH + safezoneY","0.375 * safezoneW","0.3 * safezoneH"],[-1,-1,-1,-1],[0,0,0,0.5],[-1,-1,-1,-1],""],[]],[1001,"MyHeader",[1,"Hello World",["0.3125 * safezoneW + safezoneX","0.35 * safezoneH + safezoneY","0.375 * safezoneW","0.05 * safezoneH"],[-1,-1,-1,-1],[0,0,0,0.5],[-1,-1,-1,-1],""],["style = ST_CENTER;"]],[1400,"MyEditbox",[1,"",["0.328125 * safezoneW + safezoneX","0.425 * safezoneH + safezoneY","0.34375 * safezoneW","0.15 * safezoneH"],[-1,-1,-1,-1],[-1,-1,-1,-1],[-1,-1,-1,-1],""],["idc = 1234;"]],[1700,"MyButtonOK",[1,"Ok",["0.53125 * safezoneW + safezoneX","0.575 * safezoneH + safezoneY","0.140625 * safezoneW","0.1 * safezoneH"],[-1,-1,-1,-1],[-1,-1,-1,-1],[-1,-1,-1,-1],""],["onButtonClick = |hint ctrltext ((ctrlParent (_this select 0)) displayCtrl 1234);|;"]],[1701,"MyButtonBack",[1,"Cancel",["0.328125 * safezoneW + safezoneX","0.575 * safezoneH + safezoneY","0.140625 * safezoneW","0.1 * safezoneH"],[-1,-1,-1,-1],[-1,-1,-1,-1],[-1,-1,-1,-1],""],["onButtonClick = |((ctrlParent (_this select 0)) closeDisplay 3000);|;"]]]

Editor format (multi-line)

Alt + Ctrl + S

Ready to be included into config or description file. 

/*
$[
	1.03,
	[["safezoneX","safezoneY","safezoneW","safezoneH"],"safezoneW / 32","safezoneH / 20"],
	[1000,"",[1,"",["0.3125 * safezoneW + safezoneX","0.35 * safezoneH + safezoneY","0.375 * safezoneW","0.3 * safezoneH"],[-1,-1,-1,-1],[0,0,0,0.5],[-1,-1,-1,-1],""],[]],
	[1001,"MyHeader",[1,"Hello World",["0.3125 * safezoneW + safezoneX","0.35 * safezoneH + safezoneY","0.375 * safezoneW","0.05 * safezoneH"],[-1,-1,-1,-1],[0,0,0,0.5],[-1,-1,-1,-1],""],["style = ST_CENTER;"]],
	[1400,"MyEditbox",[1,"",["0.328125 * safezoneW + safezoneX","0.425 * safezoneH + safezoneY","0.34375 * safezoneW","0.15 * safezoneH"],[-1,-1,-1,-1],[-1,-1,-1,-1],[-1,-1,-1,-1],""],["idc = 1234;"]],
	[1700,"MyButtonOK",[1,"Ok",["0.53125 * safezoneW + safezoneX","0.575 * safezoneH + safezoneY","0.140625 * safezoneW","0.1 * safezoneH"],[-1,-1,-1,-1],[-1,-1,-1,-1],[-1,-1,-1,-1],""],["onButtonClick = |hint ctrltext ((ctrlParent (_this select 0)) displayCtrl 1234);|;"]],
	[1701,"MyButtonBack",[1,"Cancel",["0.328125 * safezoneW + safezoneX","0.575 * safezoneH + safezoneY","0.140625 * safezoneW","0.1 * safezoneH"],[-1,-1,-1,-1],[-1,-1,-1,-1],[-1,-1,-1,-1],""],["onButtonClick = |((ctrlParent (_this select 0)) closeDisplay 3000);|;"]]
]
*/

Config format

Shift + Ctrl + S 

class RscText_1000: RscText
{
	idc = 1000;
	x = 0.3125 * safezoneW + safezoneX;
	y = 0.35 * safezoneH + safezoneY;
	w = 0.375 * safezoneW;
	h = 0.3 * safezoneH;
	colorBackground[] = {0,0,0,0.5};
};
class MyHeader: RscText
{
	style = ST_CENTER;

	idc = 1001;
	text = "Hello World";
	x = 0.3125 * safezoneW + safezoneX;
	y = 0.35 * safezoneH + safezoneY;
	w = 0.375 * safezoneW;
	h = 0.05 * safezoneH;
	colorBackground[] = {0,0,0,0.5};
};
class MyEditbox: RscEdit
{
	idc = 1234;

	x = 0.328125 * safezoneW + safezoneX;
	y = 0.425 * safezoneH + safezoneY;
	w = 0.34375 * safezoneW;
	h = 0.15 * safezoneH;
};
class MyButtonOK: RscShortcutButton
{
	onButtonClick = "hint ctrltext ((ctrlParent (_this select 0)) displayCtrl 1234);";

	idc = 1700;
	text = "Ok";
	x = 0.53125 * safezoneW + safezoneX;
	y = 0.575 * safezoneH + safezoneY;
	w = 0.140625 * safezoneW;
	h = 0.1 * safezoneH;
};
class MyButtonBack: RscShortcutButton
{
	onButtonClick = "((ctrlParent (_this select 0)) closeDisplay 3000);";

	idc = 1701;
	text = "Cancel";
	x = 0.328125 * safezoneW + safezoneX;
	y = 0.575 * safezoneH + safezoneY;
	w = 0.140625 * safezoneW;
	h = 0.1 * safezoneH;
};

Disclaimer

This is not an offical addon released or approved by Bohemia Interactive or any of ARMA 2 publishers. Use at your own risk.

As long as it stays free, you can redistribute it or modify it as you wish.

Retrieved from "https://community.bistudio.com/wiki?title=Arma_2:_User_Interface_Editor&oldid=148691"