Canvas
Screens can be edited directly in the Simulator. Widgets can be selected from dropdown lists in the toolbar and placed directly onto the screen. Widgets can be selected, shifted, and scaled by clicking on them. Users can navigate between screens using the touchpad or middle mouse button to pan across the interface. Zooming is also possible by holding the Ctrl/Cmd key while using the mouse wheel.
- Moving Screens - It is possible to move screens within the Simulator interface. By holding down the left mouse button on the screen's header and moving the mouse, the screen can be relocated anywhere on the interface.
Selecting multiple widgets
Multiple widgets can be selected and moved together on the canvas:
- Selection rectangle - Click and drag on an empty area of the active screen. Every widget of the screen that intersects the rectangle is selected. Hold Ctrl/Cmd while dragging to add the widgets to the existing selection instead of replacing it
- Ctrl+click / Cmd+click - Adds a widget to the selection or removes it from the selection
- Group move - Hover over the area covered by the selected widgets until the grab cursor appears, then drag to move all of them together. Widgets placed in a flex layout cannot be dragged, so a group containing such a widget cannot be moved
- Clearing the selection - Click on the background of the screen to return to a single selection
Dragging on the empty canvas outside the screens selects screens in the same way.
While more than one widget is selected, the Inspector panel is locked, and the widget menus, the undo/redo buttons and the main menu are disabled. Use the dropdown menu of the Hierarchy to copy, duplicate or delete all selected widgets at once.
Layout management
The interface layout can be fully customized to suit your preferred workflow.
-
Custom Arrangements: Workspace panels and modals—such as the Hierarchy, Inspector, and others—can be moved and placed freely anywhere on the screen.
-
Persistent Workspace: Your custom layout configurations are automatically saved and will remain active across all of your projects.
-
Restoring Defaults: To revert all panels and modals back to their original factory positions, select the "Reset layout" option from the zoom controls menu.
Zoom controls
Hovering over the percentage in the upper right corner of the toolbar allows users to select any zoom level from the menu or input a precise value directly.
-
Current Zoom Level field - Displays the active magnification percentage and allows for custom adjustments
-
Zoom In - Increases canvas magnification for detailed work on specific elements
-
Zoom Out - Decreases magnification to view more of the interface at once
-
Zoom to fit - Automatically adjusts zoom level to display the entire design within the viewport
-
Zoom to 100% - Sets magnification to actual size, offering a true representation of the final interface
-
Reset layout - Reverts custom modifications made to panels and modals back to the default workspace configuration
-
Show minimap - Toggles a navigation overview in the corner of the workspace, particularly useful for navigating large, complex interfaces
- By holding down the left mouse button on the minimap, users can quickly navigate to any area of the canvas, making it especially efficient for large projects.
Play mode
Play Mode allows users to test their embedded GUI project directly on the canvas. The Play Mode function can be accessed by clicking the play icon in the toolbar. To stop the simulation, simply click the stop icon.