3dbc6f0ff5
- 标记点角标从物品数量改为按楼层顺序编号，角标背景色跟随标记颜色 - FoldableLayout 改为绝对定位叠加布局，移除 LayoutAnimation（解决 Android 地图渲染空白及卡顿） - PhotoPicker 拆分为拍照/选图两个独立按钮；选图改用 expo-document-picker 绕过三星 Photo Picker 崩溃问题 - AndroidManifest 移除手动 FileProvider 声明（改由 Expo 插件自动注入） - 同步更新蓝图文档：新增 category-management 模块、补全各模块已完成任务卡 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
54 lines
2.6 KiB
Markdown
54 lines
2.6 KiB
Markdown
---
|
||
id: survey-app-shell
|
||
name: 应用外壳与折叠屏布局
|
||
area: rn-app
|
||
status: done
|
||
---
|
||
|
||
## 概述
|
||
|
||
React Native (Expo SDK 52 + Expo Router) 应用骨架，实现 Z Fold 6 折叠/展开双形态布局切换。折叠时单栏显示，展开时左侧地图 + 右侧表单双栏并排。底部导航含「登记」「汇总」「设置」三个 Tab。
|
||
|
||
## 任务卡
|
||
|
||
### ✅ Expo 应用骨架初始化
|
||
- status: done
|
||
- complexity: M
|
||
- files: apps/property-survey/app.json, apps/property-survey/package.json, apps/property-survey/app/_layout.tsx, apps/property-survey/app/index.tsx, apps/property-survey/app/summary.tsx, apps/property-survey/app/settings.tsx
|
||
- depends: local-data-layer
|
||
- acceptance: `pnpm --filter property-survey start` 能启动；底部导航在「登记」「汇总」「设置」三个页面间切换；根布局包裹 CategoriesProvider；SQLite 数据库在启动时完成初始化
|
||
|
||
### ✅ 折叠屏状态感知 Hook
|
||
- status: done
|
||
- complexity: S
|
||
- files: apps/property-survey/src/layout/useFoldState.ts
|
||
- acceptance: useFoldState 返回 `{ isUnfolded: boolean, windowWidth: number }`，以 720px 为断点区分折叠/展开状态，useWindowDimensions 变化时自动更新
|
||
|
||
### ✅ 双栏/单栏自适应布局容器
|
||
- status: done
|
||
- complexity: M
|
||
- files: apps/property-survey/src/layout/FoldableLayout.tsx
|
||
- depends: survey-app-shell
|
||
- acceptance: 展开时渲染左右两栏（左侧 flexGrow:1 地图区，右侧 260px 详情区动画展开）；接受 `left` `right` `showDetail` 三个 prop；`showDetail` 控制右侧面板以 `LayoutAnimation.configureNext` 动画展开/收起（替代 JS 线程 Animated.timing，解决 Android 地图渲染空白及卡顿）；折叠时只渲染左侧
|
||
|
||
### ✅ 楼层切换标签组件
|
||
- status: done
|
||
- complexity: S
|
||
- files: apps/property-survey/src/layout/FloorTabs.tsx
|
||
- depends: survey-app-shell
|
||
- acceptance: 显示 1F / 2F / 3F / 楼顶 四个标签；选中项高亮；onChange 回调传出当前楼层数字（1/2/3/4）
|
||
|
||
### ✅ 查看/编辑模式切换
|
||
- status: done
|
||
- complexity: S
|
||
- files: apps/property-survey/app/index.tsx
|
||
- depends: survey-app-shell
|
||
- acceptance: 顶栏左侧显示「查看 | 编辑」分段控件；查看模式下右侧面板渲染 MarkerPhotoPanel，编辑模式下渲染 ItemFormSheet；无选中标记时右侧面板为空（showDetail=false，动画收起）；默认为编辑模式
|
||
|
||
### ✅ 查看模式照片面板集成
|
||
- status: done
|
||
- complexity: S
|
||
- files: apps/property-survey/app/index.tsx
|
||
- depends: photo-capture
|
||
- acceptance: 选中标记点且处于查看模式时，showDetail=true，右侧面板渲染 MarkerPhotoPanel；切换楼层或模式时自动清空 selectedMarker
|