鸿蒙NEXT版仿抖音快手App的视频播放组件

“仿抖音快手”的App项目在Android系统中有成熟的实战案例，具体参见《Android Studio开发实战：从零基础到App上线(第3版)》第14章的“14.4 实战项目：仿抖音的短视频分享”，该项目的前后端通讯方式采用HTTP接口实现，既支持向服务端上传短视频，也支持从服务端拉取短视频观看，并且在多部Android真机上测试通过，具备很高的学习研究价值。

那么把“仿抖音快手”App改造成鸿蒙App的话，不但用到ArkUI的各种界面组件，还能熟悉ArkUI的的各种交互方式，而且要跟后端服务器传输HTTP报文，这些编程技巧非常锻炼学习者的鸿蒙App编码能力。毕竟资讯类App往往只有简单的浏览动作，不如短视频App那样有着丰富的交互操作，所以“仿抖音快手”的鸿蒙App项目非常值得大家学习和研究。

“仿抖音快手”的鸿蒙App首先要支持播放网络视频，能从各种传输协议的网络地址中拉取视频流。在Android系统中，SDK自带的VideoView只能播放http/https开头的网络视频文件，不能播放采取直播协议的在线视频流。要想在Android手机上观看直播视频，还得集成另外的ExoPlayer，并分别适配各种直播协议才行。

那么对鸿蒙系统来说，SDK自带的Video组件在底层支撑了各种视频传输协议，只要一个Video组件就能播放各种链接的网络视频，既包括http/https开头的网络视频文件，也包括采取m3u8、rtsp、rtmp等直播协议的视频流，大大降低了视频播放的开发门槛。

待播放的视频路径要在Video组件的构造方法中传入，除此以外，构造方法还支持传入其他参数，以实现更丰富的播控功能。下面是可在Video构造方法中传入的常用参数：

src：视频的数据源，支持本地视频和网络视频。其中本地视频可填file://路径前缀的字符串，网络视频填完整的链接地址。

previewUri：视频未播放时的预览图片路径，默认不显示图片。

currentProgressRate：视频播放倍速。默认为Speed_Forward_1_00_X表示正常倍速。

controller：设置视频控制器，用来控制视频的播放状态。调用“new VideoController()”即可创建默认的视频控制器。

视频控制器VideoController支持的播控方法说明如下：

start：开始播放。

pause：暂停播放，显示当前帧，再次播放时从当前位置继续播放。

stop：停止播放，显示当前帧，再次播放时从头开始播放。

reset：重置内部播放器。显示当前帧，再次播放时从头开始播放。

setCurrentTime：指定视频播放的当前进度位置，单位秒。

requestFullscreen：请求全屏播放。

exitFullscreen：退出全屏播放。

除了在构造方法中指定的参数以外，Video组件还可设置下列的属性方法：

muted：设置是否静音。默认为false。

autoPlay：设置是否自动播放。默认为false。

controls：设置控制视频播放的控制栏是否显示。默认为true。

objectFit：设置视频显示模式。取值说明同图像的显示模式ImageFit。

loop：设置是否单个视频循环播放。默认为false表示不循环（只播放一次）。

就网络短视频而言，按照以下方式使用Video组件，即可满足短视频的基本播放要求：

Video({ src: this.videoUrl })
  .width('100%').height('100%')
  .objectFit(ImageFit.Contain) // 组件区域包含整个视频画面
  .autoPlay(true) // 是否自动播放
  .controls(false) // 是否显示控制条
  .loop(true) // 是否循环播放

下一篇文章会介绍如何从系统相册中选择待播放的视频文件。