Skip to main content

尺寸

用于计算播放器大小的算法如下:

默认情况下,播放器的大小与由compositionHeightcompositionWidth属性定义的合成高度一样大。
2
如果使用style属性定义了heightwidth,播放器将采用您传递的尺寸。
3
如果使用style属性传递了height,播放器将采用该高度,并根据视频的宽高比计算宽度。
4
如果使用style属性传递了width,播放器将采用该宽度,并根据视频的宽高比计算高度。

note

在v3.3.43之前,如果发生

3
4
的情况,由于元素被测量,挂载过程中会发生布局移位。使用更新版本的Remotion将解决此问题,因为它使用aspect-ratio CSS属性。

全宽度

通过设置以下样式:

tsx
style={{ width: "100%" }}
tsx
style={{ width: "100%" }}

视频将按照父容器的全宽度进行缩放,而高度将根据视频的宽高比进行计算。

适应容器

您可以使用

tsx
style={{ width: "100%", height: "100%" }}
tsx
style={{ width: "100%", height: "100%" }}

使<Player />适应整个容器。请注意,如果播放器大小与视频宽高比不匹配,视频将被缩小并居中显示在播放器中。