【微信小程序】camera系统相机(79/100）

UI布局：

<!--pages/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>

数据模型& 控制器

// pages/camera/camera.js
Page({
    

  /** * 页面的初始数据 */
  data: {
    

  },
  takePhoto() {
    
    const ctx = wx.createCameraContext()
    ctx.takePhoto({
    
      quality: 'high',
      success: (res) => {
    
        this.setData({
    
          src: res.tempImagePath
        })
      }
    })
  },
  error(e) {
    
    console.log(e.detail)
  },
  /** * 生命周期函数--监听页面加载 */
  onLoad(options) {
    

  },

属性说明

属性 类型 默认值 必填 说明 最低版本
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