小程序开发之组件camera（系统相机）

camera

系统相机。该组件是原生组件，使用时请注意相关限制。 扫码二维码功能，需升级微信客户端至6.7.3。

需要用户授权 scope.camera

相关api：wx.createCameraContext
注：

• 请注意原生组件使用限制。
• 同一页面只能插入一个 camera 组件。

例如：
效果展示

代码
index.wxml

  
  


拍照
开始录像
结束录像

index.wxss

.showView{
  display: flex
}
image{
  margin-top: 20rpx;
  margin-left: 150rpx;
  width:200rpx; 
  height:200rpx;
  background-color: lavender
}
video{
  margin-top: 20rpx;
  margin-left: 50rpx;
  width:200rpx; 
  height:200rpx;
  background-color: lavender
}
button{
  margin: 20rpx;
}

index.js

Page({
  //创建相机
  onLoad() {
    this.ctx = wx.createCameraContext()
  },
  //拍照
  takePhoto() {
    this.ctx.takePhoto({
      quality: 'high',
      success: (res) => {
        this.setData({
          src: res.tempImagePath
        })
      }
    })
  },
  // 开始录像
  startRecord() {
    this.ctx.startRecord({
      success: (res) => {
        console.log('startRecord')
      }
    })
  },
  //结束录像
  stopRecord() {
    this.ctx.stopRecord({
      success: (res) => {
        this.setData({
          src: res.tempThumbPath,
          videoSrc: res.tempVideoPath
        })
      }
    })
  },
  error(e) {
    console.log(e.detail)
  }
})