GitHub

Layer types

Add Video

Use composition.addVideo() to add video to a composition.

composition.addVideo() signature

addVideo(
  file:CompositionFile,
  config?:VideoLayerConfig
): Promise<Video>

Video layer configuration

The config argument supports the following layer configuration properties:

Video class

Calling composition.addVideo() returns an instance of the Video class, which allows you to read its layer options and read/update its layer configuration through getters/setters.

Reading layer options

video.type; // "video"

Examples

Minimal

await composition.addVideo(
  "https://editframe.com/docs/layer-types/add-video/puppy-beach.mp4"
);

Output

All layer configuration

await composition.addVideo(
  // file
  "https://editframe.com/docs/layer-types/add-video/puppy-beach.mp4",
  // config
  {
    position: {
      x: "center",
      y: "center",
    },
    size: {
      height: 500,
      width: 1000,
    },
    timeline: {
      start: 1,
    },
    trim: {
      start: 0,
      end: 4,
    },
  }
);

Output

Method Chaining Approach

const video = await composition.addVideo(
  "https://editframe.com/docs/layer-types/add-video/puppy-beach.mp4"
);


video
  // Position
  .setX("center")
  .setY("center")


  // Size
  .setHeight(500)
  .setWidth(1000)


  // Start
  .setStart(1)


  // Trim
  .setTrim(
    // start
    0,
    // end
    4
  );

Output

Previous
Add text