阿里云 Aliplayer高级功能介绍(二):缩略图

本文详细介绍了阿里云Aliplayer的缩略图功能,包括缩略图的WebVTT格式,独立图片和雪碧图的地址格式,以及如何在Aliplayer中使用缩略图,包括VideoId方式播放和自定义WebVTT地址。
摘要由CSDN通过智能技术生成

基本介绍

Aliplayer提供了缩略图的功能,让用户在拖动进度条之前知道视频的内容,用户能够得到很好的播放体验,缩略图是显示在Controlbar的上面,并且包含当前的时间,阿里云的媒体处理服务提供接口可以生成缩略图的功能, 先看一下基本的效果:

cfab58cc212636872f287758e39a2a77d1cddf38

缩略图的格式

WebVTT介绍

缩略图采用了webvtt的文件格式去表示时间和显示图片的对应关系,WebVTT不仅可读性好,而且解析也比较容易,下面是一个27秒包含3个截图的WebVTT文件内容:

WEBVTT

00:00.000 --> 00:09.174
vM7nH0Kl-120.jpg?xywh=0,0,120,53

00:09.174 --> 00:18.348
vM7nH0Kl-120.jpg?xywh=120,0,120,53

00:18.348 --> 00:27.523
vM7nH0Kl-120.jpg?xywh=240,0,120,53

WebVTT是UTF-8编码格式的文本文件,主要如下:

  • 第一行必需是WEBVTT,表明这是个WebVTT文件文件。
  • 接着是一空行,后面就是时间范围和要显示的缩略图,时间格式是HH:MM:SS.sss,时:分:秒.毫秒, 开始时间 --> 结束时间,-->的两边各有一个空格,这
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值