Connecting Unity and UI State and collections
Connecting Unity and UI

State and collections

Model engine-to-UI state with properties, nested DTOs, snapshot collections, and reactive collections.

State is any public property on your bridge that the UI should render.

C#
public int Coins { get; set; }
public string CurrentScreen { get; set; } = "MainMenu";

Assigning a state property pushes the new value to the UI.

Nested state

Use classes for grouped state that should update per field:

C#
public sealed class PlayerState
{
    public string Name { get; set; } = "";
    public int Health { get; set; }
}

public PlayerState Player { get; set; } = new();

Initialize nested state before Loom starts. A nested state object that is null during registration cannot be walked until you assign the parent again.

Snapshot collections

Arrays, List<T>, and Dictionary<K,V> use snapshot semantics. Reassign the whole collection to push a new value:

C#
Items = new List<ItemState>(Items) { newItem };

In-place mutation does not call the property setter:

C#
Items.Add(newItem); // Does not sync by itself.

Use snapshots for small lists or values that naturally update as a whole.

Texture2D, Sprite, and RenderTexture references are also supported in state and inside collections. Render them with LoomImage; see Unity image sources.

Reactive collections

Use ReactiveList<T> or ReactiveMap<K,V> when the UI needs granular changes:

C#
public ReactiveList<QuestState> Quests { get; } = new();

Reactive collections are better for lists or maps that change frequently while preserving item identity.

UI usage

The generated TypeScript state uses camelCase names:

TSX
const bridge = useBridge();

bridge.currentScreen;
bridge.player.health;
bridge.quests;

Run Tools > Loom > Regenerate Types after changing the C# state shape.

Loom documentation

Search docs

Esc

Type a word or phrase to search the documentation.

Type a word or phrase to search the documentation.