Cómo usar CardLayout

Aqui hay un applet que muestra un CardLayout en acción.

Pulsa sobre la imagen para ejecutar el applet.
Esta es una imagen del GUI del applet, para ejecutarlo, pulsa sobre ella y el applet aparecerá en una nueva ventana del navegador.

Como muestra el applet anterior, la clase CardLayout nos ayuda a manejar dos o más componentes, (normalmente ejemplares de JPanel) que comparte el mismo espacio. Otra forma de conseguir lo mismo es usar un JTabbedPane.

Conceptualmente, cada componente tiene un CardLayout que lo maneja como si jugaran a cartas o las colocaran en una pila, donde sólo es visible la carta superior. Se puede elegir la carta que se está mostrando de alguna de las siguientes formas:

Abajo tenemos el código que crea el CardLayout y los componentes que maneja. (Aquí está el programa completo. El programa corre como un applet, con la ayuda de AppletButton, o como una aplicación.)

//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);
Cuando se añaden componentes a un controlador que utiliza un CardLayout, se debe utilizar la forma de dos argumentos del método add() de Container : add(String name, Component comp). El primer argumento puede ser una cadena con algo que identifique al componente que se está añadiendo.

Para elegir el componente mostrado por el CardLayout, se necesita algún código adicional. Aquí puedes ver cómo lo hace el applet de esta página:

//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());
}
Como se muestra en el código anterior, se puede utilizar el método show() de CardLayout para seleccionar el componente que se está mostrando. El primer argumento del método show() es el contenedor que controla CardLayout -- esto es, el contenedor de los componentes que maneja CardLayout. El segundo argumento es la cadena que identifica el componente a mostrar. Esta cadena es la misma que fue utilizada para añadir el componente al contenedor.

Abajo tienes todos los métodos de CardLayout que permiten seleccionar un componente. Para cada método, el primer argumento es el contenedor del que CardLayout es el controlador de disposición (el contenedor de las cartas que controla CardLayout).

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)

Ejemplos que usan CardLayout

Sólo hay un ejemplo en esta lección que use CardLayout: CardWindow.java. Generalmente nuestros ejemplos usan tabbed panes en lugar de CardLayout, ya que los tabbed panes porporcionan un GUI más atractivo con la misma funcionalidad.

Ozito