android短視訊清單自動播放,小程式實作多視訊連續播放

類似于微網誌視訊播放的功能，簡單寫了一個小demo，測試可以正常執行。功能是當點選一個視訊播放完成後，自動加載下一個視訊，當所有視訊全部加載完成後，視訊播放停止。

wxml：

JS：

const app = getApp()

var that

var getData = require('../../../utils/util.js')

Page({

data: {

teachingVideoList: [],//視訊集合

index: 1,//下标

src: 'https://cos.ap-beijing.myqcloud.com/teachingVideo/enterElook.mp4' //預設加載的第一個視訊

},

onLoad: function () {

that = this

wx.request({

url: app.data.serverUrl + 'upload_queryTeachingVideo.action',

success: function (res) {

that.setData({

teachingVideoList: res.data.teachingVideoList,

})

}

})

},

onReady: function (res) {

this.videoContext = wx.createVideoContext('myVideo')//視訊管理元件

},

videoEnd: function (res) {   // 視訊播放結束後執行的方法

var that = this

if (that.data.index == that.data.teachingVideoList.length-1) {

wx.showToast({

title: '已播放完成',

icon: 'loading',

duration: 2500,

mask: true,

})

that.setData({

index: 1

})

this.videoContext.pause()  //暫停

}else{

getData.alertWait('播放下一個視訊', that.videoPlay())

}

},

videoPlay: function () {

that = this

var videolLength = that.data.teachingVideoList.length;

that.setData({

index: that.data.index + 1,

src: that.data.teachingVideoList[that.data.index][1],

})

this.videoContext.autoplay =='true'//設定自動播放

this.videoContext.play()//播放視訊

}

})