JavaFX：StackPane 顺序转换

Question

AnchorPane我正在尝试在 3 个不同的（点击 a Button）之间切换FadeTransition，下面是我的代码，

public class TestSlide extends Application {

    private ObjectBinding<Node> frontNode;

    @Override

    public void start(Stage primaryStage) {

        StackPane root = new StackPane();

        AnchorPane pane1 = new AnchorPane(new Button("1"));

        AnchorPane pane2 = new AnchorPane(new Button("2"));

        AnchorPane pane3 = new AnchorPane(new Button("3"));

        root.getChildren().addAll(pane1, pane2, pane3);

        handleAnimation(root);

        BorderPane border= new BorderPane(root);

        HBox bottom = new HBox(10);

        Button front1 = new Button("Pane 1");

        Button front2 = new Button("Pane 2");

        Button front3 = new Button("Pane 3");

        front1.setOnAction((ActionEvent event) -> {

            pane1.toFront();

        });

        front2.setOnAction((ActionEvent event) -> {

            pane2.toFront();

        });

        front3.setOnAction((ActionEvent event) -> {

            pane3.toFront();

        });

        bottom.getChildren().addAll(front1, front2, front3);

        border.setBottom(bottom);

        Scene scene = new Scene(border,400,400);

        primaryStage.setScene(scene);

        primaryStage.show();

    }

该handleAnimation方法引用自另一个 SO 帖子。

问题是 ，

1. 启动应用程序后，单击Pane 1 Button。-> Transition 会先显示pane2然后再显示pane1。

2. 现在点击Pane 3 Button -> Transition 将首先显示pane2然后pane3.

3. 现在点击Pane 2 Button -> Transition 会出现pane2，以上两点提到的问题就不会再出现了。

pane2为什么在第 1 点和第 2 点显示实际窗格之前显示过渡？是由于不透明度设置吗？

为什么在第 3 点之后问题得到解决？

我怎样才能在不显示第三个窗格的情况下使过渡工作FadeIn和FadeOut各自的工作？Pane

Answer 1

这里的问题是 的子级的初始状态StackPane是错误的：所有节点都具有不透明度 1。当没有动画运行时，您想要的状态具有所有节点，但最后一个完全透明（不透明度 = 0），最后一个完全透明不透明（不透明度 = 1）。您应该能够通过正确初始化不透明度来解决问题：root.getChildren().addAll(pane1, pane2, pane3);// set opacity for all but the last child to 0List<Node> children = root.getChildren();for (int i = children.size()-2; i >= 0; i--) {&nbsp; &nbsp; children.get(i).setOpacity(0);}否则会发生以下情况：就在pane1.toFront(). 请注意 (SequentialTransition确保已建立动画开始的状态。最顶层的节点是列表中的最后一个子节点，----...位于可见“层”的旁边。Pane 1: opacity = 0Pane 3: opacity = 1 ------------------------------Pane 2: opacity = 1现在，在完成前半部分后SequentialTransition，如下所示：Pane 1: opacity = 0Pane 3: opacity = 0Pane 2: opacity = 1 ------------------------------动画完成后：Pane 1: opacity = 1 ------------------------------Pane 3: opacity = 0Pane 2: opacity = 1使用pane3.toFront()产生类似的结果：Pane 3: opacity = 0Pane 1: opacity = 1 ------------------------------Pane 2: opacity = 1Pane 3: opacity = 0Pane 1: opacity = 0Pane 2: opacity = 1 ------------------------------Pane 3: opacity = 1 ------------------------------Pane 1: opacity = 0Pane 2: opacity = 1