editor-ui-infrastructure

Consistent editor UI relies on EditorUIConstants for unified styling, Drawers (ButtonDrawer, ModalDrawer, TableDrawer) for reusable components, and Elements (TextureDropTarget, ComponentSelector) for common editor interactions. This Skill provides the infrastructure to enforce predictable sizing, spacing, and semantic colors across all editor panels, eliminating repetitive ImGui code and ensuring a cohesive look and feel throughout the editor.

Use TextureDropTarget for asset drag-and-drop, TableDrawer for structured data rendering, and EntityContextMenu for contextual interactions. ButtonDrawer provides consistent button styling, ModalDrawer handles dialogs, and TreeDrawer organizes hierarchical data. EditorUIConstants automatically size and color these elements, reducing boilerplate and ensuring maintainable, semantically correct UI across panels.

Yes. The callback-based API of Drawers and FieldEditors eliminates repetitive ImGui code by providing type-safe, reflection-based property editing through IFieldEditor, automatic sizing via EditorUIConstants, and reusable components like ButtonDrawer and ModalDrawer. This approach maintains consistency while reducing setup and maintenance overhead for new ContentBrowserPanel and component editor implementations.

Field editors implement IFieldEditor for generic, reflection-based property editing. They integrate with EditorUIConstants for automatic styling and sizing, enabling type-safe editing of component properties without writing custom ImGui code. This callback-driven design ensures predictable behavior and consistent UI across all property panels in the Script Inspector and custom editor panels.

Always use EditorUIConstants for spacing, sizing, and semantic colors across editor UI. Hardcoding values creates inconsistency and maintenance burden when design changes. EditorUIConstants enforces a unified style globally, ensures tooltip support and drag-and-drop behavior work predictably, and simplifies updates to the editor's visual identity without touching individual panel code.

Drawers (ButtonDrawer, ModalDrawer, TableDrawer, TreeDrawer, LayoutDrawer, TextDrawer) provide pre-built, styled components with consistent behavior and automatic sizing via EditorUIConstants. Custom ImGui code requires manual styling, spacing, and color management, leading to inconsistency and higher maintenance. Drawers reduce boilerplate, ensure semantic correctness, and guarantee predictable UI across the entire editor infrastructure.