docs(plans): 留痕 K34-H 吸顶闪动修复

This commit is contained in:
Zhou Weidong committed 2026-10-20 15:25:27 +08:00
1 parent ee43b4e186
commit 7c5800bef1
2 files changed
+74

No files matched your search

+44
View File
@@ -1,3 +1,47 @@
## [待执行] 2026-10-20 | K36-A 新剧页「首映厅」+ 预约页「档期票」创意 UI(仅 App 端)
**用户指令(2026-10-20,原文)**:
> 「接下来写新剧和预约页面 你来设计UI 要有创意 与其他页面不同 足够吸引人」
**整体设计方向**:与现有浅色暖橙页面形成对比但同源——新剧页走「暗色首映厅」,预约页走「暖色电影票 + 周历」,两页各有记忆点。
### 一、新剧页(`lib/pages/new_releases/new_releases_page.dart`,Key `new-releases-page`)
1. 页面底色:深棕渐变 `#1F1B16 → #2E2119`,状态栏浅色图标;顶部返回栏(Key `new-releases-back`)透明底、白色图标。
2. 头部:标题「新剧首映」(新增 l10n `newReleasesTitle`,26 号 w900 白)+ 副标题「最新上架短剧」+ 右侧橙色胶囊「本周上新 N 部」(`newReleasesCount(n)`)。
3. 「今日首映」大卡(Key `new-releases-hero`):
- 16:9 封面铺满、圆角 18、底部黑→透明渐变遮罩;
- 左上角橙色 `NEW` 角标(`newBadge`);
- 底部左侧:剧名(20 号 w800 白,2 行)+ 题材标签 + `formatInteractionCount(viewCount)` 热度;右侧主色圆形播放按钮(40,`Icons.play_arrow_rounded`,Key `new-releases-hero-play`);
- 点击任意处直达播放页。
4. 电影胶片分隔线:一条 22 高的「胶片条」(深色底 + 上下两排 8 个 6×8 圆角孔洞,主色 0x33FFFFFF),制造仪式感。
5. 「更多新剧」区块:标题白 16 w800 + 右侧「查看全部」弱化链接;下方横向滑动卡片(Key `new-releases-row`):封面 108×144 圆角 12、左上 `NEW` 小角标、下方剧名 13 w700 白(1 行)、日期文案(`MM/dd`,12 号 white54);点击直达播放页。
6. 数据:`CatalogController.dramas` 按 `id` 倒序;首部进今日首映,其后最多 12 部进横滑区;空数据时显示白色空态文案(`noStories`)。
### 二、预约页(`lib/pages/reserve/reserve_page.dart`,Key `reserve-page`)
1. 页面底色 `AppColors.ink`,顶部返回栏(Key `reserve-back`)+ 标题「档期预约」(新增 l10n `reserveTitle`,24 号 w800)+ 副标题(复用 `reserveSubtitle`)。
2. 周历条(Key `reserve-week-strip`):「本周待播」小标题 + 一行 7 个日期胶囊(Key `reserve-day-<0..6>`),显示星期缩写与日号;今天为主色实底白字,其余白底描边;点击切换选中态(本地状态,无数据联动)。
3. 空态「电影票」卡(Key `reserve-empty`):
- 白卡、圆角 20、左右两侧各 12px 半径的半圆缺口(用 `ClipPath`/`Stack` 圆角覆盖实现票根撕口效果),虚线描边(`CustomPainter` 画圆角虚线,主色 0x66FF7A1A);
- 内部:主色浅底圆形铃铛(`Icons.notifications_active_rounded`,32)+ 「暂无预约剧集」(`reserveEmptyTitle`,17 w800)+ 「新剧上线后可在这里预约」(`reserveEmptyHint`,12 muted);
- 主色实心按钮「去新剧页看看」(`goNewReleases`,Key `reserve-go-new`)→ `Navigator.push` 新剧页。
4. 预约说明(Key `reserve-steps`):小标题「预约后你会得到」(`reserveStepsTitle`)+ 三行步骤卡(白底圆角 12、左侧主色序号圆点 1/2/3 + 标题):
- `reserveStep1`「一键预约」/ `reserveStep2`「开播提醒」/ `reserveStep3`「立即追剧」;
- 序号为主色 12 w800 白字圆点 22。
5. 不伪造预约列表与开播时间,全部为空态 + 说明。
### 三、l10n 新增(三份 arb + `flutter gen-l10n`)
`newReleasesTitle`、`newReleasesCount(n)`、`premiereToday`、`newBadge`、`moreNewDramas`(新剧页可复用 `seeAll` 则不必新增)、`reserveTitle`、`goNewReleases`、`reserveStepsTitle`、`reserveStep1/2/3`、`reserveWeek`(zh:本周待播)。给出中/英/印尼三语文案。
**测试/门禁**
- 新剧页:`new-releases-hero` 与 `new-releases-row` 存在、首映卡点击进播放页、`NEW` 角标数量正确;
- 预约页:周历 7 个胶囊、今天为主色、`reserve-empty` 与三个步骤存在、`reserve-go-new` 可跳转新剧页;
- 剧场工具行「新剧 / 预约」分别进入上述页面;
- `dart analyze lib test` 零告警 + `flutter test` 全过 + `flutter build apk --debug`。
**流程**:从 `develop` 拉 `feature/flutter-k36-premiere-reserve`;作者 `Zhou Weidong <502333560@qq.com>`;`--no-ff` 合回 develop 并 push;PROGRESS 留痕;真机验收由用户执行。
---
## [已处理] 2026-10-20 | K35-A 剧场卡片去免费角标 + 创作页按参考布局重做(暖橙视觉)(仅 App 端)
**用户指令(2026-10-20,原文)**:
+30
View File
@@ -21167,3 +21167,33 @@ Running Gradle task 'assembleDebug'...
```
解读:静态检查零告警,430 条测试全部通过,debug APK 构建成功。工作区原有 `pubspec.lock` 变更未纳入本批提交。真机验收由用户执行。
## 2026-10-20 ReelShort:K34-H 彻底修复剧场分类行上滑闪动
- 分支:`fix/flutter-k34-sticky-flash`
- 功能提交:`6463436 fix(flutter): 吸顶分类行背景常驻清除闪动`
- develop 合并提交:`fdee89b merge: 合并 K34-H 吸顶闪动修复`,已推送。
- 根因:吸顶行背景在 offset==0 时透明,滚动后 200ms 渐变为 ink,动画期间列表内容透出形成闪动。
- 修复:吸顶背景常驻 `AppColors.ink` 不再动画;`ValueListenableBuilder` 只切换底部 1px 分隔线与阴影(160ms 过渡);分类行仍用 `KeyedSubtree('theater-sticky-content')` 不随滚动重建。
- 剧场页内容区(含嵌入首页 Tab)包 `ColoredBox(Key theater-page-surface, AppColors.ink)`,覆盖外层暖色渐变,搜索框区域与吸顶行同色无接缝。
- 间距、下划线选中、工具行滚走、刷新 edgeOffset 52 保持不变。
测试:offset 0 与上滑后吸顶背景均为 `AppColors.ink`、上滑后出现底部 `AppColors.border` 分隔线;剧场页面底色为 ink。
门禁原始输出:
```text
$ dart analyze lib test
Analyzing lib, test...
No issues found!
$ flutter test
00:44 +431: All tests passed!
$ flutter build apk --debug
Running Gradle task 'assembleDebug'...
7.6s
✓ Built build/app/outputs/flutter-apk/app-debug.apk
```
解读:静态检查零告警,431 条测试全部通过,debug APK 构建成功。工作区原有 `pubspec.lock` 变更未纳入本批提交。真机验收由用户执行。