Video

The Video is a built-in Phaser object type: Phaser.GameObjects.Video.

A Video object is created in code using the video factory. This is how the scene compiler generates the code of a Video:

const player = this.add.video(192, 512, "my-video");

The first two arguments are the position of the video. The last argument "my-video" is the key to the video asset in the asset pack.

To create a video object, you can drag the Video block and drop it in the scene:

Add video

The video object requires a video file to open. When you drop the Video block, it shows a dialog to select one of the video keys defined in the asset pack files:

Select video key

Once you select the video key, the video object is created in the scene:

Video object in the scene

You can create the same video object by dragging the video key from the Blocks view and dropping it in the scene:

Create video object from video key

Video properties

The Video object has the following properties:

  • Auto Play: If checked, the video starts playing when the scene starts.
  • Loop: If checked, the video plays in a loop.
  • Current Time: Seek the video to the given time in seconds.
  • Video Key: The key to the video asset in the asset pack.

Video properties

To change the video key (file), click on the Video Key button. It opens the dialog to select another video key:

Select a new video key

In addition to the properties, the Video section has a playback toolbar to play the video in the scene. It has the play, pause, seek to start, and seek to end buttons:

Video properties

The Video type has other properties that are common to other object types:

Update loop

The Video object shows the next video frame each time the scene is updated. By default, and for performance considerations, the Scene Editor runs the update loop step by step, only when the user does an operation in the scene. For that reason, you may see that the video doesn't play. To see the video continuously, you can enable the Run Update Loop option in the Scene Editor toolbar:

Run the update loop

This toolbar also contains a button to mute on/off the audio of all videos in the scene.

Updated on