The toolbar hosts the command actions for the current document. It is rendered at the top of the editor and is split into three groups: the view bar, the preview bar, and the document bar.
View bar
The view bar lets you switch the central view between the main editor views:
| View | Description |
|---|---|
| Editor | The visual canvas for designing screens and widgets. |
| Resource | The resource view for importing and managing images and fonts. |
| Font library | The font library view for creating and managing font libraries. |
| Code | The generated code view. Selecting it triggers a build of the LVGL source code before showing the code. |
Preview bar
The preview bar controls preview mode and the active LVGL runtime version:
- Preview toggle - switches the editor between edit mode and preview mode. Clicking the play button enters preview; clicking pause returns to edit mode.
- Runtime version - selects the LVGL runtime (and language) version used by the project, such as LVGL 9.x or LVGL 8.x. The selector is disabled while a version switch is in progress.
- Agent - opens the agent panel for natural-language UI building; see Agent.
Document bar
The document bar provides document-level commands:
| Command | Description |
|---|---|
| Home | Returns to the workspace. |
| New | Creates a new project from the workspace. |
| Undo / Redo | Steps backward and forward through edit history. Both are locked in preview mode. |
| Export | Regenerates the source bundle and exports it (for example, as a ZIP download). |
| Report bug | Opens the issue tracker to report a bug. |
| Settings | Opens the settings dialog. |
Related guides
- Overview - the editor interface as a whole.
- Preview - preview mode and the LVGL runtime version.
- Settings - the settings dialog opened from the toolbar.
- Resource management - importing images and fonts.
- Agent - the agent panel opened from the preview bar.