微信小程序学习笔记(十九)video视频
2018-03-10 17:52
501 查看
<view class="section tc"> <video id="myVideo" src="http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400" enable-danmu danmu-btn controls></video> <view class="btn-area"> <input bindblur="bindInputBlur"/> <button bindtap="bindSendDanmu">发送弹幕</button> </view> </view>
//随机颜色 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) {//调用API this.videoContext = wx.createVideoContext('myVideo') }, inputValue: '', bindInputBlur: function (e) {//获取input框的值 console.log(e.detail.value) this.inputValue = e.detail.value//把值赋给inputValue }, bindSendDanmu: function () { //sendDanmu danmu 发送弹幕,danmu 包含两个属性 text, color。 this.videoContext.sendDanmu({ text: this.inputValue, color: getRandomColor() }) } })
相关文章推荐
- 微信小程序开发学习笔记002--微信小程序框架解密
- 微信小程序学习笔记2
- 微信小程序学习笔记(一)
- 微信小程序学习笔记(9)--------API
- 微信小程序之----video视频播放
- 微信小程序学习笔记(十六)textarea
- 微信小程序学习笔记 ( 小程序页面学习 八 WXML-条件渲染 基本食用方法)
- 微信小程序学习笔记
- 微信:小程序学习笔记(3)
- 微信小程序开发学习笔记007--微信小程序项目01
- Directshow学习笔记五-----一个简单的视频播放程序(个人学习总结,仅供参考)
- OpenCV学习笔记【2】:第二个程序--播放AVI视频
- 【C++学习笔记】简单的多线程程序(摘自孙鑫C++教学视频)
- 微信小程序学习笔记(1)--------准备工作
- 微信小程序学习笔记 ( 小程序主体学习 二 逻辑层 app.js 扩展 高级食用方法)
- 孙鑫VC++视频学习笔记之1: Windows程序内部运行机制
- 微信小程序学习笔记——第一弹:小程序代码结构
- 微信小程序学习笔记(8)--------样式基础
- 微信小程序学习笔记
- 微信小程序学习笔记(二)- 小程序中的canvas