可通过四种方法获取pxcook中图层描边属性:一、在图层面板直接查看;二、将描边转为独立图层后用标尺和取色器测量;三、导出json文件人工解析stroke字段;四、启用开发者模式调用控制台命令获取原始描边数据。

如果您在使用PxCook查看设计稿时需要获取图层的描边属性,但无法直接识别边框宽度、颜色或样式参数,则可能是由于描边未被正确解析或图层类型不支持自动提取。以下是获取描边属性的具体操作方法:
一、通过图层面板直接查看描边信息
PxCook在导入Sketch或XD文件后,若图层包含描边(Stroke),会在右侧属性面板中显示相关参数。该方式适用于已正确解析描边的矢量图层或形状图层。
1、在画布中单击选中目标图层(如矩形、圆角矩形、路径等支持描边的图层)。
2、观察右侧“图层属性”面板,向下滚动至描边(Stroke)区域。
3、确认是否显示描边宽度、颜色值(HEX/RGB)、描边位置(居中/内侧/外侧)、虚线间隔与长度等字段。
4、若字段为空或显示“无”,说明该图层实际未设置描边,或原始文件中描边被转为轮廓(Outline)而丢失样式信息。
二、将描边转为独立图层后分析
当原始设计稿中描边被转换为轮廓(即“Path”或“Compound Path”),PxCook无法识别其为描边样式,此时需将其还原为可识别的描边结构,或通过像素级测量反推参数。
1、在Sketch或Figma中重新选中该图层,执行Layer → Path → Outline Stroke的逆向操作(如存在“Convert to Outlines”的对应还原选项)。
2、若不可逆,则在PxCook中使用标尺工具(Ruler)按住Ctrl/Cmd键拖动测量边缘到边界距离,该距离即为描边宽度的一半(若为居中描边)或全宽(若为内侧描边)。
3、使用PxCook内置的取色器(Color Picker)点击描边区域任意一点,读取实时颜色值并记录HEX码。
三、导出JSON数据文件人工解析描边字段
PxCook支持将整个页面导出为JSON格式结构化数据,其中包含图层原始样式定义,描边参数以键值对形式存储于stroke相关字段下,适合批量提取或验证。
1、点击顶部菜单栏文件 → 导出 → 导出当前页为JSON,保存文件至本地。
2、用文本编辑器打开该JSON文件,搜索关键词"strokeColor"、"strokeWidth"、"strokeStyle"。
3、定位到目标图层对象(依据name或id字段匹配),读取其下"strokeWidth": 2、"strokeColor": {"r": 51, "g": 102, "b": 204}等具体数值。
4、若"strokeStyle"值为"dashed",继续查找"strokeDashArray"数组,其元素顺序对应虚线实段与空隙长度(单位px)。
四、启用开发者模式调用控制台输出描边属性
对于高级用户,PxCook桌面版内置Chromium内核,可通过开发者工具直接访问渲染图层的样式对象,获取未经UI过滤的原始描边数据。
1、在PxCook主界面按Ctrl+Shift+I(Windows)或 Cmd+Option+I(macOS)唤起开发者工具。
2、切换至Console标签页,输入命令:window.__pxcook__.getCurrentLayer().getStroke()并回车。
3、若返回对象非null,检查输出结果中的width、color、position、dashArray等属性值。
4、若提示undefined,执行window.__pxcook__.getCurrentLayer()确认当前图层是否为支持描边的ShapeLayer类型。











