Question

react-native支持视频组件（正式，不使用任何第三方库）？我希望从我的云中流式传输/播放一个视频，并寻找一种方法将其集成到我的 react-native 项目中。

在此先感谢，解决方案的任何导致都会有所帮助。

Answer 1

如果您使用Expo构建应用程序（即运行create-react-native-app命令），则Expo库中包含video component。

以下是代码示例：

<Video
  source={{ uri: 'http://d23dyxeqlo5psv.cloudfront.net/big_buck_bunny.mp4' }}
  rate={1.0}
  volume={1.0}
  muted={false}
  resizeMode="cover"
  shouldPlay
  isLooping
  style={{ width: 300, height: 300 }}
/>

我认为世博会在技术上是一个图书馆。据我所知，没有内置于react-native的视频库。您需要使用包。

Answer 2

如果您将react-native与本机代码一起使用（不使用expo）： https://github.com/react-native-community/react-native-video

<Video source={{uri: "background"}}   // Can be a URL or a local file.
   ref={(ref) => {
     this.player = ref
   }}                                      // Store reference
   onBuffer={this.onBuffer}                // Callback when remote video is buffering
   onError={this.videoError}               // Callback when video cannot be loaded
   style={styles.backgroundVideo} />

并且还需要链接库

Answer 3

您可以使用如下所示的React Native Expo Video库

通过在终端中运行以下命令来安装此软件

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css"/>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>

<div class="input_rv cal">
     <input class="date" id="dob">
    <input type="text" id="age">
</div>

API

然后按如下所示导入它，

expo install expo-av

为了下载/缓存任何视频，您可以使用Expo File System

安装Expo文件系统库

import { Video } from 'expo-av';

<Video
  source={{ uri: 'http://d23dyxeqlo5psv.cloudfront.net/big_buck_bunny.mp4' }}
  rate={1.0}
  volume={1.0}
  isMuted={false}
  resizeMode="cover"
  shouldPlay
  isLooping
  style={{ width: 300, height: 300 }}
/>

API

expo install expo-file-system

有没有办法在react-native中流式传输视频？

3 个答案: