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:
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:
Once you select the video key, the video object is created 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:
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.
To change the video key (file), click on the Video Key button. It opens the dialog to select another 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:
The Video type has other properties that are common to other object types:
- Variable properties
- Lists properties
- Transform properties
- Origin properties
- Flip properties
- Visible property
- Alpha properties
- Tint
- FX Shaders
- Hit Area
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:
This toolbar also contains a button to mute on/off the audio of all videos in the scene.