Skip to content

Getting Started with Editor

This guide demonstrates using the Astra editor for scene creation and entity manipulation.

Enabling the Editor

The editor is initialized as a singleton at application startup:

cpp
#include <editor/editor.hpp>

void Application::Init() {
    // Initialize editor singleton
    Editor::init();

    // Start the editor
    Editor::get()->start();

    // Run editor main loop
    Editor::get()->run();
}

Note: The Editor class itself initializes the Engine, Window, and other subsystems internally. You do not need to initialize them separately.

Creating Entities

Use the Scene Hierarchy to create entities:

  1. Right-click in Scene Hierarchy panel
  2. Select Create Empty Entity
  3. The entity appears in the hierarchy

Or create entities programmatically:

cpp
// In editor or game code
EntityID entity = entityManager.CreateEntity();

// Add a tag for display in editor
componentManager.AddComponent<TagComponent>(entity, {
    .name = "Player"
});

Adding Components

Select an entity and add components via Properties Panel:

  1. Select entity in Scene Hierarchy
  2. Click Add Component in Properties Panel
  3. Choose component type from menu

Or add components in code:

cpp
// Add transform
componentManager.AddComponent<TransformComponent>(entity, {
    .position = glm::vec3(0, 0, 0),
    .rotation = glm::quat(1, 0, 0, 0),
    .scale = glm::vec3(1, 1, 1)
});

// Add mesh
componentManager.AddComponent<MeshComponent>(entity, {
    .mesh = cubeMesh,
    .material = defaultMaterial
});

Using Gizmos

Note: Gizmo functionality is not currently implemented in the editor. Entity transforms can be edited via the Properties Panel.

Viewport Navigation

Note: EditorCamera movement controls are currently disabled in the source code. Camera navigation features are not yet available.

Content Browser

Browse and import assets from the src/assets directory:

Navigate Folders:

  • Two-panel layout: directory tree (left) + file grid (right)
  • Click folders in tree to navigate
  • Double-click files to select them

Import Assets:

  1. Place files in src/assets directory
  2. They appear automatically in Content Browser

Drag & Drop:

  • Drag files from Content Browser to other panels
  • Payload identifier: "CONTENT_BROWSER_ITEM"

Note: The Content Browser base directory is hardcoded to src/assets.

Properties Panel

Edit component properties:

Transform Component:

Position: X, Y, Z
Rotation: Pitch, Yaw, Roll (degrees)
Scale: X, Y, Z

Mesh Component:

  • Select mesh from dropdown
  • Assign material

Rigid Body Component:

  • Set body type (Static/Dynamic)
  • Configure mass, drag, gravity

Custom Components:

  • Your game components appear automatically
  • Edit properties with ImGui widgets

Play Mode

Note: Edit/Play mode state machine is not currently implemented in the editor. The editor runs continuously without separate edit and play modes.

Saving and Loading

Save Scene:

  • File → Save in the menu bar
  • Scene is serialized and saved to disk

Note: Keyboard shortcuts for save/load and auto-save functionality are not currently implemented in the DockspaceOverlay menu system.

Custom Component UI

Custom component UI is implemented via template-based draw_component<T>() functions in the PropertiesLayer. The editor supports the following built-in components:

  • TransformComponent
  • MaterialComponent
  • MeshComponent
  • CameraComponent
  • RigidBodyComponent
  • LightComponent

To add UI for custom components, you would extend the PropertiesLayer's update() method with additional draw_component<YourComponent>() calls.

Console Panel

View log messages and debug info:

Filter Messages:

  • Toggle Info/Warning/Error icon buttons in menu bar
  • Filter logic is present in the UI but not fully implemented

Search and Clear:

  • Search bar and clear button are present but not yet functional

Log from Code:

cpp
LOG_INFO("Player spawned at position: {}", position);
LOG_WARN("Low health: {}", health);
LOG_ERROR("Failed to load asset: {}", path);

Logs are also streamed to WebSocket clients via the LogsEvent and LogSerializer (JSON format).

Scene Hierarchy

Entity Selection:

  • Left-click an entity to select it
  • Selected entity updates the LayerContext (shared with Properties Panel)

Context Menus:

  • Right-click entity: Delete, Add component
  • Right-click window background: Create entity templates (Empty, Cube, Sphere, Capsule, Quad, Plane)

Entity Management:

  • Delete entities via right-click context menu
  • Add components via right-click context menu

Note: Parent-child relationships, entity renaming, and keyboard shortcuts for deletion are not currently implemented.

Editor Appearance

The editor uses a custom dark theme defined in DockspaceOverlay:

Theme:

  • Custom dark color scheme with hex color utilities
  • Applied at startup in DockspaceOverlay::start()

Fonts:

  • OpenSans-Regular.ttf (18pt, default)
  • OpenSans-Bold.ttf (18pt)
  • Located in src/assets/fonts/open-sans/

Layout:

  • Defined in DefaultLayout class
  • Scene Hierarchy (left) | Viewport (center) | Properties (right)
  • Console/Content Browser at bottom (overlapping tabs)

Note: A preferences/settings system is not currently implemented. Theme and layout are hardcoded.

Keyboard Shortcuts

Note: Keyboard shortcuts for file operations, edit operations, gizmo modes, and playback are not currently implemented in the editor. Entity manipulation is performed via mouse interaction with the Scene Hierarchy and Properties panels.

Next Steps

  • Learn about Engine for ECS architecture
  • Explore Window for input handling
  • Review Project for asset management