您好,登錄后才能下訂單哦!
這次說(shuō)下,小程序的視頻組件,之前在說(shuō)小程序基礎(chǔ)的時(shí)候視頻組件沒(méi)說(shuō),現(xiàn)在說(shuō)下。從屬性和api都說(shuō)下。https://github.com/limingios/wxProgram.git 中No.15
官網(wǎng)介紹
>https://developers.weixin.qq.com/miniprogram/dev/component/video.html
demo
function?getRandomColor()?{ ??let?rgb?=?[] ??for?(let?i?=?0;?i?<?3;?++i)?{ ????let?color?=?Math.floor(Math.random()?*?256).toString(16) ????color?=?color.length?==?1???'0'?+?color?:?color ????rgb.push(color) ??} ??return?'#'?+?rgb.join('') } Page({ ??onReady:?function?(res)?{ ????this.videoContext?=?wx.createVideoContext('myVideo') ??}, ??inputValue:?'', ??data:?{ ????src:?'', ????danmuList:?[ ??????{ ????????text:?'第?1s?出現(xiàn)的彈幕', ????????color:?'#ff0000', ????????time:?1 ??????}, ??????{ ????????text:?'第?3s?出現(xiàn)的彈幕', ????????color:?'#ff00ff', ????????time:?3 ??????}] ??}, ??bindInputBlur:?function?(e)?{ ????this.inputValue?=?e.detail.value ??}, ??bindButtonTap:?function?()?{ ????var?that?=?this ????wx.chooseVideo({ ??????sourceType:?['album',?'camera'], ??????maxDuration:?60, ??????camera:?['front',?'back'], ??????success:?function?(res)?{ ????????that.setData({ ??????????src:?res.tempFilePath ????????}) ??????} ????}) ??}, ??bindSendDanmu:?function?()?{ ????this.videoContext.sendDanmu({ ??????text:?this.inputValue, ??????color:?getRandomColor() ????}) ??} })
<view class="section tc">
?<video id="myVideo" src="https://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400" danmu-list="{{danmuList}}" enable-danmu danmu-btn controls></video>
?<view class="btn-area">
? ?<button bindtap="bindButtonTap">獲取視頻</button>
? ?<input bindblur="bindInputBlur"/>
? ?<button bindtap="bindSendDanmu">發(fā)送彈幕</button>
?</view>
</view>
PS: 最后補(bǔ)充一下video的注意事項(xiàng):
1. video 組件是由客戶端創(chuàng)建的原生組件,它的層級(jí)是最高的。
2. 請(qǐng)勿在 scroll-view 中使用 video 組件。
3. css 動(dòng)畫(huà)對(duì) video 組件無(wú)效。
如果想在video組件上添加組件,可以使用cover-view組件,具體使用方法點(diǎn)擊這里:https://mp.weixin.qq.com/debug/wxadoc/dev/component/cover-view.html。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。