创新互联百度小程序教程:ar-cameraAR相机

  • ar-camera AR 相机
    • 属性说明
      • type 有效值
      • flash 有效值
    • 示例
      • 代码示例 1
      • 代码示例 2:用户自定义事件
    • Bug & Tip

    ar-camera AR 相机

    基础库 3.15.104 开始支持,低版本需做兼容处理。ar-camera 组件目前只针对百度 App 开放使用

    解释:AR 相机,在 DuMixAR 内容开放平台提交并上线 AR 项目后(选择“百度 App -> 相机”渠道)获取到 AR Key、AR Type ,可配置展现。ar-camera 组件还提供丰富的 API 来控制相机录像、拍照等,详见 swan.createARCameraContext 。
    Web 态说明:Web 态暂不支持 ar-camera 组件。在 Web 态会做打开百度 App 对应小程序页面的降级处理。

    属性说明

    属性名 类型 默认值 必填 说明

    key

    String

    AR 项目唯一标识,在 DuMixAR 内容开放平台上传生成 AR 项目后获取 AR Key

    type

    String

    AR 相机类型,在 DuMixAR 内容开放平台上传生成 AR 项目后获取 AR Type:
    2D 跟踪类型:0
    SLAM 类型:5
    IMU 类型:8

    flash

    String

    off

    闪光灯,值为 auto、on、off

    binderror

    EventHandle

    用户不允许使用摄像头或扫码失败时触发

    bindload

    EventHandle

    AR 加载成功时触发

    bindmessage

    EventHandle

    开发者制作 AR 项目时可自定义按键,用户点击时会收到事件和数据,用户自定义事件格式参见代码示例 2:用户自定义事件

    bindscancode

    EventHandle

    扫描识图结束后触发

    type 有效值

    说明
    02D 跟踪类型
    5SLAM 类型
    8IMU 类型

    flash 有效值

    说明
    auto自动闪光灯
    on闪光灯开
    off闪光灯关

    示例

    跳转编辑工具

    在开发者工具中打开

    在 WEB IDE 中打开

    扫码体验

    代码示例

    请使用百度APP扫码

    代码示例 1

    • SWAN
     
     
     

    其它代码过长,建议直接在开发者工具中预览效果。

    代码示例 2:用户自定义事件

    • JSON
     
     
     
    1. {
    2. // 常量值,不能改变
    3. "event_name": "smart_baiduapp_event",
    4. // 自定义K-V数据,会透传给小程序
    5. "data": {
    6. // key必须是string类型,value建议也是string类型
    7. "key1": "value1"
    8. }
    9. }

    设计指南

    如未获取相机权限致使相机无法使用,可通过模态弹窗 showModal 进行明确的提示反馈,避免相机黑屏阻断流程,影响用户体验。

    正确

    未获取相机权限时提示用户权限未开启

    错误

    未获取相机权限却无提示,导致用户无措

    使用 AR 相机过程中如遇网络、性能等问题导致等待时间过长(超过 3 秒)或操作失败,可通过消息提示框 showToast 为用户提供明确的操作反馈。

    正确

    识别过程反馈

    正确

    操作失败反馈

    Bug & Tip

    • Tip:ar-camera 组件是由客户端创建的原生组件,它的层级是最高的,不能通过 z-index 控制层级。可使用 cover-view cover-image 覆盖在上面。
    • Tip:同一页面只能插入一个 ar-camera 组件。可在新页面中放置 ar-camera 组件,并使用 API swan.navigateTo(注意应防止用户多次连续点击,否则会导致 AR 页面多次打开出现卡顿)跳转至该页面。
    • Tip:请勿在 scroll-view、swiper、picker-view、movable-view 中使用 ar-camera 组件。
    • Tip:AR 相机支持 iPhone X 及以上机型显示 16:9 的比例;支持 iPhone X 以下机型显示全屏比例。

    本文标题:创新互联百度小程序教程:ar-cameraAR相机
    网站链接:http://www.csdahua.cn/qtweb/news32/349032.html

    网站建设、网络推广公司-快上网,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

    广告

    声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 快上网