troytt
/
diablo2-web
1
0
Fork 0
Code Issues 12 Pull Requests Packages Projects Releases Wiki Activity

人物属性界面（InvChar6）文字与背景凹槽石框没有对齐 #138

New Issue
Closed
opened 2026-09-21 02:00:12 +00:00 by troytt · 1 comment
troytt commented 2026-09-21 02:00:12 +00:00
Owner
Copy Link

问题描述

参考截图：https://screenshot-v2.corp.google.com/2mupf6g92p8hg
打开人物属性面板（快捷键 A / C）时，力量、敏捷、体力、精力、左右键伤害、命中率、防御力、耐力/生命/法力及四系抗性的标签和数值均落在了 InvChar6.dc6 背景石框的下方或框外。

根因分析

通过对 public/ui/char-sheet.png（320×432）进行逐像素凹槽框扫描发现：

  • 力量（Str）石框中心在 y = 91，但代码写成了 y = 112（整体向下偏了 +21px）；
  • 敏捷（Dex）石框中心在 y = 153，代码写成了 y = 174；
  • 体力（Vit）石框中心在 y = 239，代码写成了 y = 260；
  • 精力（Ene）石框中心在 y = 301，代码写成了 y = 324；
  • 右侧攻击伤害（y = 91, 115）、命中率（y = 152, 176）、防御（y = 201）、耐力/生命/法力（y = 238, 262, 300）、四抗（y = 341, 365, 389, 413）同样存在 15~25px 的垂直偏移与水平分栏偏移。

解决方案

依据 InvChar6.dc6 像素级实测的石框边界（精确到 1px），校准所有标签框与数值框的 (cx, cy) 坐标及红色加点按钮坐标，确保每一个文字和数字都垂直/水平居中于对应的石刻凹槽内。

### 问题描述 参考截图：https://screenshot-v2.corp.google.com/2mupf6g92p8hg 打开人物属性面板（快捷键 `A` / `C`）时，力量、敏捷、体力、精力、左右键伤害、命中率、防御力、耐力/生命/法力及四系抗性的标签和数值均落在了 `InvChar6.dc6` 背景石框的下方或框外。 ### 根因分析 通过对 `public/ui/char-sheet.png`（320×432）进行逐像素凹槽框扫描发现： - 力量（Str）石框中心在 `y = 91`，但代码写成了 `y = 112`（整体向下偏了 +21px）； - 敏捷（Dex）石框中心在 `y = 153`，代码写成了 `y = 174`； - 体力（Vit）石框中心在 `y = 239`，代码写成了 `y = 260`； - 精力（Ene）石框中心在 `y = 301`，代码写成了 `y = 324`； - 右侧攻击伤害（`y = 91, 115`）、命中率（`y = 152, 176`）、防御（`y = 201`）、耐力/生命/法力（`y = 238, 262, 300`）、四抗（`y = 341, 365, 389, 413`）同样存在 15~25px 的垂直偏移与水平分栏偏移。 ### 解决方案 依据 `InvChar6.dc6` 像素级实测的石框边界（精确到 1px），校准所有标签框与数值框的 `(cx, cy)` 坐标及红色加点按钮坐标，确保每一个文字和数字都垂直/水平居中于对应的石刻凹槽内。
troytt commented 2026-09-21 11:11:00 +00:00
Author
Owner
Copy Link

验证通过并已随提交 14443c6 修复关单

  1. 改动方案：

    • 严格对照暗黑 II 1.13c 原始石板雕刻规范，在 src/ui/character-sheet.ts 中重写各属性条目坐标。
    • 力量、敏捷、体力、精力标签与其数值框、30x30 升级加点按钮全部居中对齐至凹槽石框。
    • 右侧经验值、攻击等级、防御、四防抗性等区域均完成像素级校准。

  2. 验证结果：

    • 实机 DOM 截图完美嵌合底板背景，tests/ui-hud.test.ts 坐标与断言 100% 通过。
### 验证通过并已随提交 14443c6 修复关单 1. **改动方案**： - 严格对照暗黑 II 1.13c 原始石板雕刻规范，在 `src/ui/character-sheet.ts` 中重写各属性条目坐标。 - 力量、敏捷、体力、精力标签与其数值框、30x30 升级加点按钮全部居中对齐至凹槽石框。 - 右侧经验值、攻击等级、防御、四防抗性等区域均完成像素级校准。 2. **验证结果**： - 实机 DOM 截图完美嵌合底板背景，`tests/ui-hud.test.ts` 坐标与断言 100% 通过。
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
main
Labels
Clear labels
No items
No Label
Milestone
Clear milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
No Assignees
1 Participants
Notifications
Due Date
The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: troytt/diablo2-web#138
No description provided.
Delete Branch "%!s(<nil>)"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?