十二：video 视频

属性名	类型	默认值	说明
src	String		要播放视频的资源地址
controls	Boolean	true	是否显示默认播放控件（播放/暂停按钮、播放进度、时间）
danmu-list	Object Array		弹幕列表
danmu-btn	Boolean	false	是否显示弹幕按钮，只在初始化时有效，不能动态变更
enable-danmu	Boolean	false	是否展示弹幕，只在初始化时有效，不能动态变更
autoplay	Boolean	false	是否自动播放
bindplay	EventHandle		当开始/继续播放时触发play事件
bindpause	EventHandle		当暂停播放时触发 pause 事件
bindended	EventHandle		当播放到末尾时触发 ended 事件
binderror	EventHandle		当发生错误时触发error事件，event.detail = {errMsg: 'something wrong'}

先写个代码。

/* ---示例代码----*/   < view >    < video  id = "myVideo"  src = "{{src}}"  binderror = "videoErrorCallback"  danmu-list = "{{danmuList}}"  enable-danmu danmu-btn controls></ video >    < view >      < button  bindtap = "bindSendDanmu" >发送弹幕</ button >    </ view > </ view >   /* ---示例代码----*/

/* ---示例代码----*/   Page({    data:{      src: "http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400" ,      danmuList:[        {text:  '第 1s 出现的弹幕' ,color:  'red' ,time: 1},        {text:  '第 3s 出现的弹幕' ,color:  '#000' ,time: 3}      ]    },    onReady: function (){      this .videoContext = wx.createVideoContext( 'myVideo' );    },    videoErrorCallback: function (e){        console.log( '视频错误信息:' +e.detail.errMsg)      },    bindSendDanmu: function (){      this .videoContext.sendDanmu({        text:  '测试弹幕' ,        color:  'blue'      })    } })   /* ---示例代码----*/

这里把微信api分开写了 比较好理解。其实那些事件和audio的一样。。video只不过在属性上增加了弹幕功能。

之后看一下获取视频的 api 

wx.chooseVideo(OBJECT)

拍摄视频或从手机相册中选视频，返回视频的临时文件路径。

OBJECT参数说明：

参数	类型	必填	说明
sourceType	StringArray	否	album 从相册选视频，camera 使用相机拍摄，默认为：['album', 'camera']
maxDuration	Number	否	拍摄视频最长拍摄时间，单位秒。最长支持60秒
camera	StringArray	否	前置或者后置摄像头，默认为前后都有，即：['front', 'back']
success	Function	否	接口调用成功，返回视频文件的临时文件路径，详见返回参数说明
fail	Function	否	接口调用失败的回调函数
complete	Function	否	接口调用结束的回调函数（调用成功、失败都会执行）

返回参数说明：

参数	说明
tempFilePath	选定视频的临时文件路径
duration	选定视频的时间长度
size	选定视频的数据量大小
height	返回选定视频的长
width	返回选定视频的宽

注：文件的临时路径，在小程序本次启动期间可以正常使用，如需持久保存，需在主动调用 wx.saveFile，在小程序下次启动时才能访问得到。

 

写到这里也就要告一段落了。。所有的讲解说白了也只是整理一下代码而已。总体来说的话掌握了angular2的语法和，ionic1的写法基本上

微信小程序也就不是那么难理解了。。而且越往后写越感觉没有必要了，所以上面讲解的一些，都是跟标签有关的东西，

而且剩下的代码基本上就是逻辑了上的修改和代码的运用了。剩下的代码js基础好的也能看懂了。不管说到哪里，按照api的规则和模范总不会出现问题的。。

话又说回来。。。因为写法的简便。比angular2要容易理解很多。所以新手需要掌握的 html css 数据绑定 和事件的调用。

 

 

 

 

转载于:https://www.cnblogs.com/dandingjun/p/6088244.html