Customizing The Document Window - MACROMEDIA FLEX BUILDER-USING FLEX BUILDER Use Manual

Customizing the Document window

You can customize the Document window in Flex Builder to suit the job at hand or your personal
preferences.
To work in Design view, do one of the following:
•
Click the Design button on the Document toolbar.
•
Select View > Design.
•
From Code view, press Control+' (the slanted quotation mark that usually shares the
tilde [~] key).
You can split the view to work in the visual and coding environments at the same time.
To split the view, do one of the following:
•
Click the Split button on the Document toolbar.
•
Select View > Code and Design.
Flex Builder provides two modes for Design view: Standard and Expanded. In the default
Expanded mode, Flex Builder adds a 10-pixel padding and a border around containers and
controls to help you select, move, and resize them with the mouse. The padding and borders are
not visible at runtime. You can remove the padding and border at design time by switching to
Standard mode.
Tip: If you prefer working in code, combine Standard mode with Split view (click the Split button on
the Document toolbar) to get quick visual feedback about the edits you make without compiling the
file. For more information, see
To remove the padding and borders around containers and controls:
•
Click the Standard button on the Document toolbar.
To restore the padding and borders around containers and controls:
•
Click the Expanded button on the Document toolbar.
To remove the panels to maximize the window:
•
Press F4.
To restore the panels:
•
Press F4.
The following are some suggestions for customizing the Document window:
•
If you're creating an MXML layout from scratch, try working in Design view in Expanded
mode.
This environment is ideal for the iterative process of adding controls to an MXML file and
directly manipulating them in the layout. You can use the mouse to select objects from the
Insert bar and position them in the file. You can also use the mouse to resize, reorder, and nest
objects. You can double-click objects in the layout to rapidly edit their
properties.
96 Chapter 4: Building a Flex User Interface Visually
"Viewing and editing code in a file" on page 76.
, , or
title text label