Video Clip
The Video Clip module allows for playback of Video content in various formats. As an extension of the Clip class, the Video Clip provides access to shared properties, enabling you to leverage the same features and methods as other clip types.
Example
Here's an example of how to work with a Video Clip:
1. To add a video file to your composition, first upload it to the library using:
const videoMediaId = await engine
.getLibrary()
.addMedia("https://example.com/path/to/your/video/file.mp4");
Note that this action returns a unique identifier for the uploaded asset, which can be reused across multiple clips.
In the example above, we imported the media from a URL. However, you can also use a File object, a URL, or a UInt8Array, providing flexibility in how you source your media.
2. By default, uploading an asset doesn't display it immediately. To show your video clip in a layer, create a new layer and add the clip using:
const videoLayer = engine.getTimeline().createLayer();
const videoClip = videoLayer.addClip({
mediaDataId: videoMediaId,
startTime: 0,
});
3. To play the composition including your video clip, use:
engine.play();
Supported Formats
Here is the list of all the supported formats:
Format | Support |
---|---|
MP4 | ✅ |
MOV | ✅ |
AVI | ✅ |
WEBM | ✅ |
MKV | ✅ |
M3U8 | ✅ |
To learn more about the VideoClip, its properties, and functions, visit the API Reference.