Files
FruitServer/docs/plans/2026-10-19-K20.md

61 lines
2.7 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# 2026-10-19 K20 客户端视觉统一
## 基线
- ReelShort `develop`: `42ce1d1`
- FruitServer `develop`: `810d9fc`
- 只改 ReelShort 视觉与布局;不改业务逻辑、接口、后端、Web、specs、main。
- 保留辣椒红 `AppColors.blue = #C4322A`。
## 统一 Token
新增 `lib/core/theme/app_dimens.dart`:
| Token | 值 |
| --- | --- |
| 页面左右边距 | 16 |
| 卡片圆角 / 内边距 | 16 / 16 |
| 内嵌块圆角 / 内边距 | 12 / 12 |
| 胶囊圆角 | 20 |
| caption / body / list / section / page | 12 / 14 / 15 / 16 / 20 |
| 导航标签 | 11 |
| 详情主标题 | 24 |
| 主按钮高度 | 48;整页主操作 52 |
| 点击区 | 44 × 44 |
| 导航高度 / 图标 | 64 / 22 |
| 进度条高度 / 圆角 | 4 / 4 |
| 账号卡高度 / 图标 / 标签 | 64 / 18 / 11 |
| 观看占位高度 | 114 |
## 改造顺序
1. 加 token 与主题:`AppDimens`、`AppColors.favorite`、深色唯一口径、
按钮最小高度、OutlinedButton 主题、AppBar/状态栏样式。
2. 新增 `AppBottomNav` / `AppBottomNavItem`,替换 home/discover/mine/player fallback。
3. 调整账号入口卡为 64 高、18 图标、11 标签、44 点击区,并回归 K19 首屏测试。
4. 收敛字号下限:业务文案 ≥12,导航 11;清理 9.5/10。
5. 收敛卡片圆角与间距:页面 16、卡片 16/12、区块 16/12。
6. 替换任务书列出的硬编码颜色;收藏红心使用 `AppColors.favorite`。
7. 统一详情、记录、下载进度条为 4 高、4 圆角、blueSoft/white24;播放器拖动条保持金色。
8. 统一页面/区块/列表标题层级与按钮高度,移除 mine 按钮 VisualDensity.compact。
9. 详情加载/失败分支补返回 AppBar,封面顶部加黑色渐变,详情边距 24→16。
10. 点赞/收藏选中态改实心图标;分类和 my tabs 补 selected 语义。
11. HeaderPill / LoginButton / 分类 Chip 点击区补到 44。
12. 列表页底部安全区补齐;观看记录占位高度 114,与真实卡片 padding 一致。
## 测试与门禁
- 新增 `AppDimens` token 测试与 `AppBottomNav` 组件测试。
- 不修改既有测试断言;视觉布局变化导致测试失败时改实现。
- `dart analyze lib test`
- `flutter test`
- `flutter build apk --debug`
## 风险与边界
- 账号卡升高到 64 可能重新挤压“我的”页首屏;必须保持 K19 语言设置和观看历史入口测试通过。
- 保留页面级深色 Theme 包装以降低大范围回归风险,但根 `themeMode` 必须固定 `dark`。
- 不碰 K21 范围:搜索、Android 返回键、播放器切票黑屏、登录后续操作、下拉刷新、
注销状态闭环、日期/时长格式、语言上送。
- 真机验收由用户执行,本批不提供设备侧截图或日志。