产品尺码标注工具 - 使用手册

欢迎使用产品尺码标注工具!本工具专为电商卖家、设计师及摄影师打造,旨在通过简洁、高效的矢量化操作,为产品图片添加精准的尺寸标注与部位说明。

产品尺码标注工具界面概览

🌟 核心功能

  • 精准标注:轻松勾勒衣长、肩宽、袖长等细节,提升用户认知。
  • 全矢量编辑:所有标注线段、箭头均支持二次调整,角度、长度随心掌控。
  • 工程化管理:支持导出高清图片,并提供可二次编辑的 .slab 工程文件。
  • 高级样式:自由文本支持富排版、文本描边/背景与字体阴影;双向箭头、量尺、虚线、单向箭头、曲线双箭头、圆环双箭头支持组级阴影。
  • 标注复制粘贴:支持单选与多选复制(Ctrl + C),可粘贴到同一画布或其它标签页的画布(Ctrl + V);多选组合可整体移动,并支持撤销/恢复。

📋 标注复制与粘贴

选中一个或多个标注后,可将它们复制到系统剪贴板,并在同一画布或其它浏览器标签页的画布上粘贴。

复制(Ctrl + C)

  • 先用 [选择] 工具选中标注;框选多个对象时,会作为一组复制(含自由文本 + 箭头等混合选区)。
  • Ctrl + C 复制。成功后会提示 [画布组件] 已复制 (N)
  • 复制内容包含标注类型、位置、样式及相对布局,可跨标签页粘贴到另一张尺码标注画布。

粘贴(Ctrl + V)

Ctrl + V 会根据剪贴板内容自动处理:

剪贴板内容 行为
标注组件(由本工具复制) 在当前画布粘贴副本,并自动选中新粘贴的对象
图片 导入为底图(与拖拽导入相同)
.slab 工程 打开工程文件

粘贴位置规则

  • 同一画布多次粘贴:每次在选区中心基础上沿对角线偏移 16 px(第 1 次 16 px、第 2 次 32 px……),便于区分副本。
  • 跨画布 / 跨标签页粘贴:若鼠标指针在画布区域内,副本选区中心对齐鼠标;若指针不在画布上,则保持复制时的相对位置(无额外偏移)。
  • 底图尺寸不同:跨尺寸粘贴时,字号等比例参数会自动换算,避免在新底图上过大或过小。

多选移动与撤销

  • 框选多个标注后,可整体拖动移动位置。
  • Ctrl + Z 撤销、Ctrl + Y 恢复,适用于移动、粘贴、删除、改色等操作;粘贴后移动再撤销,会先回到粘贴位置,再次撤销可删除粘贴的副本。

🛠 工具箱详解

本工具采用「操作后复位」逻辑:每完成一次标注,系统会自动切换回 [选择] 工具,方便您立即调整。

1. 基础工具

  • 🖱 选择 (Select):默认状态。用于框选、移动及点击选中已有的标注控件。框选多个对象时可整体拖动,也可 Ctrl + C 整组复制;右侧仅显示共有的基础参数(如颜色),不显示高级功能区。
  • 🔤 自由文本 (Text):在画布任意位置点击即可添加文字。支持在右侧调整内容、颜色、字体、大小和旋转角度;排版、描边、背景与阴影详见下文 选中项参数与高级功能区

基础工具演示

2. 线性标注工具

所有线性工具均通过「左键按下 -> 拖拽 -> 松开」完成初始化,支持 360° 旋转。选中单个标注后,可在「高级功能区」设置阴影(颜色、X/Y 偏移、模糊);线宽与颜色由主面板「颜色」「大小」统一控制,与箭头、刻度、标签同步。拖拽端点改变长度后,阴影会随整组标注一起更新。

工具名称 样式特征 最佳适用场景
双向箭头 双向箭头样式 标注部位跨度、间距或总长度。
量尺 (Ruler) 量尺样式 强调长度、深度或具体测量数值。
虚线 (Dash) 虚线样式 辅助线、轮廓补全或非实地测量标注。
单向箭头 单向箭头样式 指向性说明、引出备注文字。

线性标注工具演示

3. 高级曲线与环形工具

  • ↪️ 曲线双箭头:点击拖拽生成直线 -> 松开后向拉拽调整弧度。适合标注领口、袖笼等弧位。选中后可在主面板勾选显示曲线标签文字,并在「高级功能区」设置阴影。
  • ⭕ 圆环双箭头:标注环形位置。支持调整为正圆或椭圆,并可设置开口角度(制作非闭合圆环)。选中后可在「高级功能区」设置阴影。

高级曲线与环形工具演示

选中项参数与高级功能区

右侧「选中项参数」面板用于编辑当前选中标注。面板底部的 高级功能区 默认折叠,需点击标题展开;仅当选中单个对象时 才会显示(多选时不显示)。

自由文本

分组 说明
文字样式 加粗 (B)、斜体 (I)、下划线 (U)、删除线 (S)
对齐方式 左对齐、居中、右对齐
字间距 单位 px,支持 0.1 步进
行间距 行高倍数(如 1.16)
文本背景 启用后可设置背景颜色
文本描边 启用后可设置描边颜色与宽度(px,0.1 步进)
字体阴影 启用后可设置阴影颜色、X/Y 偏移(-50 ~ 50 px)、模糊(0 ~ 50 px)

数值类输入(字间距、行间距、描边宽度、阴影偏移与模糊)在输入完成后按 Enter 或点击其他区域生效,避免输入过程中被自动修正打断。

矢量标注(双向箭头、量尺、虚线、单向箭头、曲线双箭头、圆环双箭头)

高级区仅显示「阴影」,不包含线条描边或文字排版项:

  • 启用阴影后可设置颜色、X/Y 偏移、模糊。
  • 主线、箭头、刻度、标签的颜色与线宽请在主面板「颜色」「大小」中调整。
  • 拖拽端点、旋转或修改开口角度等操作后,阴影仍作用于整组标注。

多选说明

同时选中多个标注时,高级功能区隐藏。若需设置阴影或文本样式,请单独选中某一个对象后再操作。多选时仍支持整体移动Ctrl + C 复制与 Ctrl + V 粘贴;撤销(Ctrl + Z)可逐步还原移动、粘贴等操作。

📂 文件管理与导出

  1. 导入图片:支持通过快捷键 Ctrl + V 或拖拽直接导入原始产品图。
  2. 复制 / 粘贴标注:选中标注后 Ctrl + C 复制,Ctrl + V 粘贴(详见上文 标注复制与粘贴);Ctrl + V 也可粘贴图片或 .slab 工程。
  3. 保存工程 (.slab):保存后可保留所有矢量图层及样式。自由文本的排版、描边、背景、阴影会写入工程;各矢量标注的阴影设置也会保留。下次打开 .slab 可继续微调。
  4. 导出图片:支持导出为高画质的 PNGJPG 格式。
  5. 清空画布:点击「清除内容」按钮可一键重置画布。

⌨️ 快捷键指南

快捷键 功能说明
Ctrl + C 复制选中的标注到剪贴板(支持多选整组复制)
Ctrl + V 粘贴标注组件、图片或 .slab 工程文件
Delete / Backspace 删除选中的标注(支持多选)
Ctrl + 鼠标滚轮 画布缩放(5% ~ 3200%,100% = 原图 1:1 像素;打开时自动适配容器)
空格键(长按) + 左键拖拽 平移画布(在放大状态下快速定位)
Ctrl + Z 撤销上一步操作(移动、粘贴、删除等)
Ctrl + Y 恢复刚刚撤销的操作
放大查看