---
id: photo-capture
name: 照片采集与管理
area: rn-app
status: done
---

## 概述

调用设备摄像头或相册为物品条目添加多张照片，照片存储到 App 专属目录，路径写入 SQLite photos 表。支持 Android 13+ 权限模型（CAMERA + READ_MEDIA_IMAGES + FileProvider）。

## 任务卡

### ✅ 摄像头调用与照片存储
- status: done
- complexity: M
- files: apps/property-survey/src/features/photo/usePhotoCapture.ts, apps/property-survey/src/features/photo/PhotoPicker.tsx
- depends: local-data-layer
- acceptance: 使用 expo-image-picker（MediaType.Images，已从废弃的 MediaTypeOptions 迁移）；「拍照」和「从相册选择」两种入口；Alert 关闭后延迟 300ms 启动，避免与系统权限弹窗冲突；照片复制到 App 专属目录（expo-file-system）；调用 insertPhoto 写入数据库；有权限检查

### ✅ Android 权限与 FileProvider 配置
- status: done
- complexity: S
- files: apps/property-survey/android/app/src/main/AndroidManifest.xml, apps/property-survey/android/app/src/main/res/xml/file_paths.xml, apps/property-survey/app.json
- acceptance: AndroidManifest 声明 CAMERA + READ_MEDIA_IMAGES 权限（兼容 Android 13+）；配置 FileProvider（android:authorities="${applicationId}.provider"）支持相机临时文件 URI；app.json 中 expo-image-picker 插件配置中文权限说明

### ✅ 照片网格预览与删除（物品表单内）
- status: done
- complexity: M
- files: apps/property-survey/src/features/photo/PhotoGrid.tsx
- depends: photo-capture
- acceptance: 3 列网格展示已添加的照片缩略图；点击照片全屏预览（FlatList + pagingEnabled + getItemLayout，使用 useWindowDimensions 实时宽度计算每页偏移）；全屏预览顶部有「保存到相册」按钮（expo-media-library，保存后显示"已保存"提示）；长按照片显示「删除」确认弹窗，删除时同步调用 deletePhoto（含文件系统删除）；末尾显示「+」按钮触发 PhotoPicker

### ✅ 查看模式照片面板（MarkerPhotoPanel）
- status: done
- complexity: M
- files: apps/property-survey/src/features/photo/MarkerPhotoPanel.tsx
- depends: photo-capture
- acceptance: 查看模式下右侧面板；按物品分组展示照片缩略图（4 列网格 + 物品名标题）；点击缩略图全屏 Modal 预览；Modal 为非透明全屏黑底（解决 Android transparent Modal 仅覆盖父容器的问题）；单张显示 + onTouchStart/End 手势滑动切换（≥50px 触发）+ 左右箭头按钮；计数器实时同步

## 决策记录

- **照片预览放弃 ScrollView/FlatList pagingEnabled**：在 Android 上 `transparent` Modal 的渲染范围被限制在父组件（右侧 260px 面板）内而非全屏，导致 `pagingEnabled` 页宽与实际视口不匹配，两张照片始终并排显示。尝试多种宽度测量方案（`SCREEN_W` 静态值、`onLayout` 动态测量、`useWindowDimensions`）均无效。最终改为单张显示 + 原生 Touch 事件手势，彻底绕开分页宽度问题。
- **Modal 去掉 `transparent` prop**：`transparent={true}` 在 Android 上使 Modal 继承父容器的渲染上下文（右侧面板），只遮盖面板区域而非全屏。改为非透明 Modal + 黑色背景，强制创建独立原生全屏窗口。