Previous | Next | Trail Map | Creating a User Interface (with Swing) | Laying Out Components within a Container

How to Use CardLayout

Here's an applet that shows a CardLayout(in the API reference documentation) in action.


Your browser can't run 1.0 Java applets, so here are pictures of the window the program brings up:


Note: Because the preceding applet runs using Java Plug-in 1.1.1, it is a Swing 1.0.3 version of the applet. To run the Swing 1.1 Beta 3 version of the applet, you can use the JDK Applet Viewer to view Card.html, specifying swing.jar in the Applet Viewer's class path. For more information about running applets, refer to About Our Examples.

As the above applet shows, the CardLayout class helps you manage two or more components (usually JPanel instances) that share the same display space. Conceptually, each component a CardLayout manages is like a playing card or trading card in a stack, where only the top card is visible at any time. You can choose the card that's showing in any of the following ways:

Below is the code that creates the CardLayout and the components it manages. (Here's the whole program. The program runs either within an applet, with the help of AppletButton, or as an application.)

//Where instance variables are declared:
JPanel cards;
final static String BUTTONPANEL = "JPanel with JButtons";
final static String TEXTPANEL = "JPanel with JTextField";

//Where the container is initialized:
cards = new JPanel();
cards.setLayout(new CardLayout());
   
...//Create a Panel named p1. Put buttons in it.
...//Create a Panel named p2. Put a text field in it.

cards.add(BUTTONPANEL, p1);
cards.add(TEXTPANEL, p2);
When you add a component to a container that a CardLayout manages, you must use the two-argument form of the Container add method: add(String name, Component comp). The first argument can be any string that somehow identifies the component being added.

To choose which component a CardLayout shows, you need some additional code. Here's how the example program does this:

//Where the container is initialized:
. . .
    //Put the JComboBox in a JPanel to get a nicer look.
    String comboBoxItems[] = { BUTTONPANEL, TEXTPANEL };
    JPanel cp = new JPanel();
    JComboBox c = new JComboBox(comboBoxItems);
    c.setEditable(false);
    c.addItemListener(this);
    cp.add(c);
    contentPane.add(cp, BorderLayout.NORTH);
. . .

public void itemStateChanged(ItemEvent evt) {
    CardLayout cl = (CardLayout)(cards.getLayout());
    cl.show(cards, (String)evt.getItem());
}
This example shows that you can use the CardLayout show method to set the currently showing component. The first argument to the show method is the container the CardLayout controls, that is, the container of the components the CardLayout manages. The second argument is the string that identifies the component to show. This string is the same as was used when adding the component to the container.

The following are all the CardLayout methods that let you choose a component. For each method, the first argument is the container for which the CardLayout is the layout manager (the container of the cards the CardLayout controls).

public void first(Container parent)
public void next(Container parent)
public void previous(Container parent)
public void last(Container parent)
public void show(Container parent, String name)

Examples that Use CardLayout

[PENDING]


Previous | Next | Trail Map | Creating a User Interface (with Swing) | Laying Out Components within a Container