WEBDEV Concepts

56 Part 2: Developing a site 3 Handling controls in the editor 3.1 Control handles Handles appear around new or selected controls. Handles allow you to: • view the control size, • change the control size. The colors of the handles identify the actions that can be performed: • The black handles are used to view and resize the controls. • The white handles simply highlight the controls. For example, when selecting several controls, the white handles indicate that the selected controls cannot be resized. This type of handles is also displayed when a page is read-only for the developer: the controls cannot be modified. • The gray handles indicate the first control selected in a multiple selection. This control will be the reference control. 3.2 Available operations The page editor is used to: • Select one or more controls (with the lasso for example). • Group selected controls. • Move a control. • Change the control caption. • Display an advanced tooltip when hovering a control. This tooltip contains: the control name, position, size and initial state (if the control is invisible). 4 Aligning controls Control alignment allows you to create "professional" and cohesive UIs. You can create standard interfaces using the following WEBDEV tools: • rulers. • grids. • real-time interface checker (automatically proposed when positioning a control). • advanced interface checker. • alignment options. • customizable zoom. 4.1 Rulers The alignment rulers can be displayed in the page editor. These rulers have snap-on guides: any control that comes close to a guide is automatically "snapped" by it. This feature allows you to easily position, align or resize controls in a page. Displaying the rulers To display the rulers, go to the "Display" tab, "Help for edit" group and check "Rulers". Two types of guides can be used: • the guides , used to align and organize the controls inside the pages. • the border guides , used to define a border of identical size on each side of the page. Remark : To show or hide the page guides, select "Show guides" in the context menu of the rulers. Guides are always enabled even if they are not visible: any control moved toward a marker is automatically snapped by it. Handling markers The markers can be easily handled with the mouse in the editor. When a marker is hovered over by the mouse, the cursor turns into a double arrow.