Web Content Canvas

The Web Content Canvas, in the Web Screen Editor, is the region where you define the visual contents of the screen: where you drop the widgets and where you type text. Widgets and text can be embedded, that is, they can be dropped inside each other according to specific rules.

The elements are dragged from the Widgets Toolbar and dropped on the Web Content Canvas.

Clicking on elements in the Web Content Canvas displays their properties in the Properties Pane.

Double-clicking on elements in the Web Content Canvas, such as the Expression and the If widgets, opens the Expression Editor.

Right-clicking elements in the Web Content Canvas displays a pop-up menu with the operations for that element: copy/paste element, delete element, move up and move down element, handle text, to create links, and to add or remove breakpoints, etc.

CTRL+ clicking elements in the Web Content Canvas, when applicable, allows you to navigate to destination web screen or action, in a case where the element is a Link or Button widget; or navigate to the web block, in case the element is a Web Block widget.

Widget embedding rules

You can drop certain widgets within others, according to the rules below:

All widgets can be placed inside a Text, a Table, a Cell, a Container or an If widget;
All widgets except the Record widgets can be placed inside a Edit Record or a Show Record widget;
All widgets except the Record widgets, the List Box and the Upload can be placed inside a Table Records or a List Records widget.
A widget can be placed inside another widget only if all its contents can also be placed inside that widget.

Selecting a widget on the Web Content canvas

To select a widget in your web screen, you can do one of the following:

Select it directly in the Widget Tree;
Select it directly on the Widget Selector;
Click on it with your mouse on the Web Content Canvas;
Press the TAB or Shift + TAB keys to take you to the next widget in your screen.

Once the widget is selected, you can edit its properties in the Property pane of your workspace.

When your screen design is too complex and you have several widgets, you can use the Outline Mode, available on the Formatting toolbar.