pxcook可通过三种方式实现任意两点像素距离测量:一是快捷键ctrl+alt+m(win)/cmd+option+m(mac)启用自由测量模式;二是调出标尺与参考线,记录坐标后按公式√[(x₂−x₁)²+(y₂−y₁)²]计算;三是导出svg用浏览器开发者工具精确定位测算。

如果您在使用PxCook进行设计稿标注时,需要获取图层上任意两个点之间的像素距离,但默认的智能标注无法满足自由选点需求,则可以通过内置的测量工具实现非约束性距离测算。以下是完成此操作的具体步骤:
一、启用自由测量模式
PxCook原生支持通过快捷键触发临时测量功能,无需依赖图层边界或锚点,可直接在画布任意位置点击起始点与终点,实时显示欧氏距离数值。该模式绕过自动识别逻辑,适用于间距校验、斜线长度估算等场景。
1、确保当前处于设计稿查看界面,且已成功加载PSD/Sketch/ XD等格式源文件。
2、按下键盘快捷键 Ctrl + Alt + M(Windows)或 Cmd + Option + M(macOS),此时鼠标指针将变为十字准星图标。
3、在画布任意位置单击确定第一个测量点,移动鼠标至目标第二点位置后再次单击,界面上即刻浮现出带单位的直线距离标注框。
二、使用标尺辅助线叠加测量
当需反复比对多个点位或验证角度关系时,可调出标尺并结合参考线构建虚拟坐标系,再通过读取X/Y轴偏移值手动计算两点间距。该方式适合对精度有更高要求且不依赖实时反馈的场景。
1、点击顶部菜单栏【视图】→【显示标尺】,或使用快捷键 Ctrl + R(Windows)/ Cmd + R(macOS)唤出标尺。
2、从水平或垂直标尺拖拽出两条参考线,分别对齐待测两点的中心位置(可通过放大视图+像素级微调确保对齐准确)。
3、记录两条参考线在标尺上的数值:设第一点坐标为(x₁, y₁),第二点为(x₂, y₂),则像素距离为 √[(x₂−x₁)² + (y₂−y₁)²],结果保留整数即可。
三、导出为SVG后借助开发者工具测量
对于复杂矢量图形或嵌套图层中难以精确定点的情况,可将当前画板导出为SVG格式,在浏览器中打开后利用F12开发者工具的元素尺寸检测能力完成高精度自由测距。
1、右键点击画板缩略图,选择【导出为SVG】,保存至本地磁盘。
2、用Chrome或Edge浏览器打开该SVG文件,按 F12 打开开发者工具,切换至【Elements】面板。
3、在SVG结构中定位到目标图形节点,查看其 transform 属性中的 translate 值或直接读取 x/y 属性,结合几何公式计算两点间直线距离。











