UI Restoration Memory

这份记录用于避免“每次看到一个问题再修一个问题”。任何按设计稿实现的页面都必须遵守以下闭环。

失败根因

过去的重叠、出框和按钮不可读，主要来自四个错误：

图片、文字和命中区各自使用独立坐标，没有共同的设计画布。
生成素材没有记录内容安全框、固定边缘和可拉伸中心。
空状态、选中态、禁用态共用一个布局，信息密度变化后发生重叠。
自动化测试只验证节点和点击，没有验证真实截图中的像素关系。

实现前必须产出的契约

每个组件都要有一条记录：

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_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 再做最终确认。

出现问题时的修复顺序

素材来源 → 比例/裁切 → 图层所有权 → 图层对齐 → 主体尺寸
→ 文字槽位 → 溢出/对比度 → 命中区

禁止跳过前面的边界，直接通过缩小字体、增加遮罩或叠加新面板来掩盖问题。

2.6 KiB Raw Blame History Unescape Escape