docs(plans): 留痕 K51 详情页灰屏修复

This commit is contained in:
Zhou Weidong committed 2026-10-20 17:33:33 +08:00
1 parent 1de202ad4a
commit d34410971a
2 files changed
+46 -18

No files matched your search

+17 -18
View File
@@ -1,26 +1,25 @@
## [已处理] 2026-10-20 | K50-A 开屏页动画(FruitShorts 品牌呈现)+ 新图标接入校验(仅 App 端)
## [已处理] 2026-10-20 | K51-A 修复首页进入详情页闪屏/灰屏(仅 App 端)
**用户指令(2026-10-20,原文)**:
> 「1现在改下app 图标 要表现出来水果短剧 可以放一个果篮 里面有各种水果 要有视频元素 2还有开屏页 要有动画体现出水果短剧 FruitShorts」
> 「从首页进短剧详情页会闪屏 灰屏看下什么问题」
**当前进度(图标资源已由 Trae 生成并替换,不要覆盖)**
- 新图标:暖橙渐变底 + 编织果篮(橙子、苹果、葡萄)+ 白色圆形播放键;
- 已替换:`android/.../mipmap-*/ic_launcher.png`、`drawable-*/ic_launcher_foreground.png`、`drawable-*/splash_icon.png`、`assets/icon/fruitshorts.png`(1024)、`assets/icon/splash_mark.png`(512)、iOS `AppIcon.appiconset/*.png`;
- 自适应图标背景色 `values/colors.xml` 的 `ic_launcher_background` 已改为 `#FFF1E5`。
**根因(已定位)**
`PlayerLogic.openDetail()` 在 push 详情页之前先执行:
1. `session.setRouteVisible(false)` —— 视频层被隐藏/降级为未就绪状态,feed 只能渲染封面占位;
2. `await session.playbackSettled` —— 等待期间首页仍可见;
此时封面若尚未进图片缓存,`RemoteImage` 会先画浅色底,叠加遮罩后呈灰白 → 用户看到的就是进详情前的灰屏闪一下;随后 `saveCurrentProgress` 再等待一次,进一步放大该可见窗口。
**本次只做开屏动画(`lib/pages/splash/splash_page.dart`)**
1. 背景改为深暖色 `#100C0A`(与原生 `splash_background` 一致,避免原生开屏 → Flutter 白闪);状态栏内容浅色。
2. 动画(总时长约 1200ms,`AnimationController` + CurvedAnimation):
- 0–500ms:`splash_mark.png` 从 0.86 缩放到 1.0,opacity 0→1(`Curves.easeOutBack`),画布 96×96、圆角 24、带柔光(主色 0x33FF7A1A 径向渐变 + blur 40);
- 150–650ms:品牌名 `FruitShorts`(28 号 w900 白色,Outfit)从下方 12px 滑入 + 淡入;Key `splash-brand`;
- 300–800ms:中文标语「水果短剧」(13 号 white70,字距 4),Key `splash-tagline`;
- 500–1000ms:底部 22×22 主题色 `CircularProgressIndicator`(Key `splash-loading`)淡入,保持现有加载语义;
- 可选:背景两团极淡暖色光斑做缓慢呼吸(4s 循环,透明度 ≤0.08)。
3. 页面 Key `splash-screen` 保留;不使用第三方动画库;动画不可无限阻塞首帧,`HomePage` 数据就绪后正常替换。
4. 不修改图标 PNG 与 colors.xml;如发现自适应图标前景比例异常,只允许调整 `ic_launcher.xml` 的 inset(16% → 20%),不改图。
**口径(只改 Flutter,不动后端、不改接口)**
1. `openDetail()` 改为先 push 路由(视频组件保持挂载,不再 `setRouteVisible(false)`、不再 `await playbackSettled` 后再 push):
- push 之前 `session.setOverlayOpen(true)`,路由返回后 `session.setOverlayOpen(false)`(复用评论面板的暂停/恢复方式,保证详情页覆盖期间不继续外放声音);
- 路由期间视频正常暂停,返回后回到原播放状态与进度,不重新 seek。
- `saveCurrentProgress()` 放到 push 返回之后(不阻塞首帧)。
2. 首页 feed 的「标题点击进详情」「系列信息点击进详情」走同一逻辑,确保都不闪。
3. 详情页自身加载态保持 ink 背景 + 现有骨架,不改。
**测试/门禁**
- 新增:`splash-brand`、`splash-tagline`、`splash-loading` 存在;动画推进 1200ms 后 opacity 均为 1;
- 新增:从 feed 点详情后,push 前后视频 port 保持挂载(可断言 `session.active` 不变)、路由返回后播放状态与进度不变;
- 不再出现 `setRouteVisible(false)` 造成的占位渲染;
- `dart analyze lib test` 零告警 + `flutter test` 全过 + `flutter build apk --debug`。
**流程**:从 `develop` 拉 `feature/flutter-k50-splash-animation`;作者 `Zhou Weidong <502333560@qq.com>`;`--no-ff` 合回 develop 并 push;PROGRESS 留痕;真机验收由用户执行(安装后看桌面图标 + 开屏动画)。
**流程**:从 `develop` 拉 `fix/flutter-k51-detail-flash`;作者 `Zhou Weidong <502333560@qq.com>`;`--no-ff` 合回 develop 并 push;PROGRESS 留痕;真机验收由用户执行。