Containers

The widgets located in the Containers group of the widgets panel are those which can contain other widgets inside and still behave as a single widget.

By default the contents of a container can be edited so you can add new items or modify current ones. You can change this default behavior and disable editing of the content, in this case the container is painted with a slightly transparent blue color.



Disable content editing:

Enable content editing:

Dynamic Panel

The Dynamic Panel widget is an advanced widget that can be described as a group of panels that act as containers. From all the containers only one is displayed at a time while all the others remain hidden. When a Dynamic Panel is created it only has one single container.

Creating panels

To create a new panel:

  1. Select a Dynamic Panel and a floating toolbar will appear at the top edge. The toolbar can also appear at the bottom edge of the dynamic panel if there is no space to display it on the top.

  2. Click on the green icon at the top-left corner of the widget.

Selecting panels

When you select a panel it will automatically show and the current one will hide letting you edit the content of the selected panel. To select a panel:

  1. Select a Dynamic Panel and a floating toolbar with a dropdown control will appear. The dropdown contains the list of panels of the dynamic panel.

  2. Click on the dropdown to open it.

  3. Select the panel you want to show.

Removing panels

To remove a panel:

Editing panel's name

The panels are automatically labeled when you create them but you can change their names in order to organize your Dynamic Panel. Change the active panel name in the Properties panel once the Dynamic Panel is selected on the page.

The Default Panel

Every Dynamic Panel has a default panel which is the one that will be displayed when starting the simulation of the prototype. Change the default panel in the Properties panel once the Dynamic Panel is selected on the page.

Table

The Table widget is used to organize content in rows and columns. It is made of cells and each cell is a individual container with container properties like layout and alignment. When a table is created, it has 4 cells by default (two rows and two columns).

Selecting rows and columns

You can select a row:

You can select a column:

Inserting rows and columns

Rows and columns can be added to the existing ones. New rows will be added under the last row and new columns at the right side of the last column:

New rows and columns can also be inserted between other rows or columns.

Insert a new row between two other rows:

Insert a new column between two other columns

Removing rows and columns

Delete a column or row by selecting it and pressing Delete key. You can also remove them if you select the option Delete in the contextual menu.

Resizing rows and columns

Columns width and rows height can be easily changed dragging their borders.

To resize a row drag its lower border when the cursor appears. To resize a column drag its right border when the cursor changes to .

Resizing cells

Individual cells can also be resized. Changing the size of a cell will automatically modify the size of its column and row to fit the new cell size.

To resize a cell:

Splitting and merging cells

Any table cell can be splitted into two parts of equal size. They can be splitted horizontally or vertically. If a cell is splitted vertically the cell is divided in to different cells with half the width but same height. If a cell is splitted horizontally the cell is divided in two different cells with half the height but same width. To split a cell:

A set of contiguous cells can be merged so they become only one cell. When a group of cells is merged their content is also merged into the new cell. To merge cells first select them and make sure they all share at least one edge one to each other, then:

Copying cells content

You can copy the content of a row, column or individual cells to another part of the table using the common copy and paste actions. To copy a set of cells first select them using the Control key if necessary and select copy from the contextual menu or Edit menu. Then select the target row, column or cell and select Paste.
You can, alternatively, paste the cells outside a table widget. Then a new table will be created using the copied cells content and size.