Layer Configuration

Layer Configuration Types

Most layers take an optional layerConfig argument that allows you to configure aspects of the layer that are common to other layers. The interface of each layer's layerConfig is comprised of a unique assortment of the following configuration objects:

All the configuration objects in a layerConfig are optional, and will be set to sensible defaults if unused. For example, an Image will default to playing for the entire duration of your composition unless you explicitly specify a trim end.

Setting layer configuration

There are two ways of setting these layer configurations:

Passing a layerConfig object
Calling chainable setter methods

Passing a `layerConfig` object

Many composition.add<LayerType> methods accept a layerConfig as the last argument.

const video = await composition.addVideo(
  "${exampleVideoUrl}",
  {
    audio: {
      volume: 0.5,
    },
    position: {
      isRelative: true,
      x: 0.5,
      y: 0.25,
    },
    size: {
      format: "fill",
    },
    timeline: {
      start: 2,
    },
    trim: {
      end: 30,
      start: 0,
    },
  }
);

Calling chainable setter methods

Every Layer Class instance returned from the call to their respective composition.add<LayerType> method has getter and chainable setter methods for every config object in their layerConfig.

const video = await composition.addVideo(
  "https://editframe.com/docs/video-composition/layer-configuration/doge.mp4"
);


video
  .setIsRelative(true)
  .setX(0.5)
  .setY(0.25)
  .setFormat("fill")
  .setStart(2)
  .setTrim(0, 30);

Reading layer configuration

Every settable attribute in a layer's configuration is readable via a call to a getter method on the layer instance.

video.x; // -> '0.5
video.height; // -> 1920
// etc...

Layer Configuration