元素参考

Video 元素

1. 结构

interface VideoClip extends BaseClip {
  type: "video";
  src: string | { $ref: string };
  source?: {
    start?: number;
    end?: number;
  };
  volume?: number;
  muted?: boolean;
  playbackRate?: number;
}

2. 支持的参数

src

  • 类型:string | { $ref: string }
  • 必填:是
  • 用途:视频地址或视频素材引用

source.start

  • 类型:number
  • 必填:否
  • 单位:秒
  • 用途:从素材的哪个时间点开始播放

source.end

  • 类型:number
  • 必填:否
  • 单位:秒
  • 用途:裁剪到素材的哪个时间点结束

volume

  • 类型:number
  • 必填:否
  • 默认值:1

muted

  • 类型:boolean
  • 必填:否
  • 默认值:false

playbackRate

  • 类型:number
  • 必填:否
  • 默认值:1

3. 当前真实行为

  • src 支持直接 URL
  • src 支持 $ref
  • source.start 已生效
  • source.end 已生效
  • muted: true 会把音量直接压到 0
  • source.end 会影响该 clip 的实际有效时长

4. 可配合使用的共用字段

可与这些共用字段一起使用:

  • transform
  • style
  • zIndex
  • animations
  • keyframes
  • transition

说明:

  • style.borderRadius 已生效
  • style.objectFit 已生效,可选 fill / cover / contain
  • style.filters 已生效
  • fill:强制拉伸铺满目标区域,可能变形
  • cover:等比铺满,可能裁切
  • contain:等比完整显示,可能留白

5. 示例

{
  "type": "video",
  "start": 0,
  "duration": 6,
  "src": { "$ref": "hero-video" },
  "source": {
    "start": 2,
    "end": 8
  },
  "muted": true,
  "playbackRate": 1,
  "transform": {
    "x": "50%",
    "y": "50%",
    "width": "100%",
    "height": "100%"
  },
  "style": {
    "objectFit": "cover",
    "filters": [
      { "type": "blur", "value": 32 },
      { "type": "brightness", "value": 0.7 }
    ]
  },
  "transition": {
    "type": "fade",
    "duration": 0.2
  }
}