免费AI编程助手
百度智能小程序 AR相机
ar-camera AR 相机
基础库 3.15.104 开始支持，低版本需做兼容处理。ar-camera 组件目前只针对百度 APP 开放使用。
解释：AR 相机，在DuMixAR 内容开放平台提交并上线 AR 项目后（选择“百度 App-相机”渠道）获取到 AR Key、AR Type，可配置展现。ar-camera 组件还提供丰富的 api 来控制相机录像、拍照等，详见swan.createARCameraContext。
属性说明
| 属性名 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
|
key |
String |
是 |
AR 项目唯一标识，在 DuMixAR 内容开放平台上传生成 AR 项目后获取 AR Key |
|
|
type |
String |
是 |
AR 相机类型，在 DuMixAR 内容开放平台上传生成 AR 项目后获取 AR Type：
|
|
|
flash |
String |
off |
否 |
闪光灯，值为 auto, on, off |
|
binderror |
EventHandle |
否 |
用户不允许使用摄像头或扫码失败时触发 |
|
|
bindload |
EventHandle |
否 |
AR 加载成功时触发 |
|
|
bindmessage |
EventHandle |
否 |
开发者制作 AR 项目时可自定义按键，用户点击时会收到事件和数据，用户自定义事件格式参见用户自定义事件。 |
|
|
bindscancode |
EventHandle |
否 |
扫描识图结束后触发 |
type 有效值
| 值 | 说明 |
|---|---|
|
0 |
2D 跟踪类型 |
|
5 |
SLAM 类型 |
|
8 |
IMU 类型 |
flash 有效值
| 值 | 说明 |
|---|---|
|
auto |
自动闪光灯 |
|
on |
闪光灯开 |
|
off |
闪光灯关 |
示例
代码示例
<ar-camera ar-key="10298931" ar-type="5" flash="{{flashState}}" class="camera" bindload="loadCameraSuccess" bindmessage="message" binderror="error">
</ar-camera>其它代码过长，建议直接在开发者工具中预览效果。
用户自定义事件
设计指南
如未获取相机权限致使相机无法使用，可通过模态弹窗（showModal）进行明确的提示反馈，避免相机黑屏阻断流程，影响用户体验。
正确未获取相机权限时提示用户权限未开启
错误未获取相机权限却无提示，导致用户无措
使用 AR 相机过程中如遇网络、性能等问题导致等待时间过长（超过 3 秒）或操作失败，可通过消息提示框（showToast）为用户提供明确的操作反馈。
正确
识别过程反馈
正确
操作失败反馈
Bug & Tip
- Tip：ar-camera 组件是由客户端创建的原生组件，它的层级是最高的，不能通过 z-index 控制层级。可使用 cover-view cover-image 覆盖在上面。Tip：同一页面只能插入一个 ar-camera 组件。可在新页面中放置 ar-camera 组件，并使用 swan.navigate API（注意应防止用户多次连续点击，否则会导致 AR 页面多次打开出现卡顿）跳转至该页面。Tip：请勿在 scroll-view、swiper、picker-view、movable-view 中使用 ar-camera 组件。Tip：AR 相机支持 iPhone X 及以上机型显示 16：9 的比例；支持 iPhone X 以下机型显示全屏比例。Tip：相关 API：createARCameraContext。
更多建议：