camera
基础库 1.78.0 开始支持本组件。
相机组件。该组件为原生组件。相关 API ： tt.createCameraContext。为了提供良好的用户体验构建健康的生态环境，camera 组件接入调整为申请制，如需使用此能力请走申请流程，参考【camera 相机组件申请流程】。
属性说明
| 属性名 | 类型 | 默认值 | 必填 | 说明 | 最低支持版本 |
|---|---|---|---|---|---|
| resolution | string | medium | 否 | 分辨率，不支持动态修改 | 1.78.0 |
| device-position | string | back | 否 | 摄像头朝向 | 1.78.0 |
| frame-size | string | medium | 否 | 指定期望的相机帧数据尺寸 | 1.78.0 |
| bindinitdone | eventhandle | 否 | 相机初始化完成时触发，e.detail = {maxZoom} | 1.78.0 | |
| binderror | eventhandle | 否 | 用户不允许使用摄像头或相机异常时触发 | 1.78.0 | |
| bindstop | eventhandle | 否 | 摄像头在非正常终止时触发，如退出后台/跳转页面/电话终端等情况 | 1.78.0 |
resolution 的有效值
| 值 | 说明 | 最低支持版本 |
|---|---|---|
| low | 低 | 1.78.0 |
| medium | 中 | 1.78.0 |
| high | 高 | 1.78.0 |
device-position 的有效值
| 值 | 说明 | 最低支持版本 |
|---|---|---|
| front | 前置 | 1.78.0 |
| back | 后置 | 1.78.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属性统一级别，否则图片可能会有拉伸。
点击纠错
评价此篇文档