The Layout tab allows you to design screen layout and set UI components properties in WYSIWYG style.
The tab workspace is divided into four panels:
- Canvas is the workspace where you can arrange the components in the desired layout. Components can be resized and aligned using the controls:
- expand horizontally
- expand vertically
- align the component vertically/horizontally
By default, the size of the canvas is defined by the currently available space on the screen. You can set specific dimensions in pixels through the Design layout dimensions field on the Properties tab. If the specified dimensions are greater than the current screen available space, the scrollbars appear.
- The Components palette displays the set of available UI components. In order to add a component to the layout, drag it from the palette onto the canvas or the hierarchy panel.
- The Hierarchy panel displays the tree of components added to the layout. Elements of the tree can be rearranged using drag-and-drop, as sometimes this is more convenient than doing the same on the canvas. You can remove, copy, cut or paste an element in the hierarchy using right click.
- The Properties panel displays visual component properties. According to their semantics, properties are split into two tabs: Properties and Layout.