Javafx Stackpane 显示类似 CardLayout Java Swing

Question

我使用三个按钮在堆栈窗格中显示每个子面板，但是当我点击按钮时，每次点击显示不同的面板

例子

btn0-> 窗格 0、窗格 1 和窗格 2

btn1-> 窗格 0、窗格 1 和窗格 2

btn2-> 窗格 0、窗格 1 和窗格 2

我只想在 java swing cardLayout 中显示特定按钮的特定面板，我应该怎么做？

btn0-> 窗格 0

btn1-> 窗格 1

btn2-> 窗格 2

请帮帮我！

@FXML
void btn0(ActionEvent event) {
    stackConsole.getChildren().get(0).toFront();
}

@FXML
void btn1(ActionEvent event) {
    stackConsole.getChildren().get(1).toFront();
}

@FXML
void btn2(ActionEvent event) {
    stackConsole.getChildren().get(2).toFront();
}

Answer 1

根据您的需要，您可能对 TabPane class.

感兴趣

当然在控制器中实现类似的功能class。然而，为 child 调用 toFront() 不会产生预期的效果，因为

所有 children 留在 stackConsole
toFront 只是将调用的 Node 移动到 parent.

然而，您想要实现的目标似乎是取代 stackConsole 的 children。这可以通过将不同的 children 注入控制器 class 并使用 ObservableList.setAll 替换内容来完成。 <fx:define> 标签可用于场景中最初未显示的 children。

例子

FXML

<BorderPane xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com/fxml/1" fx:controller="fxml.ReplaceController">
    <center>
        <StackPane fx:id="stackConsole">
            <children>
                <!-- use multiply blend mode to demonstrate other children are not present
                     (result would be black otherwise) -->
                <Region fx:id="r0" blendMode="MULTIPLY" prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: red;" />
                <fx:define>
                    <Region fx:id="r1" blendMode="MULTIPLY" prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: blue;" />
                    <Region fx:id="r2" blendMode="MULTIPLY" prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: green;" />
                </fx:define>
            </children>
        </StackPane>
    </center>
    <left>
        <VBox prefHeight="200.0" spacing="10.0" BorderPane.alignment="CENTER">
            <children>
                <Button mnemonicParsing="false" text="1" onAction="#btn0"  />
                <Button mnemonicParsing="false" text="2" onAction="#btn1" />
                <Button mnemonicParsing="false" text="3" onAction="#btn2" />
            </children>
            <padding>
                <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
            </padding>
        </VBox>
    </left>
</BorderPane>

控制器

public class ReplaceController {
    @FXML
    private Region r1;
    @FXML
    private Region r2;
    @FXML
    private Region r0;
    @FXML
    private Pane stackConsole;

    @FXML
    private void btn0(ActionEvent event) {
        stackConsole.getChildren().setAll(r0);
    }

    @FXML
    private void btn1(ActionEvent event) {
        stackConsole.getChildren().setAll(r1);
    }

    @FXML
    private void btn2(ActionEvent event) {
        stackConsole.getChildren().setAll(r2);
    }
    
}

Javafx Stackpane 显示类似 CardLayout Java Swing

Javafx Stackpane show similar CardLayout Java Swing

java

swing

javafx

stackpanel

cardlayout

例子