Mockplus comes with a "Content Panel" component to give you smooth switching of the content of websites or app prototypes. Let's look at an example of this using "Content Panel + Tab Bar + Sub-artboard."
The following video illustrates how you can link a tab button to a content panel and a sub-board. The components used include "Content Panel," "Tab Bar," and "Sub-artboard."
Let’s go through it step by step:
Step 1: Choose componentsFirst, you need to drag a Content Panel and a Tab Bar onto the artboard. Then, create three sub-artboards and add images to each of them separately.
Step 2: Link the Content Panel and the sub-artboards together
Drag the link point of the Content Panel to each of the three sub-artboards separately.
Step 3: Link the Content Panel and the Tab Bar together
To create separate interactions, double click the Tab Bar and then, one by one, drag the link point of each tab to the Content Panel. Finally, choose the "Switch content" command and select the sub-artboards you want to link to these tabs in the right panel.
Other features
When the Content Panel is selected, pressing "Enter" activates a panel with all relevant sub-artboards listed. Here you can adjust the order of these sub-artboards with drag-and-drop or the up and down arrows. To delete them, just select them and click “Delete” in the upper right corner.
