小程序学习之媒体API（五）相机管理

使用wx.createCameraContext(this)创建并返回camera上下文对象cameraContext，该对象将与页面中的<camera>组件绑定，通过它可以操作对应的<camera>组件，其语法格式如下：

const ctx = wx.createCameraContext()

ps：一个页面只能有一个<camera>组件，在自定义组件下，参数传入组件实例this，以操作组件内的<camera>组件

cameraContext对象的方法如下：

takePhoto()的参数如下：

startRecord()参数如下：

stopRecord()的参数如下：

相机管理的简单应用示例：

<!--wxml-->
<view class="title">第6章 媒体API</view>
<view class="demo-box">
 <view class="title">录像功能应用</view>
 <camera device-position="back" flash="off" style="width:100%;height:300px;"></camera>
 <button wx:if='{{isRecording}}' type="primary" size="mini" bindtap="stopRecord">结束录像</button>
 <button wx:else type="primary" size="mini" bindtap="startRecord">开始录像</button>
 <video hidden="{{isHidden}}" src="{{src}}" controls></video>
</view>

//js
// pages/camera/camera.js
Page({
  data:{
    isRecording:false,
    isHidden:true
  },
  //开始录像
  startRecord:function(){
   var that = this
   this.setData({
     isRecording:true,
     isHidden:true
   })
   this.ctx.startRecord({
     //超时自动结束
     timeoutCallback(res){
       that.setData({
         isRecording:false,
         src:res.tempVideoPath,
         isHidden:false
       })
     }
   })
  },
  stopRecord:function(){
    var that = this
    this.ctx.stopRecord({
      success:function(res){
        that.setData({
          isRecording:false,
          src:res.tempVideoPath,
          isHidden:false
        })
      }
    })
  },
  onLoad:function(options){
    this.ctx = wx.createCameraContext()
  }
})