How to fade-in and fade-out special effects as video clips are switched in Javafx?

Question

In the below code, I already have an mp4 video playing in mview3, as I click in the switch button, I want the fade-out effect as mview3 stops and some fade-in effect as mview2 starts.

swtch.setOnAction(new EventHandler<ActionEvent>() {
@Override
public void handle(ActionEvent arg0) {
      time1 = mplayer3.getCurrentTime();
      mplayer2.setStartTime(time1);
      mplayer2.play();
      secondaryLayout.getChildren().add(mview2);
      secondaryLayout.getChildren().remove(mview3);

Please suggest any possible alternatives to have the effects enabled.

Answer 1

I made a little example for you, maybe you can have a look at this page, and read something about Trasition and its subclasses. In this example i used the FadeTransition and add the MediaView's on a StackPane, so you can fade out one View and fade in the other.

import javafx.animation.FadeTransition;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.scene.media.Media;
import javafx.scene.media.MediaPlayer;
import javafx.scene.media.MediaView;
import javafx.stage.Stage;
import javafx.util.Duration;

public class VideoPlayer extends Application {

    private static final String MEDIA_URL = "http://download.oracle.com/otndocs/products/javafx/oow2010-2.flv";
    @Override
    public void start(Stage primaryStage) {

        VBox root = new VBox();
        Media media = new Media(MEDIA_URL);
        Media yt    = new Media(MEDIA_URL);
        final MediaPlayer mediaPlayer = new MediaPlayer(media);
        final MediaPlayer mediaPlayer1 = new MediaPlayer(yt);
        MediaView mediaView2 = new MediaView(mediaPlayer1);
        mediaView2.setOpacity(0.0);
        MediaView mediaView3 = new MediaView(mediaPlayer);

        //root.getChildren().add(mediaView);

        Button play = new Button("Play");
        play.setOnAction(new EventHandler<ActionEvent>() {

            @Override
            public void handle(ActionEvent t) {
               mediaPlayer.play();

            }
        });

        Pane hBox = new StackPane();
        final FadeTransition fadeOut    = new FadeTransition(Duration.millis(3000), mediaView3);
        fadeOut.setFromValue(1.0);
        fadeOut.setToValue(0.0);
        final FadeTransition fadeIn     = new FadeTransition(Duration.millis(3000), mediaView2);
        fadeIn.setFromValue(0.0);
        fadeIn.setToValue(1.0);


        hBox.getChildren().add(mediaView3);
        hBox.getChildren().add(mediaView2);
        root.getChildren().add(play);
        Button stopBtn = new Button("Stop");
        stopBtn.setOnAction(new EventHandler<ActionEvent>() {

            @Override
            public void handle(ActionEvent t) {
                Duration currentTime = mediaPlayer.getCurrentTime();
                mediaPlayer.stop();
                mediaPlayer1.setStartTime(currentTime);
                fadeOut.play();
                fadeIn.play();
                mediaPlayer1.play();
            }
        });
        root.getChildren().add(stopBtn);
        root.getChildren().add(hBox);
        Scene scene = new Scene(root, 1024, 768);
        primaryStage.setTitle("Hello World!");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

}

Hope it helps

Patrick