0

我已经构建了一个 react.js 客户端应用程序，它与 Chime SDK 和一些 REST API 接口。它创建会议、与会者、连接本地硬件并启动音频和视频。

我的问题是视频是固定大小的。

它位于 React Bootsrap 响应式布局中，如下所示：

<Container fluid style={containerStyle}>
    <Row>
        <Col sm="10">
            <audio id="my-audio-element"></audio>
            <video id="my-video-element"></video>
        </Col>
        <Col sm="2">
            ...
        </Col>
    </Row>
</Container>

和<audio id="my-audio-element"></audio>元素<video id="my-video-element"></video>由 SDK 文档建议。家长<Col sm="10">反应灵敏。

无论我对页面做什么，Chime 视频都保持固定大小？

更新

设置class="h-100 w-100"使视频可以调整大小，但是，它仍然具有固定的纵横比？

4

1 回答 1

0

我在 SDK 演示/浏览器应用中找到了答案：

.video-tile-video {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
于 2020-10-21T08:28:10.133 回答