You can lay out a custom component visually in the MXML editor as you would a regular MXML application file. All the tools in Design mode are available. For example, you can add child controls from the Components view and set properties in the Properties view. For more information, see Working with components visually.

The size of a custom component displayed in Design mode is determined by the following rules:

• If your component has a fixed width and height, Flex Builder automatically sets the design area to that width and height.
• If the component has no width and height, or has a 100% width and height, you can select the size of the design area from the Design Area pop-up menu in the editor's toolbar.

  Selecting different sizes allows you to preview the component as it might appear in different circumstances. The design area defaults to 400x300 pixels for containers and to Fit to Content for controls.

• If the component has a percentage width and height other than 100%, Flex Builder renders it as a percentage of the selected size in the Design Area menu.