微信小程序媒体组件 liveplayer
微信小程序的liveplayer组件是微信官方提供的一个用于在小程序中播放实时音视频的组件,它支持多种格式的音视频文件,包括HLS、MP4、MKV、FLV等,并且提供了丰富的控制接口,可以满足各种复杂的播放需求。
liveplayer的基本使用
liveplayer的使用非常简单,只需要在wxml文件中添加一个livepusher标签,然后在js文件中设置其src属性即可,以下是一个简单的示例:
<livepusher id="myLivePusher" autoplay="{{true}}" url="{{url}}"></livepusher>
Page({ data: { url: 'http://example.com/path/to/your/video.mp4' } })
liveplayer的常用属性
liveplayer有很多常用的属性,可以用来控制播放器的行为和外观,以下是一些常用的属性:
属性名 | 类型 | 默认值 | 说明 |
id | String | 无 | 播放器的唯一标识 |
autoplay | Boolean | false | 是否自动播放 |
mode | String | normal | 播放器的模式,可以是normal、fullscreen、miniprogram |
showcontrols | Boolean | true | 是否显示控制条 |
binderror | EventHandle | 无 | 当播放器出错时触发的事件 |
bindwaiting | EventHandle | 无 | 当播放器缓冲时触发的事件 |
bindplay | EventHandle | 无 | 当播放器开始播放时触发的事件 |
bindpause | EventHandle | 无 | 当播放器暂停播放时触发的事件 |
bindtimeupdate | EventHandle | 无 | 当播放器播放进度更新时触发的事件 |
bindended | EventHandle | 无 | 当播放器播放结束时触发的事件 |
src | String | 无 | 要播放的音视频文件的URL |
objectFit | String | fill | 视频的填充模式,可以是fill、contain、cover、none |
enablecamera | Boolean | false | 是否开启摄像头功能,只在mode为miniprogram时有效 |
enabledanmubutton | Boolean | false | 是否开启弹幕按钮,只在mode为miniprogram时有效 |
enablegiftbutton | Boolean | false | 是否开启礼物按钮,只在mode为miniprogram时有效 |
enablefullscreen | Boolean | false | 是否开启全屏模式,只在mode为fullscreen或miniprogram时有效 |
enabledanmaku | Boolean | false | 是否开启弹幕,只在mode为miniprogram时有效 |
enableforwardbutton | Boolean | false | 是否开启快进按钮,只在mode为miniprogram时有效 |
enablefunbutton | Boolean | false | 是否开启互动按钮,只在mode为miniprogram时有效 |
enablemutebutton | Boolean | false | 是否开启静音按钮,只在mode为miniprogram时有效 |
enablepauseresumebutton | Boolean | false | 是否开启暂停/恢复按钮,只在mode为miniprogram时有效 |
enableswitchcamera | Boolean | false | 是否开启切换摄像头功能,只在mode为miniprogram时有效 |
enablevoicecommentarybutton | Boolean | false | 是否开启语音评论按钮,只在mode为miniprogram时有效 |
enablevolumeslider | Boolean | false | 是否开启音量滑块,只在mode为miniprogram时有效 |
liveplayer的事件接口
liveplayer提供了一系列的事件接口,可以用来监听播放器的各种状态变化,以下是一些常用的事件:
| 事件名 | 参数对象属性名1:detail.type;参数对象属性名2:detail.url;参数对象属性名3:detail.errMsg;参数对象属性名4:detail.data.duration;参数对象属性名5:detail.data.currentTime;参数对象属性名6:detail.data.bufferedTime;参数对象属性名7:detail.data.totalTime;参数对象属性名8:detail.data.networkType;参数对象属性名9:detail.data.bitrate;参数对象属性名10:detail.data.codecs;参数对象属性名11:detail.data.width;参数对象属性名12:detail.data.height;参数对象属性名13:detail.data.fps;参数对象属性名14:detail.data.frameWidth;参数对象属性名15:detail.data.frameHeight;参数对象属性名16:detail.data.startTime;参数对象属性名17:detail.data.endTime;参数对象属性名18:detail.data.isStalled;参数对象属性名19:detail.data.isPlayingAd;参数对象属性名20:detail.data.adUrl;参数对象属性名21:detail.data.adTitle;参数对象属性名22:detail.data.adText;参数对象属性名23:detail.data.adCoverUrl;参数对象属性名24:detail.data.adSkipped;参数对象属性名25:detail.data.adEnded;参数对象属性名26:detail.data.adClicked;参数对象属性名27:detail.data.adClosed;参数对象属性名28:detail.data.adStarted;参数对象属性名29:detail.data.adProgress;参数对象属性名30:detail.data.adDuration;参数对象属性名31:detail.data.adCurrentTime;参数对象属性名32:detail.data.adPercentLoaded;参数对象属性名33:detail.data.adRemainingTime;参数对象颜色值34:detail.data.adVolume;参数对象颜色值35:detail.data.adQuality;参数对象颜色值36:detail.data.adErrorCode;参数对象颜色值37:detail.data.adErrorMessage;参数对象颜色值38:detail.data.adTagNames;参数对象颜色值39:detail.data.adImpressionIDs;参数对象颜色值40:detail.data.adSpaceId;参数对象颜色值41:detail.data.adCommentIDs;参数对象颜色值42:detail.data.adPublishTime;参数对象颜色值43:detail.data.adExpireTime;参数对象颜色值44:detail.data.adRichMediaContentIds;参数对象颜色值45:detail.data
原创文章,作者:未希,如若转载,请注明出处:https://www.kdun.com/ask/504058.html
本网站发布或转载的文章及图片均来自网络,其原创性以及文中表达的观点和判断不代表本网站。如有问题,请联系客服处理。
发表回复