可通过图层面板、CSS代码面板、测量叠加对比、父容器继承检查及JSON导出解析五种方式获取PxCook中元素的opacity值:图层面板直接读取百分比并换算为小数;CSS面板提取opacity: x.x;中的数值;叠加参考色块后用吸管工具比对颜色推算;逐级检查父容器opacity并相乘得出合成值;JSON文件中查找opacity或rawOpacity字段并按需换算。

如果您在使用 PxCook 查看设计稿时,需要准确获取图层或元素的 opacity 数值,但界面未直接显示该参数,则可能是由于当前选中对象未启用透明度设置,或数值被继承/覆盖。以下是获取元素 opacity 不透明度数值的具体操作步骤:
一、通过图层面板查看Opacity数值
PxCook 的图层面板通常会显示所选图层的基础属性,包括不透明度。当图层实际应用了透明度时,该数值将以百分比形式呈现,并可直接读取对应的小数等效值。
1、在左侧图层列表中单击目标图层,确保其处于高亮选中状态。
2、观察右侧“属性”面板(若未显示,按 Ctrl+Shift+P 调出),查找标有“不透明度”或“Opacity”的输入框或滑块。
3、若该字段显示为 100%,则对应 opacity 值为 1.0;若显示为 65%,则对应 opacity 值为 0.65。
二、通过CSS代码面板提取opacity值
当设计稿导出为 Web 可视化模式后,PxCook 支持生成模拟 CSS 代码,其中包含标准 CSS 属性,opacity 值将作为独立声明项出现,可据此反推原始数值。
1、右键点击画布中的目标元素,选择“复制 CSS 样式”或点击顶部工具栏中的“CSS”图标。
2、在弹出的代码面板中查找包含 opacity: 的行,例如 opacity: 0.4;。
3、提取冒号后、分号前的数字,即为该元素的 opacity 值,范围严格限定在 0.0 至 1.0 之间。
三、通过测量模式叠加对比识别透明度
当图层未显式标注 opacity,但视觉上呈现半透效果时,可通过与已知不透明度的参考色块叠加比对,结合 PxCook 的吸色与数值换算功能间接判定。
1、在画布空白处新建一个纯色矩形,设置其填充为 #FFFFFF,并手动将不透明度设为 50%(即 opacity=0.5)。
2、将该矩形拖至待测图层正上方,保持完全重叠,开启“像素对齐”与“锁定移动”。
3、使用吸管工具(I 键)点击重叠区域中心,观察拾取到的颜色十六进制值;若结果趋近于 #BFBFBF(白底×0.5),则可确认原图层 opacity ≈ 0.5。
四、检查父容器Opacity继承影响
子图层的最终可见透明度可能受上级图层组或容器的 opacity 设置影响,PxCook 中此类继承关系不会自动合并显示,需逐级展开验证。
1、在图层面板中点击目标图层所在文件夹左侧的三角箭头,展开其父级容器。
2、依次选中每一级父图层,查看右侧属性面板中的“不透明度”值。
3、若某父级设置为 80%(opacity=0.8),而子图层自身设为 75%(opacity=0.75),则实际合成 opacity 为 0.8 × 0.75 = 0.6。
五、导出JSON资源文件解析Opacity字段
PxCook 支持将项目导出为结构化 JSON 格式,其中每个图层对象均包含 rawOpacity 或 opacity 字段,该值为原始设计工具写入的精确浮点数。
1、点击顶部菜单栏【文件】→【导出】→【导出为 JSON】,保存文件至本地。
2、用文本编辑器打开该 JSON 文件,搜索目标图层名称或 id 关键字。
3、定位到类似 "opacity": 0.32 或 "rawOpacity": 32 的键值对;若值为整数(如32),需除以100转换为标准 opacity 小数值 0.32。

















