69 lines
2.6 KiB
Markdown
69 lines
2.6 KiB
Markdown
# UI Restoration Memory
|
||
|
||
这份记录用于避免“每次看到一个问题再修一个问题”。任何按设计稿实现的
|
||
页面都必须遵守以下闭环。
|
||
|
||
## 失败根因
|
||
|
||
过去的重叠、出框和按钮不可读，主要来自四个错误：
|
||
|
||
1. 图片、文字和命中区各自使用独立坐标，没有共同的设计画布。
|
||
2. 生成素材没有记录内容安全框、固定边缘和可拉伸中心。
|
||
3. 空状态、选中态、禁用态共用一个布局，信息密度变化后发生重叠。
|
||
4. 自动化测试只验证节点和点击，没有验证真实截图中的像素关系。
|
||
|
||
## 实现前必须产出的契约
|
||
|
||
每个组件都要有一条记录：
|
||
|
||
```text
|
||
component_id
|
||
source_asset / intrinsic_size / alpha_policy
|
||
design_bounds / safe_content_bounds
|
||
text_slots / icon_slots / hit_rect
|
||
stretch_policy / nine_patch_margins / min_play_size
|
||
foreground_background_contrast
|
||
empty / selected / disabled / loading / error variants
|
||
```
|
||
|
||
没有这条记录，不能把素材接入页面。
|
||
|
||
## 实现顺序
|
||
|
||
```text
|
||
冻结设计稿
|
||
→ 测量画布和组件边界
|
||
→ 确认静态/运行时/命中区所有权
|
||
→ 先放静态素材
|
||
→ 再按 text_slots 放动态内容
|
||
→ 为每个状态建立独立布局
|
||
→ 检查最小/标准/宽屏截图
|
||
→ 通过后再迁移下一页
|
||
```
|
||
|
||
Market 的运行时文字槽位目前由
|
||
`runtime/ui/shared/m52_market_slots.gd` 集中维护。页面只读取这些归一化
|
||
槽位，不得在 `market_page_view.gd` 重新写同一组比例坐标；状态差异只能通过
|
||
`empty_*`、`selected_*` 等命名槽位表达。这样素材、文字和命中区才会共享同一
|
||
张 16:9 设计画布，后续页面迁移也能复用这条规则。
|
||
|
||
## 硬性验收
|
||
|
||
- 不允许纯文字按钮、重复边框、调试文案或烘焙价格。
|
||
- 文字必须完全位于自己的槽位；超长文本优先换行，不能压到相邻组件。
|
||
- 浅色材质使用深色墨水字，深色材质使用米白字；不能只凭“看起来差不多”。
|
||
- 背景可以 aspect-cover，设计画布必须保持固定比例；图标和人物保持比例。
|
||
- 每次视觉迭代必须保留 `static-only`、`dynamic-only`、`final-composite`
|
||
三种截图。
|
||
- 最小测试矩阵为 760×360、844×390、1280×720，中英文、空状态和选中态。
|
||
- 自动化通过不等于视觉通过；必须由 Agent 检查截图，Owner 再做最终确认。
|
||
|
||
## 出现问题时的修复顺序
|
||
|
||
```text
|
||
素材来源 → 比例/裁切 → 图层所有权 → 图层对齐 → 主体尺寸
|
||
→ 文字槽位 → 溢出/对比度 → 命中区
|
||
```
|
||
|
||
禁止跳过前面的边界，直接通过缩小字体、增加遮罩或叠加新面板来掩盖问题。
|