Composing Beans Visually

Visually composing beans means using the Visual Composition Editor to place and connect individual and composite beans in a graphical user interface (GUI). More specifically, visually developing a user interface bean includes:

  1. Designing the user interface.
  2. Choosing a layout for the bean.
  3. Dropping visual and nonvisual beans on the free-form surface or the beans list.
  4. Changing properties and manipulating the beans.
  5. Making connections to determine the behavior of the beans.
  6. Manipulating connections.
  7. Running, which includes saving, generating code, and compiling the class.
  8. Making changes.

When you edit the bean that represents the overall structure of your application (usually its main user interface view), you graphically build your application. By making connections between beans, you build your program's business logic.

Embedding Beans in a Composite Bean

A composite bean is a bean that contains other beans. The beans you add are referred to as embedded beans. You can embed primitive or composite beans into your composite bean.

You can add beans that appear on the beans palette, as well as beans that do not appear on the palette. Beans that do not appear on the palette may include composite beans you created, such as a panel with several buttons.
Note:If you use a layout that allows a bean to completely cover another bean, the Beans List enables you to easily perform tasks on the covered components.

Adding Beans From the Palette

To add a bean from the palette to the Visual Composition Editor surface, follow these steps:

  1. From the category menu button, select the category containing the bean you want.

  2. Select the bean you want. The mouse pointer becomes a crosshair, indicating that the mouse pointer is loaded with the bean you selected.

  3. Move the crosshair to the location where you want to place the bean.

  4. Press and hold mouse button 1. An outline of the selected bean appears under the crosshair. Without releasing the mouse button, move the crosshair to position it precisely.

  5. Release the mouse button. The bean you selected is placed at the location of the crosshair, and the mouse pointer returns to normal.
    Note:If you specify a non-null layout for the container, the bean placement is affected by that layout manager.

To add a bean from the palette to the beans list, follow these steps:

  1. Select the category containing the bean you want.

  2. Select the bean you want.

  3. From the Beans List window, click on the composite bean that you want to place the bean within. The bean you selected is added to the beans list and the composite bean.
Note:The layout you specified for the container affects the placement for the bean. To modify bean placement on the Visual Composition Editor from within the Beans List window, open the Properties for the bean and modify the Constraints.

To add multiple instances of the same bean, enable Sticky by holding Ctrl while selecting the bean. Selecting a new bean or the Selection tool disables Sticky.

If the bean you want to add is not on the beans palette, you can add it with the Choose Bean tool from the beans palette.

Adding Beans Not on the Palette

You can add a bean as a class, a serialized bean, or a variable. When you add a bean as a class, the default constructor for the class is used when the program runs. This means that a real object is created, not a variable that points to a real object defined elsewhere. For more about serialized beans, see Object Serialization in VisualAge.

Before you try to add a serialized bean, make sure its serialization file (.ser) is somewhere in the classpath for your workspace.

To place a bean on the Visual Composition Editor:

  1. From the beans palette, select the Choose Bean tool; the Choose Bean window appears.

  2. Enter the fully qualified class name in the Class name field. The Browse button is especially helpful in locating the Class name when several of the same name exist in multiple packages.

  3. Type a name for the bean in the Name field. This name appears in the information area at the bottom of the Visual Composition Editor when you select the placed bean; it represents the bean in generated bean code.

    The Name field is optional. If you leave it blank, VisualAge generates a default name based on the class.

  4. To close the Choose Bean window after loading the mouse pointer with the bean, click OK.

    To enable the OK push button, you must enter the fully qualified name, package, and class in the Class name field.

  5. Move the crosshair to the desired location on either the Visual Composition Editor surface or the beans list, and click mouse button 1.

If you are dropping a bean that uses a graphic resource, place the graphic resource file in the directory where your program element is located. For example, if your program element is called MyProject.MyPackage.MyApp, place your graphic resource file in x:\..\ide\project_resources\MyProject\MyPackage\MyApp (where x is the drive where VisualAge is installed). If you have not exported your program element or created subdirectories in the project_resources directory, you may need to create the subdirectories manually.

Unloading the Mouse Pointer

To unload the mouse pointer at any time, from the beans palette, click the Selection Tool Selection tool.

Undoing and Redoing Changes in the Visual Composition Editor

If you undo an operation that you decide you had right in the first place, select Redo from the Edit pull-down menu. Redo restores the bean to the state before the last Undo, including any connections that were deleted.

Undo and Redo affect operations you perform on the free-form surface and beans palette in the Visual Composition Editor. They do not affect any of the functions in the File pull-down menu.

Use Undo to reverse any or all of the changes you made to the Reorder Connections list.

Saving a Bean

Saving a bean that you have constructed includes generating the source code. To save the bean and generate the source code:

  1. Select Bean from the menu bar.
  2. Select Save Bean.
Note:Clicking the Run Button Run button from the tool bar also saves the bean and generates the source code.

Running and Testing Beans

When you select Run Button Run from the tool bar, VisualAge performs the following actions on your visually composed bean:


Related concepts
Adding Beans in the Visual Composition Editor
Beans Palette
Free-Form Surface
Layout Managers in Visual Composition

Related procedures
Managing the Beans Palette
Moving Beans
Editing Bean Properties
Composing an Applet
Changing Bean Size and Position

Related references
Beans List
Choose Bean Window