Video and Audio

You can use the Media class to obtain the source of the media, the MediaPlayer class to play and control the media, and the MediaView class to display the video. Media (video and audio) is essential in developing rich Internet applications. JavaFX provides the Media, MediaPlayer, and MediaView classes for working with media. Currently, JavaFX supports MP3, AIFF, WAV, and MPEG-4 audio formats and FLV and MPEG-4 video formats. The Media class represents a media source with properties duration, width, and height, as shown in Figure below. You can construct a Media object from an Internet URL string.

The MediaPlayer class plays and controls the media with properties such as autoPlay, currentCount, cycleCount, mute, volume, and totalDuration, as shown in Figure below. You can construct a MediaPlayer object from a media and use the pause() and play() method to pause and resume playing.

The MediaView class is a subclass of Node that provides a view of the Media being played by a MediaPlayer. The MediaView class provides the properties for viewing the media, as shown in Figure below.

The code below gives an example that displays a video in a view, as shown in Figure below. You can use the play/pause button to play or pause the video and use the rewind button to restart the video, and use the slider to control the volume of the audio.

package application;
import javafx.application.Application;
import javafx.stage.Stage;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Region;
import javafx.scene.media.Media;
import javafx.scene.media.MediaPlayer;
import javafx.scene.media.MediaView;
import javafx.util.Duration;

public class MediaDemo extends Application {
    private static final String MEDIA_URL = "http://cs.armstrong.edu/liang/common/sample.mp4";

    @Override // Override the start method in the Application class
    public void start(Stage primaryStage) {
        Media media = new Media(MEDIA_URL);
        MediaPlayer mediaPlayer = new MediaPlayer(media);
        MediaView mediaView = new MediaView(mediaPlayer);

        Button playButton = new Button(">");
        playButton.setOnAction(e -> {
            if(playButton.getText().equals(">")) {
                mediaPlayer.play();
                playButton.setText("||");
            } else {
                mediaPlayer.pause();
                playButton.setText(">");
            }
        });

        Button rewindButton = new Button("<<");
        rewindButton.setOnAction(e -> mediaPlayer.seek(Duration.ZERO));

        Slider slVolume = new Slider();
        slVolume.setPrefWidth(150);
        slVolume.setMaxWidth(Region.USE_PREF_SIZE);
        slVolume.setMinWidth(30);
        slVolume.setValue(50);
        mediaPlayer.volumeProperty().bind(slVolume.valueProperty().divide(100));

        HBox hBox = new HBox(10);
        hBox.setAlignment(Pos.CENTER);
        hBox.getChildren().addAll(playButton, rewindButton, new Label("Volume"), slVolume);

        BorderPane pane = new BorderPane();
        pane.setCenter(mediaView);
        pane.setBottom(hBox);

        // Create a scene and place it in the stage
        Scene scene = new Scene(pane, 650, 500);
        primaryStage.setTitle("MediaDemo"); // Set the stage title
        primaryStage.setScene(scene); // Place the scene in the stage
        primaryStage.show(); // Display the stage
    }

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

The source of the media is a URL string defined in lines 18. The program creates a Media object from this URL (line 22), a MediaPlayer from the Media object (line 23), and a MediaView from the MediaPlayer object (line 24). The relationship among these three objects is shown in Figure below.

A Media object supports live streaming. You can now download a large media file and play it in the same time. A Media object can be shared by multiple media players and different views can use the same MediaPlayer object.

A play button is created (line 26) to play/pause the media (line 29). The button’s text is changed to || (line 30) if the button’s current text is > (line 28). If the button’s current text is ||, it is changed to > (line 33) and the player is paused (line 32).

A rewind button is created (line 37) to reset the playback time to the beginning of the media stream by invoking seek(Duration.ZERO) (line 38).

A slider is created (line 40) to set the volume. The media player’s volume property is bound to the slider (lines 45).

The buttons and slider are placed in an HBox (lines 47–49) and the media view is placed in the center of the border pane (line 52) and the HBox is placed at the bottom of the border pane (line 53).