Understanding the Inspector UI¶
Jungle replaces the default Inspector with a visual system designed for composing behaviors. Instead of writing code to wire up a speed source or a trigger, you click a button, pick from a categorized menu, and configure the result - all inside the Inspector.
Every Jungle-powered component uses the same visual language, so once you learn it in one place, you can read it everywhere.
What it looks like in practice:
- A "Speed" field shows "Float Value" - click it, switch to "Random Float", and the field now shows a Min and a Max instead of a single number
- A "Conditions" list lets you add distance checks, capacity limits, or tag filters by picking them from a popup menu
- Sections and tabs keep complex components organized without scrolling through walls of fields
- A section. Click its bar to fold it.
- A field with a type picked. Click the pill to change it.
- An empty field. Click (None) or the round button to pick a type.
TypeSelectableField¶
The TypeSelectableField is the core building block. Whenever a component has a field that can be one of many types (a value source, a process, a condition), it renders as a TypeSelectableField.
Anatomy¶
A TypeSelectableField has three parts:
- Type selector button - Displays the currently selected type name. Click it to open the Class Selection popup and choose a different behavior.
- Foldout body - Expand to see the configuration fields specific to the selected type.
- Help toggle - When available, shows a plain-language description of what the selected type does.
Interaction¶
- Click the type name (the pill) to open the selection popup
- Click the foldout arrow to expand or collapse the type's properties
- Right-click for context menu options (copy, paste, reset)
Visual Styles¶
TypeSelectableField supports three visual styles, configurable globally via Project Settings > Jungle > Field Style:
| Style | Description |
|---|---|
| Pill (default) | Subtle rounded badge, no border |
| Underline | Type name with a bottom border only |
| Classic | Full input-field look, like Unity's object fields |
Changing the visual style
Open Edit > Project Settings, find the Jungle section, and pick a Field Style. The change applies globally to all Jungle components.
Type Icons¶
When enabled in Project Settings > Jungle, a small icon appears next to each type name in selectable fields, list headers, Monitor sections, and the Timeline window. The icon is the one set by the type's JungleClassInfo attribute.
Turn it off if you prefer a cleaner look or if the icons are not meaningful for your project.
Number Fields¶
Drag a number field's name left or right to change its value by a fixed step for each pixel you move. Hover the name to see the step, shown as a small badge such as ±0.01.
- Middle-click the field to try the next step: 0.001, 0.01, 0.1, 1, 10, 100 for decimals, and 1, 5, 10, 50, 100 for whole numbers.
- Shift + press and hold the field to open a ladder of every step under it. Move up or down to pick a step, then left or right to change the value. Release to close it. The step you end on stays for the next drag.
- The first step follows the value's size, so small decimals start with a small step and large ones with a large step. Whole numbers start at 1.
- Click the number to type a value, as usual.
This works on every number in a Jungle component or graph, including each X, Y and Z of a vector.
JungleList¶
When a field is a list of polymorphic types (e.g., a list of conditions or a list of modifiers), Jungle renders it as a JungleList instead of Unity's default ReorderableList.
Features¶
- Add button — Opens the type picker to add a new element of a selected type
- Remove button — Delete individual elements
- Drag reorder — Grab the handle to reorder elements by dragging
- Per-element foldout — Each element is a TypeSelectableField with its own expand/collapse
- The add button opens the type picker; the number is the element count.
Toggle Set Mode¶
Some lists use Toggle Set rendering. Instead of a growable list with an add button, the Inspector shows one row per possible type. Each row has a toggle:
- Checked — The type is active; its properties render inline
- Unchecked — The type is inactive; the row collapses to a single line
Toggle sets are used when each type should appear at most once (e.g., a set of optional modifiers where you either enable or disable each one).
UniqueTypes
Toggle set mode implies UniqueTypes — the list enforces that no two elements share the same concrete type. Regular JungleLists can also use UniqueTypes without toggle set rendering, in which case the add button simply hides types already present.
Sections and Tabs¶
Jungle components with many fields use section attributes to organize the Inspector into logical groups.
SectionAttribute¶
Groups fields under a collapsible header. Sections can be nested via SubsectionAttribute for finer organization.
[Section] Main Section Header
├── Field A
├── Field B
│ [Subsection] Subsection Header
│ ├── Field C
│ └── Field D
└── Field E
TabSectionAttribute¶
Renders fields as horizontal tabs. Only one tab is visible at a time, keeping the Inspector compact even for components with many settings.
- Sections fold open and closed.
- Tabs show one group of fields at a time.
AutoSectionedEditor
Jungle's custom editor base class (AutoSectionedEditor) reads these attributes automatically and generates the sectioned layout. You do not need to write custom editor code to get organized Inspectors — just annotate your fields.
Decorators¶
Jungle extends Inspector rendering with decorators — additional visual overlays attached to managed reference fields.
| Decorator | What It Does |
|---|---|
| ValueDisplayDecorator | Shows the current runtime value next to a value provider field (e.g., "Position: (1.2, 3.4, 5.6)") |
| DebugGizmoDecorator | Draws scene gizmos based on the field's current value (e.g., position markers, direction arrows) |
| LocalValueAutoResolveDecorator | Automatically resolves value providers to local components on instantiation, so fields work out of the box without manual assignment |
Decorators activate automatically when applicable. You do not need to configure them manually.