Flipping through components


Prerequisites

In this exercise you will create an applet with two "cards" with a Bean component on each one, laying them out with CardLayout.

Work Location

Perform all work for this magercise in VisualAge project MageLang Magercises, package magercises.flipcomp.

If this project does not appear in your Workspace add it from the repository (if it exists there) or create a new project using this name.

Tasks

Perform the following tasks:

  1. Create a new applet called FlipComp and add one Button and one Panel component with a CardLayout layout manager.

  2. We need the button to flip between the various components that the card layout panel will hold. This requires using the next method of CardLayout. We can access the layout manager of the panel, but it will be of type LayoutManager, which doesn't have the next method. So we need to:
    1. Tear off the layout property of the panel. You can do this by bringing up the pop-up menu for the panel and selecting "Tear Off Property". Select the "layout" property, and click outside the applet frame to add the new layout reference.
    2. Let's cast the layout to CardLayout. We can do this by adding a variable reference of type CardLayout outside the applet frame. Select the "Options->Add Bean..." menu item, and add a variable of class java.awt.CardLayout to the work area outside of the applet frame. To perform the cast, we need to set up a property-to-property connection between the torn-off layout property and our new CardLayout variable. Connect the "this" property of each.
    3. Connect the "actionPerformed" event of the button to the "next" method of the CardLayout variable.
    4. Connect that connection's parent value to the "this" property of the panel that has the card layout attached to it.

    Now, when the button is pressed, it changes the currently-displayed component on the CardLayout panel.

  3. Add the CompassPoints and PhonePadTest beans from the previous exercises to the panel.

    You will notice that when you add the second bean, the first disappears; this is a property of the CardLayout layout manager. The first button you added is still there, it's just hidden for the time-being.

    If you wish to see the first bean, use the Tools->Beans List menu item to open a window containing a "nested folder" view of the beans in your applet. By expand all the folders via clicking on the plus icons, you can see all the beans contained within your applet. Clicking on CompassPoints1 will bring it back to the front.

  4. Now test the applet!

The task numbers above are linked to the step-by-step help page. Also available is a complete solution to the problem, and expected behavior, to demonstrate it.

Copyright © 1996-1997 MageLang Institute. All Rights Reserved.