How to Use Cardlayout with Netbeans Gui Builder

How to use CardLayout with Netbeans GUI Builder

How to Use CardLayout

1. With a new JFrame form, add a JPanel, a few JButtons to the form so it looks like this

   
   Your navigator pane should look like this. Notice I changed the variable names. You can do that by right clicking on the component from the navigator and selecting change variable name.

   

2. Now we se the layout of mainPanel to CardLayout. Double click the mainPanel in the navigator, so it's visible by itself in the design view. Then right click it in the navigator and select Set Layout -> CardLayout. Your navigator should now look like this

   

3. Now we're going to add different JPanels to the mainPanel. Just right click on the mainPanel from the navigator and select Add from Palette -> Swing Containers -> JPanel. Do that three times so you have three different JPanels. I also changed their variable names. Your navigator should not look like this.

   

4. The layout part is set but lets add some labels so we can differentiate between the JPanels and also change their card name. So double click panelOne from the navigator. You will see the panel in the design view. Just drag and drop a JLabel to it and edit the text of the label to Panel One. Do that for the other two also, naming their labels accordingly. When you're done, your navigator should look like this.

   
   We also want to change the name of the panels that were given as CardLayout references. We can do that by double clicking on one of the panel (panelOne) and going to the properties pane. There towards the bottom, you will see a property Card Name. Just change it to whatever you want, I used panelOne. Do that for the other two JPanel

   
   Note: At any time, you can change the layout position, say you want panelTwo initially shown, instead of panelOne. Just right click on mainPanel and select Change Order. You can move the panels up or down on the order.

5. We're almost done. We just need add the listeners to the buttons to switch between panels in the CardLayout. So double click on the frame from the navigator. You should see the buttons now. Right click on the Panel One button. and select Events -> Action -> actionPerformed. You should see auto-generated code in the source code view. Add this piece of code

   private void jbtPanelOneActionPerformed(ActionEvent evt) {                                            
       CardLayout card = (CardLayout)mainPanel.getLayout();
       card.show(mainPanel, "panelOne");
   } 
   

   Do this for the other two buttons, making sure to pass the correct name of the corresponding panel to the show method.

If you've followed the 5 steps above, your program should run as follows.

---

It's also possible to drag and drop other class JPanel form classes onto your mainPanel, if you have others you'd like to use. This may be a preferred approach for bigger non-trivial cases, to avoid humungous classes.

Using CardLayout in NetBeans GUI Builder

In the Navigator window select the panel you want.

In the Properties window scroll down to the Layout group. You'll see a Card Name property. Knock your self out ;)

CardLayout with netbeans using multiple external jpanel

You need to access the CardLayout instance and use the show(...) of the layout, add pass it the name of the panel you want to show. This is all clearly stated in How to Use CardLayout.

Also see How to Use CardLayout with Netbeans GUI Builder for

• how to set the names of the panels using the builder tool
• how to use the CardLayout in general with the bulder tool

Also see this answer for

• how you can drag and drop your panels if you're having problems with that

---

UPDATE

If you want to call the CardLayout from inside your panels, you can create an interface to implement with a method to show. Have the class with the CardLayout implement it, and pass the instance of the frame to the panel Something like

public interface Switchable {
    void show(String card);
}

public class Login extends JFrame implements Switchable {
    LoginPanel panel = new LoginPanel(this);

    @Override
    public void show(String card) {
        CardLayout layout = (CardLayout)getLayout();
        layout.show(card);
    }
}

public class LoginPanel extends JPanel {
    private Switchable switcher;

    public LoginPanel(Switchable switcher) {
        this.switcher = switcher;
    }

    private void buttonActionPerformed(ActionEvent e) {
        switcher.show(...);
    }
}

CardLayout - How to use previous() and next() using NetBeans GUI Builder?

Declare a variable String previousCard in your JPanel. When you go from CardA to CardB set previousCard variable to "CardA" or whatever the card's name is. So after setting this for all transitions from one card to other, the back buttons will always do the same thing.

cardLayouot.show(getContentPane(), previousCard);

Why my CardLayout .show() is not doing anything... Java Netbean

card.show(main_panel, "cardname");

you should pass card name not the variable name of sub panels in card layout. you have currently passed panels names not card names.normally netbeans set card names as card1,card2...etc . you can see card name by selecting your sub panels[jpanel1,2..] from navigate and in the property window there is a row cardname in the layout category.

see this image

in this example (picture) you can see cardname is card2 so if you want to show this selected button you should use

card.show(main_panel, "card2");

but not

card.show(main_panel, "jButton1");

Using CardLayout in Netbeans

You can use:

CardLayout x = (CardLayout) getContentPane().getLayout();

Similarly to switch card panels you can use:

x.show(getContentPane(), "card2");

This is not an issue if you simply use a separate JPanel as the 'card' container plus you get the added benefit of using the JFrame BorderLayout should you wish to add navigation buttons, say in the BorderLayout.SOUTH location.

Essential reading for using CardLayout

Up-To-Bottom Box Layout in netbeans builder

camickr is right, but if you want to stick with netbeans for whatever reason,

Select the form.
go to navigator and select the BoxLayout

then in the properties window you can cycle between the Axis.

What you want is "Page Axis" or "Y Axis"

netBeans GUI form change panel

What you want to do is use a CardLayout to switch between views, instead of trying to remove and add them. You can see How to Use CardLayout with NetBean GUI Builder for how to use it with the design tool. Also for the basics, see How to Use CardLayout Oracle tutorial

---

Related Topics