# camera

基础库 1.6.0 开始支持,低版本需做兼容处理

微信 Mac 版:支持

相关文档: wx.createCameraContext

渲染框架支持情况:Skyline (使用最新 Nighly 工具调试)、WebView

# 功能描述

系统相机。扫码二维码功能,需升级微信客户端至6.7.3。需要用户授权 scope.camera2.10.0起 initdone 事件返回 maxZoom,最大变焦范围,相关接口 CameraContext.setZoom

# 通用属性

属性 类型 默认值 必填 说明 最低版本
mode string normal 应用模式,只在初始化时有效,不能动态变更 2.1.0
合法值 说明
normal 相机模式
scanCode 扫码模式
resolution string medium 分辨率,不支持动态修改 2.10.0
合法值 说明
low
medium
high
device-position string back 摄像头朝向 1.0.0
合法值 说明
front 前置
back 后置
flash string auto 闪光灯,值为auto, on, off 1.0.0
合法值 说明 最低版本
auto 自动
on 打开
off 关闭
torch 常亮 2.8.0
frame-size string medium 指定期望的相机帧数据尺寸 2.7.0
合法值 说明
small 小尺寸帧数据
medium 中尺寸帧数据
large 大尺寸帧数据
bindstop eventhandle 摄像头在非正常终止时触发,如退出后台等情况 1.0.0
binderror eventhandle 用户不允许使用摄像头时触发 1.0.0
bindinitdone eventhandle 相机初始化完成时触发,e.detail = {maxZoom} 2.7.0
bindscancode eventhandle 在扫码识别成功时触发,仅在 mode="scanCode" 时生效 2.1.0

# Bug & Tip

  1. tip: 同一页面只能插入一个 camera 组件
  2. tip:请注意原生组件使用限制
  3. tip:onCameraFrame 接口根据 frame-size 返回不同尺寸的原始帧数据,与 Camera 组件展示的图像不同,其实际像素值由系统决定

# 示例代码

在开发者工具中预览效果

<!-- camera.wxml -->
<camera device-position="back" flash="off" binderror="error" style="width: 100%; height: 300px;"></camera>
<button type="primary" bindtap="takePhoto">拍照</button>
<view>预览</view>
<image mode="widthFix" src="{{src}}"></image>
// camera.js
Page({
  takePhoto() {
    const ctx = wx.createCameraContext()
    ctx.takePhoto({
      quality: 'high',
      success: (res) => {
        this.setData({
          src: res.tempImagePath
        })
      }
    })
  },
  error(e) {
    console.log(e.detail)
  }
})