Containers are effective custom components that can contain UI elements, interactions, animations, and so forth. They are often used to show dynamic UI content.
Panel
The Panel component is one of the most widely used containers. You can add as many elements and interactions as you need. The Panel component can be extended infinitely in width and height.
The inner components and elements will not influence the outer size or position of the Panel component.
Double click to enable the edit mode.
Click anywhere outside the editing area to disable the editing mode.
You can select multiple components to make a Panel container. To do so, select the components you would like to put in a Panel, right-click and choose “Convert to Panel”.
Content Panel
The Content Panel is often used to achieve the effect of content switching. It is often used with sub-artboards to present dynamic content and complex interactions.
Here's an example of how you can create this dynamic content:
Here is how you can create such dynamic content:
First, drag the link point of the Content Panel to the desired sub-artboard to associate them with each other.
Then, delete, reorder, and manage the linked artboards by selecting the Stack Panel and clicking the "Enter" key.
Finally, create interactions for the secondary artboards to get it done.
Web View
The Web View component helps you embed a custom external web page into your prototype.
Drag it onto your artboard and double click the component to enter an external website address. Then, you can directly view that embedded web page when previewing the project.
This component is available in the "Containers" section of our default component library.
Property Settings
You can change the component details on the right-hand Property panel, such as enabling the responsive layout or adjusting its opacity.
Under the "Extension" section, you can select "Fix position when scrolling" to create a fixed area or directly add a note.