八.视频组件video

video

视频(v2.4.0 起支持同层渲染)。相关api:wx.createVideoContext

属性类型默认值必填说明
srcstring要播放视频的资源地址,支持网络路径、本地临时路径、云文件ID(2.3.0
durationnumber指定视频时长
controlsbooleantrue是否显示默认播放控件(播放/暂停按钮、播放进度、时间)
danmu-listArray.弹幕列表
danmu-btnbooleanfalse是否显示弹幕按钮,只在初始化时有效,不能动态变更
enable-danmubooleanfalse是否展示弹幕,只在初始化时有效,不能动态变更
autoplaybooleanfalse是否自动播放
loopbooleanfalse是否循环播放
mutedbooleanfalse是否静音播放
initial-timenumber0指定视频初始播放位置
page-gesturebooleanfalse在非全屏模式下,是否开启亮度与音量调节手势(废弃,见 vslide-gesture)
directionnumber设置全屏时视频的方向,不指定则根据宽高比自动判断
show-progressbooleantrue若不设置,宽度大于240时才会显示
show-fullscreen-btnbooleantrue是否显示全屏按钮
show-play-btnbooleantrue是否显示视频底部控制栏的播放按钮
show-center-play-btnbooleantrue是否显示视频中间的播放按钮
enable-progress-gesturebooleantrue是否开启控制进度的手势
object-fitstringcontain当视频大小与 video 容器大小不一致时,视频的表现形式
posterstring视频封面的图片网络资源地址或云文件ID(2.3.0)。若 controls 属性值为 false 则设置 poster 无效
show-mute-btnbooleanfalse是否显示静音按钮
titlestring视频的标题,全屏时在顶部展示
play-btn-positionstringbottom播放按钮的位置
enable-play-gesturebooleanfalse是否开启播放手势,即双击切换播放/暂停
auto-pause-if-navigatebooleantrue当跳转到其它小程序页面时,是否自动暂停本页面的视频
auto-pause-if-open-nativebooleantrue当跳转到其它微信原生页面时,是否自动暂停本页面的视频
vslide-gesturebooleanfalse在非全屏模式下,是否开启亮度与音量调节手势(同 page-gesture)
vslide-gesture-in-fullscreenbooleantrue在全屏模式下,是否开启亮度与音量调节手势
ad-unit-idstring视频前贴广告单元ID,更多详情可参考开放能力视频前贴广告
poster-for-crawlerstring用于给搜索等场景作为视频封面展示,建议使用无播放 icon 的视频封面图,只支持网络地址
bindplayeventhandle当开始/继续播放时触发play事件
bindpauseeventhandle当暂停播放时触发 pause 事件
bindendedeventhandle当播放到末尾时触发 ended 事件
bindtimeupdateeventhandle播放进度变化时触发,event.detail = {currentTime, duration} 。触发频率 250ms 一次
bindfullscreenchangeeventhandle视频进入和退出全屏时触发,event.detail = {fullScreen, direction},direction 有效值为 vertical 或 horizontal
bindwaitingeventhandle视频出现缓冲时触发
binderroreventhandle视频播放出错时触发
bindprogresseventhandle加载进度变化时触发,只支持一段加载。event.detail = {buffered},百分比
bindloadedmetadataeventhandle视频元数据加载完成时触发。event.detail = {width, height, duration}

direction 的合法值

说明最低版本
0正常竖向
90屏幕逆时针90度
-90屏幕顺时针90度

object-fit 的合法值

说明最低版本
contain包含
fill填充
cover覆盖

play-btn-position 的合法值

说明最低版本
bottomcontrols bar上
center视频中间

Bug & Tip

  1. tip:`video 默认宽度 300px、高度 225px,可通过 wxss 设置宽高。
  2. tip:从 2.4.0 起 video 支持同层渲染,更多请参考原生组件使用限制
支持的格式
格式iOSAndroid
mp4
movx
m4vx
3gp
avix
m3u8
webmx
支持的编码格式
格式iOSAndroid
H.264
HEVC
MPEG-4
VP9x
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值