Tutorial: CardLayout Manager

Ronald S. Holland
Total Application Works

To visit my site

[HOME] [Consulting] [Design] [Maintenance] [Project] [Testing] [Training] [Turnkey] [Java] [C++] [SQL] [HTML] [JavaScript ]

To contact us

© 2002 - 2009 All Rights Reserved Total Application Works

  • Tell a friend about this site (copy and paste the following link or send this page to a friend.)
  • <html>
    <title>Example of a link </title>
    <table border>
    <a href="http://sumtotalz.com/TotalAppsWorks/LayoutManager/CardLayout/CardLayMan_Intro.html">An Introduction to CardLayout Manager </a>
  1. Java Table of contents
  2. 2nd Java Cup
  3. Pie Chart I
  4. Pie/Bar Chart IB
  5. Pie/Bar Chart II
  6. Pie/Bar Chart III
  7. A Basic Calculator
  8. Linked Lists
  9. Linked List II
  10. Linked List III
  11. Linked List IV
  12. Hardware Store I
  13. Hardware Store II
  14. Hardware Store III
  15. Client/Server
  16. Client/Server II
  17. Client/Server III
  18. Client/Server IV
  19. Multithreaded Client/Server
  20. Multithreaded Client/Server II
  21. Multithreaded Client/Server III
  22. Basic Calculator II
  23. Basic Calculator III

Introduction to CardLayout Manager

The purpose of this tutorial is to introduce you to the concept of the CardLayout manager. The CardLayout manager implements the LayoutManager2 Interface. A CardLayout object is a layout manager for a container, such as a panel. It treats each component in the container as a card. Only one card is visible at a time, and the container acts as a stack of cards. The first component added to a CardLayout object is the visible component when the container is first displayed. The ordering of cards is determined by the container's own internal ordering of its component objects. For those who are familiar with stacks, this behavior is similar to a FIFO (First In First Out) stack. In this example, all new items are added to the bottom of the stack, and when the stack is popped, the first item on the stack is popped first.


        /               // 
       /  First Card   ///
      /               ////
     /               /////
    /               //////
   /_______________///// <---- new cards added at the bottom
Figure 1: Card Deck

In the above figure, the First Card is the first card placed on the deck and is the first card removed/popped from the deck.

CardLayout Manager Methods
Class CardLayout java.lang.Object
    extended by javax.swing.CardLayout
addLayoutComponent(Component comp, Object constraints) Adds the specified component to this card layout's internal table of names.
addLayoutComponent(String name, Component comp) If the layout manager uses a per-component string, adds the component comp to the layout, associating it with the string specified by name.
first(Container parent) Flips to the first card of the container.
getHgap() Gets the horizontal gap between components.
getLayoutAlignmentX(Container parent) Returns the alignment along the x axis.
getLayoutAlignmentY(Container parent) Returns the alignment along the y axis.
getVgap() Gets the vertical gap between components.
invalidateLayout(Container target) Invalidates the layout, indicating that if the layout manager has cached information it should be discarded.
last(Container parent) Flips to the last card of the container.
layoutContainer(Container parent) Lays out the specified container using this card layout.
maximumLayoutSize(Container target) Returns the maximum dimensions for this layout given the components in the specified target container.
minimumLayoutSize(Container parent) Calculates the minimum size for the specified panel.
next(Container parent) Flips to the next card of the specified container.
preferredLayoutSize(Container parent). Determines the preferred size of the container argument using this card layout
previous(Container parent) Flips to the previous card of the specified container.
removeLayoutComponent(Component comp) Removes the specified component from the layout.
setHgap(int hgap) Sets the horizontal gap between components.
setVgap(int vgap) Sets the vertical gap between components.
show(Container parent, String name) Flips to the component that was added to this layout with the specified name, using addLayoutComponent.
toString() Returns a string representation of the state of this card layout.
Figure 2: Class CardLayout

Cardpstack template

In the following table, we will show a CardLayout code snippet.

/** ************************************************************
 * CardpDeck.java demonstrates the basic concept of the 
 * Cardlayout Manager.

public class CardpStack extends JFrame
                      implements ActionListener {

   public CardpStack()  {

   public void actionPerformed( ActionEvent e )    {

   public static void main( String args[] )    {
} /****************** End of CardpStack class ************************/ 

Figure 3: CardpStack template

CardLayout code snippet

Suppose, for example, that you want to create a Panel that can show any one of three Panels: panel1, panel2, and panel3. Assume that panel1, panel2, and panel3 have already been created:


   JPanel cardPanel , panel1, panel2 , panel3 ;
   JButton but1, but2, but3 ;
   CardLayout cards ;

   public Card()  {

      Container c = getContentPane();      

      cardPanel = new JPanel();
      panel1    = new JPanel();
      panel2    = new JPanel();
      panel3    = new JPanel();

      but1  = new JButton( "Button 1" ) ; 
      but2  = new JButton( "Button 2" ) ; 
      but3  = new JButton( "Button 3" ) ; 
      but1.addActionListener( this );
      but2.addActionListener( this );
      but3.addActionListener( this );

      panel1.add( but1 ) ;
      panel2.add( but2 ) ;
      panel3.add( but3 ) ;

      cards = new CardLayout();
              // assume cards is declared as an instance variable
              // so that it can be used in other methods
      cardPanel.add( panel1, "First");
              // add panel1 with name "First"
      cardPanel.add( panel2, "Second");
              // add panel2 with name "Second"
      cardPanel.add( panel3, "Third");
              // add panel3 with name "Third"

         //   Elsewhere in your program, you could show panel1 by saying
      c.add( cardPanel ) ;   

      setSize( 450, 200 );

Figure 4: Card snippet

When the full code, as well as, the above code snippet is run, you will see a depiction similar to the one shown in Figure 5 below.

Figure 5: CardLayout Example

Additional example can be linked to in the following section.

CardLayout Manager code/source/resources

  1. Basic Card Example I
  2. Basic Card Example II
  3. Basic Card Example III
  4. Basic Card Example IV - This example shows basic Cardlayout card manipulation
  5. Uses multiple layout managers to initialize, sum and sort an array.
  6. Uses various layout managers on top of a card layout.

[HOME] [Consulting] [Design] [Maintenance] [Project] [Testing] [Training] [Turnkey] [Java] [C++] [SQL] [HTML] [JavaScript ]

© 2002 - 2009 All Rights Reserved Total Application Works