bilibili小程序

使用小贴士

相机(Camera)

相关文档: bl.createCameraContext

功能描述

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

通用属性

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

Bug & Tip

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

示例代码

<!-- camera.blml -->
<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 = bl.createCameraContext();
    ctx.takePhoto({
      quality: "high",
      success: (res) => {
        this.setData({
          src: res.tempImagePath,
        });
      },
    });
  },
  error(e) {
    console.log(e.detail);
  },
});
← audioimage →