camera 相机
收藏
我的收藏

基础库 1.78.0 开始支持本组件。
相机组件。该组件为原生组件。通过 tt.createCameraContext 可以获取相机上下文操作相机。

属性说明

属性名
类型
默认值
必填
说明
最低支持版本
mode
string
normal
模式,不支持动态修改,详情见 mode 的合法值
2.41.0
resolution
string
medium
分辨率,不支持动态修改,详情见 resolution 的合法值
1.78.0
device-position
string
back
摄像头朝向,详情见 device-position 的合法值
1.78.0
flash
string
off
闪光灯,详情见 flash 的合法值
2.4.0
frame-size
string
medium
指定期望的相机帧数据尺寸,详情见 frame-size 的合法值
1.78.0
bindinitdone
EventHandle
相机初始化完成时触发,e.detail = {maxZoom}。
1.78.0
binderror
EventHandle
用户不允许使用摄像头或相机异常时触发。
1.78.0
bindstop
EventHandle
摄像头在非正常终止时触发,如退出后台/跳转页面/电话中断等情况。
1.78.0
bindscancode
EventHandle
在扫码识别成功时触发,仅在 mode="scanCode" 时生效。
2.41.0

mode 的合法值

说明
最低支持版本
normal
相机模式
1.78.0
scanCode
扫码模式
2.41.0

resolution 的合法值

说明
最低支持版本
low
1.78.0
medium
1.78.0
high
1.78.0

device-position 的合法值

说明
最低支持版本
front
前置
1.78.0
back
后置
1.78.0

flash 的合法值

说明
最低支持版本
off
关闭闪光灯
2.4.0
torch
开启闪光灯
2.4.0

frame-size 的合法值

说明
最低支持版本
small
小尺寸
1.78.0
medium
中尺寸
1.78.0
large
大尺寸
1.78.0

扫码体验

代码示例

<!-- index.ttml --> <camera device-position="back" bindinitdone="onInitdone" binderror="onError" bindstop="onStop" style="width: 100%; height: 300px;" > </camera>
// index.js Page({ data: {}, onLoad: function (options) { tt.getSetting({ success: (res) => { let cameraAllowed = res.authSetting["scope.camera"]; if (!cameraAllowed) { tt.showToast({ title: "请授权相机后重新进入" }); } }, }); }, onInitdone(e) { tt.showToast({ title: "相机初始化完成", }); }, onStop(e) { console.log("相机中断"); }, onError(e) { tt.showModal({ content: "相机出错了:" + e.detail.errMsg, }); }, });

Bug & Tip

    Tip:开发者工具从基础库 2.96.0 开始支持 camera 能力,在【抖音开发者工具】中调试 camera 能力前,需要先在电脑系统设置中给【抖音开发者工具】开启【麦克风】和【摄像头】权限;
    Tip:同一个页面只能插入一个组件;
    Tip:如需使用帧回调,建议 frame-sizeresolution 属性统一级别,否则图片可能会有拉伸。