Widget layout

A tree-type hierarchy of Px elements defines widget relationships and physical layout, in a structure where parent-child relationships exist between components.

All widgets occupy a rectangular area that is defined by a position and a size. The position of a widget is defined by its x, y coordinates relative to its parent’s coordinate system and each widget may have a default (or preferred) size. The size of the widget is defined by the width and height properties. The figure below shows a simple layout of a widget (C), held by a parent widget (B), that is the child object of a widget (A).

Note: If either of the child objects are positioned outside of the view area of the parent, they will be clipped and not be totally visible.
Figure 1. Scroll pane (A) holds canvas pane (B) with widget (C)


Some widgets are designed specifically to be container widgets that hold other widgets. These widgets are called panes. The figure below shows the pane hierarchy in the widget tree and on the Px Editor canvas.

Figure 2. Pane hierarchy in the widget tree