在现代的前端开发中，React Native 已经成为了一个非常流行的框架。而其中一个重要的组成部分就是 Bitmovin 视频播放器。所以，在这篇文章中，我们将介绍如何安装和使用 Bitmovin 播放器的 React Native 版本。
安装 react-native-bitmovin-player
为了安装和使用 react-native-bitmovin-player 包，我们必须首先安装它。在 Terminal(终端） 中输入以下命令：
npm install react-native-bitmovin-player --save
或者使用 Yarn：
yarn add react-native-bitmovin-player
一旦安装完成，我们就可以开始研究关于如何在应用程序中使用它的详细步骤。
配置
在继续操作之前，你需要在你的 React Native 项目中添加 react-native-video 模块。因此，在继续操作之前，请确保你已经完成此步骤。
另外，你需要在你的项目中还需要添加以下导入语句：
import BitmovinPlayer from 'react-native-bitmovin-player';
import { PlayerConfig } from 'bitmovin-player';现在，我们可以按照以下步骤进行配置：
Step 1 - 首先，你需要在 Bitmovin 后台生成一个新的 Player Key。你将使用此 Key 来控制你的播放器的配置。
Step 2 - 接下来，你需要将以下代码添加到你的应用程序中：
const config = new PlayerConfig(); config.key = <YOUR_PLAYER_KEY>;
在这里，请注意更换 <YOUR_PLAYER_KEY>为你实际的 Bitmovin Player Key。
Step 3 - 将以下代码添加到你的 React Native 应用程序中，以使用 Bitmovin 播放器：
<BitmovinPlayer
style={{ flex: 1 }}
configuration={config}
source={source}
/>在这里，source是一个对象，其中包含有关你要播放视频的详细信息。
使用示例代码
我们已经介绍了 react-native-bitmovin-player 的配置，现在让我们来看一个使用 Bitmovin 播放器的完整示例。
首先，我们需要添加导入语句和 Bitmovin 后台生成的 Player Key。所以，让我们添加以下代码：
import BitmovinPlayer from 'react-native-bitmovin-player';
import { PlayerConfig } from 'bitmovin-player';
const config = new PlayerConfig();
config.key = '<YOUR_PLAYER_KEY>';现在，我们要在 React Native 中加载播放器。我们可以使用以下代码：
-- -------------------- ---- -------
----- ----------------- ------- --------------- -
------ ----------------- - -
------ ------- ----- --------
--
-------- -
----- ------ - -
------ ----- -------
----- ----------------------------
--
------ -
----- -------- ----- - ---
---------------
-------- ----- - --
----------------------
---------------
--
-------
--
-
-在这里，我们创建了一个名为 CustomVideoPlayer 的组件。这个组件包装了 Bitmovin 播放器和播放器的配置和来源。在这里，我们指定了一个名称为“test video”的视频来源和一个MPD(Dash格式）视频路径。
总结
至此，我们已经学习了如何在 React Native 项目中使用 Bitmovin 播放器的所有步骤。本文中我们涉及的所有内容都非常重要，因为他们都是使用此 npm 包所需的。希望这篇文章对你有帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600671cd30d0927023822901