This is an old revision of the document!
Goal: make a button visibly react to hover.
Choose Create Animated Button.
Set the visible text and action.
Keep the animation subtle.
Test the result in Arma.
Tutorial: Dropdown With Options
Goal: let the user choose one value from a controlled list.
Choose Create Dropdown.
Enter options one per line.
Use stable data when possible.
Give the combo a positive IDC.
Populate rows on onLoad.
Read selected data on Apply.
Tutorial: Apply / Reset / Cancel Dialog
Goal: build a predictable dialog where the user can edit values safely before committing them.
Create a panel layout.
Add input controls.
Examples: edit fields for text/numbers, combos for controlled choices, checkboxes for binary settings, listboxes for larger selections.
Add Apply / Reset / Cancel buttons.
Apply means validate and commit.
Reset means restore UI values.
Cancel means close or discard pending local state.
Route all buttons into a function.
Example: ['apply', _this] call TAG_fnc_dialogAction.
Why: one dispatcher function can handle all dialog commands consistently.
In SQF, read values by IDC.
Validate before applying.
Examples: numeric range checks, class existence checks, object locality, selected row data, map position validity.
Apply changes only after validation succeeds.
Tutorial: Map Selector
Goal: let the user choose a world position from a map control.
Choose Create Map Selector.
Position the map area.
Use a click event to capture screen position.
Convert with ctrlMapScreenToWorld.
Validate the selected position.
Why: spawning, teleporting, targeting, and artillery-style actions can break gameplay if the point is invalid or unauthorized.
Tutorial: HUD / Turret Optics Overlay
Goal: create a readable overlay for a gunner, camera, sensor, or turret view.
Choose HUD / Turret Optics.
Add a reticle first.
Add range ladder, heading/compass tape, weapon status, sensor mode, and lock cues.
Use transparent backgrounds by default.
Why: optics must be readable over terrain, sky, smoke, thermal imagery, and night vision.
Use backing plates only where readability needs them.
Test in the target vehicle/turret camera.
Why: browser preview cannot reproduce FOV, camera shake, optics post-processing, thermal contrast, or game UI scaling.
Export And Addon Integration
Copy or download the generated HPP.
Include it from your addon config.cpp or UI include file.
Confirm all inherited base classes exist where the HPP is included.
Register lifecycle and action functions in CfgFunctions.
Keep static panels, frames, labels, and pictures in controlsBackground.
Keep interactive controls in controls.
Check IDD and IDC collisions.
Pack the addon.
Open the display in game.
Review the RPT for config and script errors.
Common Problems
The display opens but buttons do nothing: the action function probably is not registered or the event string points at the wrong tag/function.
A control cannot be found by SQF: it may have idc = -1, a duplicate IDC, or a define mismatch.
A picture does not show in game: the texture path may be wrong, the file may not be packed, or the image may need conversion to PAA.
Layout looks wrong in game: safezone/UI scale/aspect ratio differs from the browser preview.
Dropdown labels work but behavior is wrong: SQF may be reading visible text instead of stable row data.
Multiplayer action works locally but not for other players: the button runs on the local client and needs a validated remote/server path.
Pre-Pack Checklist
Display class is included from the intended config root.
IDD does not collide with another display.
Positive IDC values are unique within the display.
Static controls use idc = -1 unless SQF reads them.
onLoad publishes the display to uiNamespace.
onUnload clears the display reference.
Button/event strings call registered functions.
Lists, combos, and trees store stable row data.
Texture paths exist in the packed addon.
Layout is checked at 16:9, 16:10, 21:9, and narrow windowed ratios.
MP-sensitive actions validate locality and authority outside the UI layer.