All of the workbench commands are contained in the menu system, in right-click context menus, from toolbars, and through keyboard shortcuts.

The workbench toolbar

The workbench toolbar contains buttons for important and frequently used commands. These commands are also available from various Flex Builder menus.

The following buttons appear in the workbench toolbar (shown left to right):

New Displays a pop-up menu that displays all the types of projects and documents you can create.

Save Saves the document that is open in the editor and currently selected.

Print Source Prints the document that is open in the editor and currently selected.

Build All Appears when "Build automatically" is deselected from the Project menu.

Run Opens the main application SWF file in your default web browser or directly in stand-alone Flash Player. You can also select other application files in the project from the attached pop-up menu. For more information, see Running your applications.

Debug Uses the current project's main application file to begin a debugging session. You can also select other application files in the project from the attached pop-up menu. For more information, see Starting a debugging session.

Profile Creates, manages, and runs configurations. For more information, see About profiling.

Export Release Build Launches a wizard that helps you choose the application for which you want to export an optimized release-quality version.

External Tools Selects a custom launch configuration.

Mark Occurrences Allows you to select and mark code occurrences in Source mode.

Next Annotation Allows you to select and move forward to code annotations in Source mode.

Previous Annotation Allows you to select and move backward to code annotations in Source mode.

Last Edit Location Returns you to the location of the last edit you made to a resource (for example, the exact line of code or, in Design mode, the user interface element in which you added a control or set a property).

Back and Next Go backward or forward to previously selected documents. You can also select from the list of currently open documents from the attached pop-up menu.

The MXML editor toolbar

The MXML editor toolbar contains several buttons that allow you to control the editor in Source and Design modes. To see the toolbar, open an MXML file in Design mode.

The following buttons appear in the MXML editor toolbar (shown left to right):

Source Displays the editor in Source mode, which is where you edit code.

Design Displays the editor in Design mode, which is where you visually lay out and design your Flex applications.

Refresh Reloads the visual elements (images, SWF files, or class files containing drawing API methods) that define the visual design of your application. Collectively, these elements are referred to as a skin. For more information, see Creating Skins in the Adobe Flex 3 Developer Guide.

Show Surrounding Containers Expands the Design mode view so that you can see and select individual components. For more information, see Laying out your user interface.

State Pop-up menu displays all the defined views states. Selecting view states updates the display of the visual design. For more information, see Adding View States and Transitions.

Design Area Displays and allows you to select predefined design area sizes (1024 x 768 pixels and 800 x 600 pixels, for example). You can also set a custom size. For more information, see Using the MXML editor in Design mode.

Select Mode Engaged by default when a file is opened; it allows you to select, move, and resize items.

Pan Mode Allows you to pan and scroll around in design area; items cannot be selected or moved in Pan mode.

Zoom Mode Defaults to zoom-in preset magnification values. To zoom out press Alt+Click (Opt+Click on Macintosh). You can double click the Zoom Mode button to return the design view to 100%.

Magnification Pop-up menu displays specific zoom percentages, which can also be selected from the Design > Magnification menu. The default setting is 100%.

The CSS editor toolbar

The CSS editor contains several buttons that allow you to control the editor in Source and Design modes. To see the CSS editor toolbar, open a CSS file in Design mode.

The following buttons appear in the CSS toolbar (shown left to right):

Source Displays the editor in Source mode, which is where you edit code.

Design Displays the editor in Design mode, which is where you visually lay out and design your Flex applications.

Refresh Reloads the visual elements (images, SWF files, or class files containing drawing API methods) that define the visual design of your application. Collectively, these elements are referred to as a skin. For more information, see Creating Skins in the Adobe Flex 3 Developer Guide.

Style Pop-up menu lists the styles contained in your CSS file.

New Style Launches the New Style dialog box which allows you to choose the selector types and components to apply the new style.

Delete Style Deletes the selected style for your CSS file.

Select Mode Engaged by default when a file is opened. It allows you to select, move, and resize items.

Pan Mode Allows you to pan and scroll around in design area. Items cannot be selected or moved in Pan mode.

Zoom Mode Defaults to zoom-in preset magnification values. To zoom out press Alt+Click (Opt+Click on Macintosh). Double click the Zoom Mode button to return the design view to 100%.

Magnification Pop-up menu displays specific zoom percentages which can also be selected from the Design > Magnification menu. The default setting is 100%.

Background Launches a color picker where you can select a background color for the preview area. Changing this color does not change the CSS file nor does it affect your Flex application when you run it.

Preview as (If applicable) Shown when the style rule is not tied to one specific MXML component.

Edit scale grids (not shown) (If applicable) Shown when the style rule uses image file skins.

Using keyboard shortcuts

Many operations that are available from the menu system in Flex Builder are also available as keyboard shortcuts.

Display the list of all keyboard shortcuts in Flex Builder

 Select Help > Key Assist, or enter Control+Shift+L (Command+Shift+L on Macintosh).

You can use Key Assist as a reference to all the Flex Builder keyboard shortcuts, or you can run these commands directly from the Key Assist panel by double-clicking the commands. You can also modify keyboard shortcuts or create your own. For more information, see Changing keyboard shortcuts.