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: "请授权相机后重新进入", // 内容
success: (res) => {
this.auth();
},
});
}
},
});
},
auth() {
tt.authorize({
scope: "scope.camera",
success() {
tt.showToast({
title: "授权成功",
success() {
tt.reLaunch({
url: "/pages/index/index",
});
},
});
},
fail(err) {
tt.showModal({
content: "授权失败:" + JSON.stringify(err),
});
},
});
},
onInitdone(e) {
tt.showToast({
title: "相机初始化完成",
});
},
onStop(e) {
console.log("相机中断");
},
onError(e) {
tt.showModal({
content: "相机出错了:" + e.detail.errMsg,
});
},
});
扫码体验
请使用字节宿主APP扫码
Bug & Tip
- Tip:开发者工具暂不支持本组件及相关 API,请使用真机扫码预览调试;
- Tip:同一个页面只能插入一个
<camera>
组件; - Tip:如需使用帧回调,建议
frame-size
和resolution
属性统一级别,否则图片可能会有拉伸。
点击纠错
该文档是否对你的开发有所帮助?
有帮助
没帮助
该文档是否对你的开发有所帮助?
有帮助
没帮助