前言
在移动端应用程序开发中，视频的播放是非常常见的需求。本文将介绍一个用于 React Native 开发的全屏视频播放组件 react-native-fullscreen-video-player，对于 React Native 开发者来说是一个非常有用的工具库。
1. 安装
使用如下命令来安装：
--- ------- ------------------------------------ ------
或者使用 yarn 安装：
---- --- ------------------------------------
2. 使用方法
在需要使用该组件的文件中，导入后即可使用：
------ ------ - --------- - ---- --------
------ --------------------- ---- ---------------------------------------
------ ------- ----- --- ------- --------- -
-------- -
------ -
----------------------
-------- ---- --------------------------------------------------- --
-----------------
-----------------
----------------------
---------------
--
--
-
-3. 参数
我们将会介绍一下该组件的参数：
3.1 video
视频地址，可以是一个 URL 或者一个本地文件路径，例如：
---------------------- -- -- --- -------- ---- --------------------------------------------------- -- -- ---- -- ------------------------------ --
3.2 videoWidth & videoHeight
视频的宽度和高度，使用该参数可以避免在视频加载前出现尺寸不正确的问题。
---------------------- -------- ---- --------------------------------------------------- -- ----------------- ----------------- --
3.3 resizeMode
设置视频的缩放模式，有以下三种值可选：'stretch'、'cover'、'contain'。
---------------------- -------- ---- --------------------------------------------------- -- -------------------- --
3.4 duration
指定视频的时长，单位为毫秒（ms）。
---------------------- -------- ---- --------------------------------------------------- -- --------------- --
4. 事件
该组件也提供了一些事件以供使用者使用，这些事件包括：
4.1 onLoad
当视频加载完毕时触发该事件。
----------------------
-------- ---- --------------------------------------------------- --
--------------- -- -
------------------------
--
--4.2 onProgress
当视频播放时触发该事件，可以用作及时更新当前播放进度等场景。
----------------------
-------- ---- --------------------------------------------------- --
------------------- -- -
----------------------- -------------------
--
--5. 结语
本文介绍了 npm 包 react-native-fullscreen-video-player 的使用方法和一些常用的参数和事件，希望可以对 React Native 开发者有所帮助，有效提高开发效率。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6005731581e8991b448e9429