微信小程序中vidao实现视频播放和弹幕功能的介绍

这篇文章主要介绍了微信小程序 vidao实现视频播放和弹幕的功能的相关资料,这里提供实现代码及实现效果图，需要的朋友可以参考下

 微信小程序 vidao视频播放及弹幕的功能的实现。

vidao

我现在看到的官方文档是不带danmu（弹幕）属性的，之前是有的，不过现在这个属性还可以生效。控制视频的状态可以根据video标签的唯一id得到一个对象实例。video组件并不具备action属性，不能通过action来控制。

.wxml

 view >
.js
function getRandomColor () {
 let rgb = []
 for (let i = 0 ; i ++i){
 let color = Math.floor(Math.random() * 256).toString(16)
 color = color.length == 1 ? #39;0 #39; + color : color
 rgb.push(color)
 return #39;# #39; + rgb.join( #39; #39;)
Page({
 onReady: function (res) {
 this.videoContext = wx.createVideoContext( #39;myVideo #39;)
 inputValue: #39; #39;,
 data: {
 src: #39; #39;,
 danmuList: [
 text: #39;第 1s 出现的弹幕 #39;,
 color: #39;#ff0000 #39;,
 time: 1
 text: #39;第 3s 出现的弹幕 #39;,
 color: #39;#ff00ff #39;,
 time: 3
 bindInputBlur: function(e) {
 this.inputValue = e.detail.value
 bindButtonTap: function() { //视频下载
 var that = this
 wx.chooseVideo({
 sourceType: [ #39;album #39;, #39;camera #39;],
 maxDuration: 60,
 camera: [ #39;front #39;, #39;back #39;],
 success: function(res) {
 that.setData({
 src: res.tempFilePath
 bindSendDanmu: function () {
 this.videoContext.sendDanmu({
 text: this.inputValue,
 color: getRandomColor()
 videoErrorCallback: function(e) {
 console.log( #39;视频错误信息: #39;);
 console.log(e.detail.errMsg);
})
效果

 
以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！
相关推荐：
微信小程序中input输入及动态设置按钮的实现

微信小程序中小说阅读小程序的实现


以上就是微信小程序中vidao实现视频播放和弹幕功能的介绍的详细内容，更多请关注php中文网其它相关文章！
 
  
 微信app下载
 
微信是一款手机通信软件，支持通过手机网络发送语音短信、视频、图片和文字。微信可以单聊及群聊，还能根据地理位置找到附近的人，带给大家全新的移动沟通体验，有需要的小伙伴快来保存下载体验吧！