UI Editor
All 2D interface in AR Clip (HUDs, menus, buttons, labels) is a card, laid out like a normal interface in front of the 3D view. That is what keeps text crisp at any distance and on any screen.
How cards behave at runtime is in UI cards; this page is about building one.
Opening it
Four ways in, all leading to the same full-screen editor:
- the Scene UI button in the left rail — opens the active scene's interface, creating it if there is none;
- scene settings, in the UI section;
- an object's UI component, via Edit layout;
- a UI file in your project assets.
The editor is collaborative, and has Apply and Close.
You do not have to create one; just open it and start.
Attaching a card to something
A card is a file, and a UI component attaches it to an object:
| Setting | Options |
|---|---|
| UI resource | which card |
| Mode | Overlay (full screen) or Anchored (pinned to an object) |
| Anchor X / Y | which corner or edge sits on the object — anchored only |
| Enabled | show it or not |
| Keep variables | values survive moving between scenes |
A card on a scene is always an overlay. A card on an object can be either.
It stays the size you designed and hides when its object goes behind the camera. If you want something that scales with distance, use 3D text instead.
Connecting UI to your scene
Three ways, in increasing order of power.
Built-in actions — the card changes itself: switch screens, set a variable, run a timer. Anything purely about the interface should stay here.
Scene steps — the engine's steps are offered directly in the editor as actions with proper parameters: go to a scene, open a URL, play an animation. This is how a button drives your scene without any code.
Named actions plus logic — give an action an id, then react to it. An object's Events component has a UI-action trigger (leave the id empty to catch any action), and a script can listen directly:
const ui = ctx.getDivKit(entity);
ui.set('score', (v) => v + 1);
ui.subscribe('lives', (v) => {});
ui.onAction('restart', () => {});
The reverse, treating card variables as where the truth lives, falls apart the moment you need that value somewhere else, because card variables are not shared between participants and reset on reload.
Next: Space settings