I am using Card Layout to switch between panels but when I try to make a specific panel appear after pressing a button nothing happens

Question

I am trying to get it so that when the next button is pressed it goes to the Customer page, but when I click the button nothing happens.

This is my code package javaapplication1;

import javax.swing.*;
import java.lang.*;
import java.awt.*;
import java.awt.Color;
import java.awt.event.ActionListener;
import java.awt.event.ActionEvent;
import javax.swing.JFrame;

public class Test extends javax.swing.JPanel implements  ActionListener{

JButton firstButton, lastButton, nextButton, previousButton;
JPanel cardPanel;
String cardNames[] = new String[3];
int cardCounter = 0;

public JPanel createContentPane (){

    JPanel totalGUI = new JPanel();

    JPanel buttonPanel = new JPanel();
    buttonPanel.setLayout(new BoxLayout(buttonPanel, BoxLayout.LINE_AXIS));

    buttonPanel.add(Box.createRigidArea(new Dimension(10,0)));

    previousButton = new JButton("<- Previous");
    previousButton.addActionListener(this);
    buttonPanel.add(previousButton);
    buttonPanel.add(Box.createHorizontalGlue());        

    firstButton = new JButton("First");
    firstButton.addActionListener(this);
    buttonPanel.add(firstButton);
    buttonPanel.add(Box.createHorizontalGlue());

    lastButton =  new JButton("Last");
    lastButton.addActionListener(this);
    buttonPanel.add(lastButton);
    buttonPanel.add(Box.createHorizontalGlue());

    nextButton = new JButton("Next ->");
    nextButton.addActionListener(this);
    buttonPanel.add(nextButton);
    buttonPanel.add(Box.createRigidArea(new Dimension(10,0)));

    JPanel Shop = new JPanel();
    Shop panel1 = new Shop(); 
    Shop.add(panel1);

    JPanel Items = new JPanel();
    Items panel2 = new Items(); 
    Items.add(panel2); 

    JPanel Customers = new JPanel();
    Customers panel3 = new Customers(); 
    Customers.add(panel3); 

    cardPanel = new JPanel(new CardLayout(150, 50));

    cardNames[0] = "Component.CENTER";
    cardNames[1] = "Component.BOTTOM_ALIGNMENT";
    cardNames[2] = "Component.TOP_ALIGNMENT";

    cardPanel.add(Shop, cardNames[0]);
    cardPanel.add(Items, cardNames[1]);
    cardPanel.add(Customers, cardNames[2]);

    JPanel bottomPanel = new JPanel();
    bottomPanel.setLayout(new BorderLayout());

    bottomPanel.add(cardPanel, BorderLayout.CENTER);
    bottomPanel.add(buttonPanel, BorderLayout.PAGE_START);

    totalGUI.add(bottomPanel);
    return totalGUI;
}

public void actionPerformed(ActionEvent e) {


    if(e.getSource() == nextButton)
    {
        CardLayout cl = (CardLayout)(cardPanel.getLayout());

        cl.show(cardPanel, "Customers");
    }
    /*
    if(e.getSource() == firstButton)
    {
        cl.first(cardPanel);
        cardCounter = 0;
    }
    else if(e.getSource() == lastButton)
    {
        cl.last(cardPanel);
        cardCounter = 2;
    }
    else 
    }
    else if(e.getSource() == previousButton)
    {
        cl.previous(cardPanel);
        if(cardCounter > 0)
        {
            cardCounter--;
        }
        else
        {
            cardCounter = 2;
        }*/
    }


protected static void createAndShowGUI() {

    JFrame.setDefaultLookAndFeelDecorated(true);
    JFrame frame = new JFrame("");

    Test demo = new Test();
    frame.setContentPane(demo.createContentPane());

    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    frame.pack();
    frame.setVisible(true);
}

public static void main(String[] args) {
    SwingUtilities.invokeLater(new Runnable() {
        public void run() {
            createAndShowGUI();
        }
    });
}

}

Why is this the case? Am I missing something? I am only new to using Cardlayout and don't know how it fully works

Answer 1

When in doubt, check the documentation .

From CardLayout.addLayoutComponent :

The object specified by constraints must be a string. The card layout stores this string as a key-value pair that can be used for random access to a particular card. By calling the show method, an application can display the component with the specified name.

In other words, the String you pass to CardLayout.show must be identical to one of the strings you provided as a constraint when adding a component to the CardLayout.

The constraints you are using are:

• "Component.CENTER"
• "Component.BOTTOM_ALIGNMENT"
• "Component.TOP_ALIGNMENT"

None of these match what you are passing to CardLayout.show:

cl.show(cardPanel, "Customers");