Table Widget Usage FAQs

The Table widget is one of the built-in widgets provided by Mockitt, used to insert and edit table content in prototype designs.

Insert Table Widget

You can drag and drop the Table widget directly from the Widgets panel onto the canvas to start editing and filling in content.

Line Breaks

To insert a line break within a table cell, use the shortcut Shift + Enter.

Adding and Modifying Tables

1. Drag and Drop: The Table widget is located in the Built-in Widgets category. Drag it onto the canvas to use it.
2. Merge Cells: Select the cells you want to merge, right-click, and choose Merge Cells.
3. Auto-fill Cells: After filling in a cell, hover your mouse over the bottom-right corner of that cell. The cursor will turn into a black cross. Drag it to fill adjacent cells.
4. Set Interactions: Select a specific cell, then add an interaction event in the right panel to make the cell clickable.

Adding/Deleting Rows and Columns

1. Double-click to Edit: Double-click a specific cell to select it, then right-click. You can choose to add or delete rows and columns relative to that cell.

2. Quick Add Indicators: Each row and column has corresponding gray dots on the edges. Hover your mouse over the position where you want to add a row or column, and the gray dot will turn into a blue plus sign. Click it to add a column to the right or a row below.

3. Properties Panel: Select the entire Table widget. In the Appearance panel on the right, you can modify the Rows and Columns count to add or delete them.