How can I implement the functionality of awt.CardLayout in my javaFX 2.0 application?

Question

In my javaFX 2.0 app, I need to replace a component which is used awt.CardLayout. Cardlayout has a functionality as a stack which displays the top component in stack. And also we can manually configure which is to be displayed.

In javaFX 2.0, there is a layout called StackPane. But It doesn't seems like Cardlayout.

score 13 · Answer 1 · answered Aug 17 '12 at 17:21

13

Another option is to use a StackPane and set the visibility of all but the curent Pane to false. Not ideal, but another way of thinking about the problem

answered Aug 17 '12 at 17:21

metasim

4,793
3
46
70

1

Actually, your answer is better than the answer above. This prevents the re-drawing of the Pane. I had a Pane that had about 12 tabs on them, and using the solution to this question, it would take around 200ms to switch to it. Using your answer, it became instant. – trilogy Oct 09 '18 at 13:25
This is the best answer in my opinion. – Farrukh Najmi Oct 17 '19 at 15:22

score 13 · Accepted Answer · answered Nov 29 '11 at 12:20

There is no CardLayout, but you can use TabPane or simply switch groups:

public void start(Stage stage) {

    VBox vbox = new VBox(5);

    Button btn = new Button("1");
    Button btn2 = new Button("2");

    final Pane cardsPane = new StackPane();
    final Group card1 = new Group(new Text(25, 25, "Card 1"));
    final Group card2 = new Group(new Text(25, 25, "Card 2"));

    btn.setOnAction(new EventHandler<ActionEvent>() {
        public void handle(ActionEvent t) {
            cardsPane.getChildren().clear();
            cardsPane.getChildren().add(card1);
        }
    });

    btn2.setOnAction(new EventHandler<ActionEvent>() {
        public void handle(ActionEvent t) {
            cardsPane.getChildren().clear();
            cardsPane.getChildren().add(card2);
        }
    });

    vbox.getChildren().addAll(btn, btn2, cardsPane);
    stage.setScene(new Scene(vbox));
    stage.setWidth(200);
    stage.setHeight(200);
    stage.show();

}

I tried with TabPane. But it displays a tab menu. So I used the way you have suggested here.It works fine for my requirement. Thanks Sergey. :) — Anuruddha, Nov 30 '11 at 04:15
Note, there is new control named `Pagination` in 2.2 release which may fit your needs even better. — Sergey Grinev, Oct 01 '12 at 23:40
This answer may not be the best as it forces a re-draw of your `Group`. This means if your `Group` has a lot of information on it, it will introduce a noticeable lag on the switch. — trilogy, Oct 09 '18 at 14:11

trilogy · Answer 3 · 2019-02-27T18:51:48.433

Using metasim's answer, here is the full code (also made the buttons act more like toggle buttons):

public void start(Stage stage)
{

    VBox vbox = new VBox(5);

    RadioButton btn = new RadioButton("1");
    RadioButton btn2 = new RadioButton("2");

    ToggleGroup group = new ToggleGroup();
    btn.setToggleGroup(group);
    btn2.setToggleGroup(group);

    btn.getStyleClass().remove("radio-button");
    btn.getStyleClass().add("toggle-button");        


    btn2.getStyleClass().remove("radio-button");
    btn2.getStyleClass().add("toggle-button");        

    final Pane cardsPane = new StackPane();
    final Group card1 = new Group(new Text(25, 25, "Card 1"));
    final Group card2 = new Group(new Text(25, 25, "Card 2"));

    cardsPane.getChildren().addAll(card1, card2);
    btn.setOnAction(new EventHandler<ActionEvent>()
    {
        public void handle(ActionEvent t)
        {
            showNodeHideNodes(cardsPane.getChildren(), card1);
        }
    });

    btn2.setOnAction(new EventHandler<ActionEvent>()
    {
        public void handle(ActionEvent t)
        {
            showNodeHideNodes(cardsPane.getChildren(), card2);
        }
    });

    vbox.getChildren().addAll(btn, btn2, cardsPane);
    stage.setScene(new Scene(vbox));
    stage.setWidth(200);
    stage.setHeight(200);
    stage.show();

}

private static void showNodeHideNodes(List<Node> nodes, Node nodeToShow)
{
    for (Node node : nodes)
    {
        if (node.equals(nodeToShow))
        {
            node.setVisible(true);
        } else
        {
            node.setVisible(false);
        }
    }

}

How can I implement the functionality of awt.CardLayout in my javaFX 2.0 application?

3 Answers3

Linked