Question

我有一个ImageView，其中我要一个接一个地显示两个图像。我希望这两个图像之间的过渡具有淡入淡出效果。这就是我试过的：

KeyFrame keyFrame1On = new KeyFrame(Duration.seconds(.2), new KeyValue(imageView.imageProperty(), image1, Interpolator.EASE_OUT));
KeyFrame keyFrame2On = new KeyFrame(Duration.seconds(.5), new KeyValue(imageView.imageProperty(), image2, Interpolator.EASE_OUT));
Timeline timelineOn = new Timeline(keyFrame1On, keyFrame2On);
timelineOn.setAutoReverse(false);
timelineOn.play();

但是图像之间的过渡是稳固的，没有褪色。我做错了什么？

Answer 1

插补器实际上并没有为你做任何事情（它只是定义了实际时间和用于计算正在改变的属性值的参数之间的映射）。

要实现淡入/淡出，您需要实际操纵opacityProperty中imageView的{{1}}。

尝试类似

的内容

Timeline

Answer 2

所以我必须做的只是创建另一个ImageView，然后更改其中一个图像视图的不透明度。这是FXML：

<AnchorPane fx:controller="br.atualy.importacaocte.controllers.DragAndDropController" maxHeight="-Infinity"
            maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="195.0" prefWidth="195.0"
            style="-fx-background-color: transparent"
            xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
    <ImageView fx:id="imageView" fitHeight="195.0" fitWidth="195.0"
               pickOnBounds="true" preserveRatio="true">
        <Image url="@../img/drag_drop.png"/>
    </ImageView>
    <ImageView fx:id="imageViewHover" fitHeight="195.0" fitWidth="195.0"
               pickOnBounds="true" preserveRatio="true">
        <Image url="@../img/drag_drop_hover.png"/>
    </ImageView>
</AnchorPane>

以下是代码：

KeyFrame kf1 = new KeyFrame(Duration.seconds(0), new KeyValue(imageViewHover.opacityProperty(), 0));
        KeyFrame kf2 = new KeyFrame(Duration.seconds(.5), new KeyValue(imageViewHover.opacityProperty(), 1));
        KeyFrame kf3 = new KeyFrame(Duration.seconds(1.5), new KeyValue(imageViewHover.opacityProperty(), 1));
        KeyFrame kf4 = new KeyFrame(Duration.seconds(2), new KeyValue(imageViewHover.opacityProperty(), 0));
        Timeline timelineOn = new Timeline(kf1, kf2, kf3, kf4);
        timelineOn.setCycleCount(Timeline.INDEFINITE);

它的作用是创造一个＆＃34;眨眼＆＃34;两个ImageView之间的影响。

在JavaFX中的图像之间淡入淡出

2 个答案: