docs(plans): 留痕 K32-A 剧场页重做
This commit is contained in:
1 parent
83f7890851
commit
3755b766af
2 files changed
+89
No files matched your search
@@ -1,3 +1,60 @@
|
||||
## [已处理] 2026-10-20 | K32-A 剧场页按参考图重做(仅 App 端)
|
||||
|
||||
**用户指令(2026-10-20,原文)**:
|
||||
> 「现在改剧场页面 看这个效果图」
|
||||
|
||||
**参考图**:`20261020-131821.jpg`(搜索框 + 「识剧」;一行纯文字分类 tab;筛选/排行榜/新剧/预约 四个工具按钮;双列海报卡:左上「新剧」角标、左下「4794万热度」、封面下标题 + 灰底题材标签)。
|
||||
|
||||
**现状**(`lib/pages/discover/`)
|
||||
- `discover_view.dart`:顶部 `DiscoverHeader`(搜索 + 头像)→ `_categoryChips()`(ChoiceChip 胶囊 Wrap)→ `DramaGrid`;底部导航 4 槽。
|
||||
- `widgets/drama_grid.dart`:卡片为白底圆角卡 + 阴影,封面 3/4,左上免费/原创、右上锁定、右下总集数,下方标题 + 题材 + 28 加号。
|
||||
- `widgets/discover_search_field.dart`:普通搜索框,无「识剧」入口。
|
||||
|
||||
**口径(只改 Flutter,不动后端、不改接口;底部导航保持现有 4 槽不变)**
|
||||
|
||||
1. 顶栏(`discover_header.dart`)
|
||||
- 去掉右侧头像按钮,搜索框占满整行;高度 40、白色底、圆角 18、左右内边距 14。
|
||||
- 搜索框内左侧放大镜(灰),右侧内嵌「识剧」胶囊:浅灰底(`AppColors.raised`)、圆角 999、高 26,内含小图标(`Icons.center_focus_weak_rounded`,14)+ 文案 `识剧`(12 号、`AppColors.muted`),Key `discover-identify`。
|
||||
- 「识剧」点击弹出 SnackBar「识剧功能即将上线」(l10n `comingSoon`);`discover-search` Key 保持在 TextField 上。
|
||||
|
||||
2. 分类 tab(替换现有 ChoiceChip 胶囊)
|
||||
- 横向滚动纯文字行,高 44,左右内边距 14,项间距 20;容器 Key 仍为 `theater-category-chips`,每项 Key 仍为 `theater-category-all` / `theater-category-<id>`。
|
||||
- 选中:16 号、`FontWeight.w800`、`AppColors.onSurface`;未选中:15 号、w500、`AppColors.muted`;不加任何底色/描边。
|
||||
- 点击行为与现状一致(`logic.selectCategory`)。
|
||||
|
||||
3. 工具按钮行(新增)
|
||||
- 一行 4 个等宽按钮,间距 10,左右内边距 14,位于分类 tab 与网格之间,上下各 10/12。
|
||||
- 单按钮:白底、圆角 10、1px `AppColors.border`、高 36,内容为图标 16 + 4 + 文案 13 w600 `AppColors.onSurface`。
|
||||
- 依次:筛选(`Icons.tune_rounded`,图标色 `#7B61FF`)、排行榜(`Icons.local_fire_department_rounded`,`AppColors.blue`)、新剧(`Icons.play_circle_fill_rounded`,`#14B8A6`)、预约(`Icons.calendar_month_rounded`,`AppColors.blue`)。
|
||||
- Key:`theater-toolbar-filter`、`theater-toolbar-ranking`、`theater-toolbar-new`、`theater-toolbar-reserve`。
|
||||
- 行为:筛选 → 底部筛选面板列出「全部 + 现有分类」,点选后调用 `logic.selectCategory` 并关闭;排行榜 / 新剧 / 预约 → SnackBar「即将上线」(l10n `comingSoon`),不伪造数据。
|
||||
|
||||
4. 双列卡片(`drama_grid.dart`)
|
||||
- 去掉外层白色卡底、阴影与内边距(透明背景),列间距 8、行间距 14、左右内边距 12。
|
||||
- 封面:全宽、比例 3/4、圆角 10、`BoxFit.cover`;左上角保留「免费 / 原创」语义角标,改为绿底(`#12B76A`)白字 10 号 w700 胶囊,Key 仍为 `drama-tag-<id>`。
|
||||
- 封面左下新增热度角标:半透明黑底(`0x99000000`)胶囊 + 白色火焰图标(11)+ 文案 `formatInteractionCount(viewCount)` + `热度`,Key `drama-heat-<id>`。
|
||||
- 删除右上锁定角标、右下总集数角标、底部加号及其常量。
|
||||
- 封面下 8px 为标题:最多 2 行、15 号 w700、`AppColors.onSurface`,Key 仍为 `home-drama-title-<id>`。
|
||||
- 标题下 6px 为题材标签行:最多 3 个,来源 `[genre, category]` 去空去重(按 `,` `/` `、` ` · ` 拆分);每个标签浅灰底 `#F4F1EE`、圆角 6、左右 6 上下 2、11 号 `AppColors.muted`,Key `drama-tag-chip-<id>-<index>`。
|
||||
- 整卡点击 Key 仍为 `home-drama-card-<id>`,封面 Key 仍为 `home-drama-cover-<id>`;网格容器 Key `home-all-dramas-grid` 不变。
|
||||
|
||||
5. l10n 新增(三份 arb + `flutter gen-l10n`)
|
||||
- `reserve`:zh 预约 / en Reserve / id Reservasi
|
||||
- `identifyDrama`:zh 识剧 / en Identify / id Identifikasi
|
||||
- `heatLabel`(占位符 count):zh 「{count}热度」/ en 「{count} heat」/ id 「{count} panas」
|
||||
- `comingSoon`:zh 即将上线 / en Coming soon / id Segera hadir
|
||||
|
||||
6. 搜索态与下拉刷新、错误态、空态、`DramaDetailPage` 跳转逻辑全部不变。
|
||||
|
||||
**测试/门禁**
|
||||
- 更新既有用例:`discover-profile` 不再存在(改为断言 `discover-identify`);锁定/总集数/加号相关断言删除;新增热度角标、题材标签、工具按钮存在性断言;`theater-category-chips`、`theater-category-7` 点击切换仍通过。
|
||||
- 新增用例:点击筛选工具按钮出现筛选面板;点击 `discover-identify` 出现 SnackBar。
|
||||
- `dart analyze lib test` 零告警 + `flutter test` 全过 + `flutter build apk --debug`。
|
||||
|
||||
**流程**:从 `develop` 拉 `feature/flutter-k32-theater-redesign`;作者 `Zhou Weidong <502333560@qq.com>`;`--no-ff` 合回 develop 并 push;PROGRESS 留痕;真机验收由用户执行。
|
||||
|
||||
---
|
||||
|
||||
## [已处理] 2026-10-20 | K31-G 首页顶栏星期文字改为通知铃铛入口(仅 App 端)
|
||||
|
||||
**用户指令(2026-10-20,原文)**:
|
||||
|
||||
Reference in new issue
Block a user