Navigation:  How-To >

Conjoin Multiple Elements

Previous pageReturn to chapter overviewNext page

Sometimes you may need to conjoin multiple elements into one (so they can be easily moved together).  ForeUI provides two approaches to achieve this: grouping and embedding.

Grouping

Grouping elements is very easy, just select them together and click the group_button button in the Tools Panel, then the elements will be conjoined into a single Group element.

group_elements_together

 

The member elements within the group can be reviewed in the outline view.  The member elements are displayed in light blue color:

review_group_members

You can ungroup the group by clicking the ungroup_button button after selecting the group:

ungroup_group

After ungrouping, the Group element is removed and the two member elements are restored.

after_ungroup

Embedding

Some elements can work as containers and they allow you to embed other elements into them.  Actually the Group element is a special type of container: all group members are "embedded" into the group.

These elements can be used as containers, and they can embed each other and build a nested structure.

Group
Table
Scrollable Container
Tabs
Vertical Tabs
Tree
Window
Accordion

If you embed element A into B, then embed B into C, you will get a nested structure.

Remarks: The elements above (except Group) will auto create a group to wrap its embedded elements.

embedded_elements_wrapper_group

Some containers have the ability to show/hide part of its embedded elements, such as:

Tabs & Vertical Tabs: will hide the embedded elements in non-active tabs.
Tree: will hide the embedded elements in collapsed nodes.
Accordion: will hide the embedded elements in collapsed sections.

hidden_embedded_elements_by_container

ClipArt

Since ForeUI V3.80, you can also conjoin multiple elements with ClipArt. The way to create a ClipArt is just like the way you create a Group, the difference is that you need to click the clipart_button button in the Tools Panel.

Please keep in mind that, all elements in ClipArt will become static in the HTML5 simulation. So if you wish an element to be interactive, please make sure not to put it into a ClipArt.