为什么我的 JavaFX ImageView 没有 showing/hiding 使用 Fade Transition？

Question

我正在尝试向我的登录和注销 ImageView 添加淡入淡出过渡，我尝试使用与 JFeonix Hamburger 相同的模式，我还在 oracle 文档中使用了一些教程，但是，我的 ImageView 没有淡入淡出过渡立即隐藏和显示。我缺少什么？

下面是我的代码：

@FXML
    private JFXHamburger menu;
    @FXML
    private ImageView login;
    @FXML
    private ImageView logout;

    private LoginLogic logic;

    @Override
    public void initialize(URL url, ResourceBundle rb) {
        // TODO
        final HamburgerSlideCloseTransition slideCloseTransition = new HamburgerSlideCloseTransition(menu);
        slideCloseTransition.setRate(-1);

        FadeTransition t = new FadeTransition(new Duration(3000), login);
        FadeTransition t1 = new FadeTransition(new Duration(3000), logout);

        t.setCycleCount(1);
        t1.setCycleCount(1);

        t.setAutoReverse(false);
        t1.setAutoReverse(false);

        t.setRate(-1);
        t1.setRate(-1);

        menu.addEventHandler(MouseEvent.MOUSE_PRESSED, (MouseEvent event) -> {
            t1.setRate(t1.getRate() * -1);
            t.setRate(t.getRate() * -1);
            slideCloseTransition.setRate(slideCloseTransition.getRate() * -1);
            slideCloseTransition.play();
            t.play();
            t1.play();
            login.setVisible(!login.isVisible());
            logout.setVisible(!logout.isVisible());
        });
    }

谢谢。

Answer 1

您没有使用 FadeTransition 更改节点的外观，因为您仍在使用 fromValue、toValue 和 byValue 的默认值.

这实际上意味着您只需打开和关闭可见性...

通常只有不透明度被FadeTransition修改。

示例：

@Override
public void start(Stage primaryStage) {
    Button btn = new Button("fade in/out");

    ImageView image = new ImageView("https://cdn.sstatic.net/Sites/Whosebug/company/img/logos/so/so-logo.png");
    image.setOpacity(0);

    VBox root = new VBox(10, btn, image);
    root.setPadding(new Insets(10));

    FadeTransition t = new FadeTransition(Duration.seconds(3), image);
    t.setCycleCount(1);
    t.setAutoReverse(false);
    t.setRate(-1);
    t.setFromValue(0);
    t.setToValue(1);

    btn.setOnAction(evt -> {
        t.setRate(t.getRate() * -1);
        t.play();
    });

    Scene scene = new Scene(root);

    primaryStage.setScene(scene);
    primaryStage.show();
}

为什么我的 JavaFX ImageView 没有 showing/hiding 使用 Fade Transition？

Why my JavaFX ImageView is not showing/hiding using the Fade Transition?

javafx

fade

transitions

imageview

示例：