83 lines
2.1 KiB
Markdown
83 lines
2.1 KiB
Markdown
# 光栅卡陀螺仪交互优化设计方案
|
||
|
||
**日期:** 2026-05-22
|
||
**文件:** `docs/superpowers/specs/2026-05-22-lenticular-gyro-optimization-design.md`
|
||
|
||
---
|
||
|
||
## 1. 问题描述
|
||
|
||
设备使用陀螺仪倾斜查看光栅卡时，图片在左右视图之间快速来回切换，无法稳定在某一侧。
|
||
|
||
**期望行为：**
|
||
- 设备居中（不倾斜）→ 显示中性图
|
||
- 往左倾斜 → 稳定显示左视图
|
||
- 往右倾斜 → 稳定显示右视图
|
||
|
||
**当前行为：**
|
||
- 轻微倾斜就触发切换，且图片在左右之间来回振荡
|
||
- 没有平衡点让图片稳定
|
||
|
||
---
|
||
|
||
## 2. 根本原因
|
||
|
||
**原因：缺少中性阈值区（Dead Zone）**
|
||
|
||
陀螺仪数据直接映射到图片切换阈值，没有任何"容忍区"。
|
||
|
||
当设备略微偏离中心时：
|
||
- `gamma` 值微小的正负变化
|
||
- 直接导致 `x` 方向变化
|
||
- 触发 opacity 切换
|
||
|
||
加上陀螺仪本身的噪声和设备轻微晃动，导致图片不断在左右之间来回切换。
|
||
|
||
---
|
||
|
||
## 3. 修复方案
|
||
|
||
**文件:** `frontend/composables/useHolographicPreview.js`
|
||
|
||
### 修改：增大中性阈值区
|
||
|
||
当前代码已有 dead zone 判断逻辑，只需增大 `db` 系数即可：
|
||
|
||
```javascript
|
||
// 第79行
|
||
const db = 0.08 * dead // 从 0.016 改为 0.08
|
||
```
|
||
|
||
**说明：** 增大 db 系数 = 中性区变宽 = 更难触发切换 = 图片更稳定
|
||
|
||
---
|
||
|
||
## 4. 参数调整
|
||
|
||
| 参数 | 当前值 | 修改后 | 说明 |
|
||
|------|--------|--------|------|
|
||
| db (dead zone) | 0.016 | 0.08 | 中性区阈值，越大越难触发切换 |
|
||
|
||
**建议值范围：** 0.05 ~ 0.12
|
||
- 值越大：中性区越宽，越稳定但响应越慢
|
||
- 值越小：越敏感，但容易误触发
|
||
|
||
---
|
||
|
||
## 5. 验收标准
|
||
|
||
| 测试场景 | 期望结果 |
|
||
|---------|---------|
|
||
| 设备静止居中 | 显示中性图，稳定不动 |
|
||
| 轻微倾斜 | 保持中性，不触发切换 |
|
||
| 明显往左倾斜 | 显示左视图，稳定 |
|
||
| 明显往右倾斜 | 显示右视图，稳定 |
|
||
| 从倾斜缓慢回到居中 | 平滑过渡，无振荡 |
|
||
|
||
---
|
||
|
||
## 6. 影响范围
|
||
|
||
- 修改文件：`frontend/composables/useHolographicPreview.js`
|
||
- 不影响触摸滑动交互
|
||
- 不涉及后端或数据库 |