AR 设备模拟器
打开设备模拟器。无需佩戴设备,也无需开启摄像头,即可体验 Augma 的空间图层和应用操作。
在模拟视界中探索
视界延续 Augma 原站:默认仅显示灰色背景、顶部时钟与白色横线、底部九个圆形图标。点击应用展开悬浮窗口,再次点击或按 Escape 关闭。开启摄像头后,现实画面成为背景。
底部依次为镜像、天气、HUD 显示、声音、空间、摄像头、导航、GitHub 和组件文档。右上角系统菜单提供全屏、镜头切换、主题、设置、通知与设备控制;左上角麦克风打开可点击的模拟语音指令,不请求麦克风权限。
| 应用 | 可以体验的操作 |
|---|---|
| 天气 | 切换城市并查看示例温度,非实时天气 |
| 空间 | 切换空中庭院 / 城市漫游,扫描或取消扫描,固定 / 释放锚点,点击场景中的地点 |
| 导航 | 选择目的地、切换彩色路线、开始模拟导航,逐步推进直到抵达,或结束导航 |
| 声音 | 播放本地合成和弦、暂停、切换曲目、调整进度与音量 |
| 通知 | 查看本次体验中的操作记录,打开即标记已读,可清空记录 |
| 设置 | 面板不透明度、深色视界、专注模式、镜像、景深动画、弧线视界,以及恢复默认设置 |
在系统菜单的「设备」中,可以待机、唤醒、断开和重新连接。待机或断开会停止扫描、导航、声音、摄像头与空间 AR。底部眼睛图标可以暂时收起应用和空间图层,再次点击即可恢复。
地图、地点、距离和扫描结果均为模拟数据,不代表定位、真实环境识别或实时交通。界面参考 Augma 的现实叠加图层、圆形应用控件与悬浮路线,以可交互 SVG 实现。
显示设置与音量保存在当前浏览器;通知与场景进度仅存在于本次体验中。播放声音后切换浏览器标签页会自动暂停,不会自动恢复。
可选视界效果
右上角「系统菜单 → 设置 → 视界效果」提供两个独立开关,默认关闭并自动保存:
- 景深动画:鼠标移动时,空间图层和浮窗产生轻微视差与透视;浮窗展开时渐显并对焦,地图背景与摄像头背景轻微虚化。触屏保留入场动画,不跟随手指移动,便于滚动和点击。
- 弧线视界:上下白线变为浅弧形,底部九个圆形图标沿弧线排列。可单独开启,不依赖景深动画。
系统开启「减少动态效果」时暂停景深动画,但保留弧线外观。隐藏 HUD、设备待机、进入空间 AR 或切到后台也会暂停景深。恢复默认设置会关闭两个效果。
接入摄像头
打开底部「摄像头」应用,点击「开启摄像头」后,浏览器才会请求权限。摄像头只在当前页面显示,画面不会上传。可切换镜头,在设置中开启镜像,或保存一张不含 HUD 的摄像头快照。等待权限时可以取消;关闭摄像头、设备待机或离开页面时释放视频轨道。
摄像头需要 HTTPS(localhost 开发例外)和支持 MediaDevices 的浏览器。权限拒绝、设备不可用时仍可体验模拟界面。
空间 AR
支持 immersive-ar 的浏览器会出现「准备空间 AR」按钮。点击后才加载 Babylon 与 XR 代码;准备完成后再次点击「进入空间 AR」,由这次用户操作启动会话。可返回摄像头模式。
普通桌面浏览器通常只能使用模拟或摄像头模式。空间 AR 的设备支持、环境参考空间和权限以浏览器实际能力为准;自动化测试不能替代实机验证。
Vue 示例结构
模拟器使用 Vue 3.5 的 <script setup lang="ts">、响应式 Props 解构、类型化事件、defineModel 和 useTemplateRef。入口仅组合设备功能,各应用通过 Props / Events 接收状态和发出操作。
SystemBar、DeviceDock和DeviceWindow管理系统栏、应用入口与浮窗;没有应用打开时保留空视界。useSimulator管理连接、场景、扫描、导航与通知。useDisplaySettings管理显示偏好和本地保存,并校验读取的设置。useSoundscape、useCamera、useXr管理浏览器资源,退出时清理。- 设备应用复用公开的 Augma 组件;业务状态、场景数据和 Babylon 留在演示工程中。