The layout constructor provides a view of the objects you have defined in your system, in which the objects may be manipulated. The root node of the tree is the object currently selected within the widget selector and objects may be added/moved within the displayed widget structure by picking and dropping the objects as required. For example, in the screenshot below, you could add another list to the vertical box, by picking a list from the type selector and dropping it on the vertical box object.
Each item in the tree represents one object. The screenshot above represents the following EiffelVision 2 interface definition - An EV_TITLED_WINDOW containing one child, of type EV_VERTICAL_BOX. Within the vertical box there is an EV_HORIZONTAL_BOX and an EV_LIST. The list is empty, but the horizontal box contains three different objects of type EV_BUTTON.
The information displayed, only shows you the structure of the objects , and although it gives you an indication of the final appearance of the interface you are building, you cannot see the details of the interface. i.e. color, sizes, tool tips etc. To view an accurate representation of the widget structure you are building, show the Layout window .
If you have just started a new project, then the layout constructor will only contain one tree item, TITLED_WINDOW.
The currently selected object within the Layout Constructor is automatically targetted to the docked object editor which is situated to the right hand side of the main EiffelBuild Window. This enables you to quickly and easily edit the properties of the selected object. Note that Ctrl-right clicking on an object in the Layout Constructor displays a floating object editor targeted to that object.
To Expand all of the items displayed in the layout constructor, select Expand layout tree from the View menu, or select the small cross icon displayed at the top of the tool.
Similarly, if you wish to collapse all of the items in the layout constructor, select Collapse layout tree from the View menu.
Highlighting an Object
An object contained in a system may be highlighted in the Layout Constructor by picking it, and dropping on the button displayed at the top of the Layout Constructor. Clicking this button with the mouse has no effect. The ability to highlight an object in this fashion proves to be particularly useful when building directly into the builder window , as a particular object may be quickly highlighted in the Layout Constructor, and its properties edited.
Objects that are instances of other objects are displayed as locked objects within the Layout Constructor as illustrated below:
The object of type OK_CANCEL_BUTTONS is a locked instance of another object as illustrated by the locked icon displayed on top of it's type icon. As a locked object is simply an instance of another object, its internal structure may not be manipulated directly within the Layout Constructor. To change the structure of a locked object, you must directly change the object of which it is an instance. To add a locked object to your interface, simply pick the object that you wish to re-use from the widget selector and drop it into the desired parent object within the Layout Constructor. In this case, the instance of the OK_CANCEL_BUTTONS object is actually comprised of a number of widgets which may only be modified through manipulation of the original OK_CANCEL_BUTTONS_OBJECT. Changes made to this original object are then applied to all instances within your interface structures.
You may convert an existing widget structure into a locked instance of a widget by picking the object to be used as the root of the structure (may not be locked) and dropping it into the widget selector . This creates a new "top level" object within the widget selector and places a locked instance of this at the original location in the widget structure where it was picked from.