快速构建图像标注工具：使用快马平台一键生成labelimg部署原型
最近在做一个计算机视觉的小项目，需要自己标注一批图像数据。虽然知道有现成的工具，但总想自己动手试试，顺便理解一下数据标注工具的实现逻辑。传统的做法是去GitHub上找开源项目，比如labelimg，然后下载、配置环境、运行……一套流程下来，时间就过去了。这次我尝试了一个新思路：利用在线开发平台快速生成一个可用的原型，直接体验核心功能。整个过程比预想的要顺畅很多。
明确需求与工具选型。我的核心需求很简单：一个能浏览图片、画框、打标签并保存结果的工具。技术栈上，Python的通用性和丰富的图形库是首选。PyQt5作为成熟的GUI框架，能快速构建出带界面的桌面应用，非常适合这种需要鼠标交互的工具。确定了用“Python + PyQt5”这个组合后，我就不用再纠结于框架选择，可以直奔主题了。
规划核心功能模块。我把工具拆解成几个清晰的模块。首先是图像加载与浏览模块，需要能读取指定文件夹，并以列表形式展示所有图片，支持上一张/下一张的切换。其次是核心的交互与绘制模块，这是重点，需要实现在图片上通过鼠标拖拽绘制矩形框，并且这个框要能跟随图片缩放。然后是标签管理模块，要提供添加、选择、修改标签的功能，每个绘制出的框都必须绑定一个标签。最后是数据持久化模块，标注结果必须能保存成通用的格式，比如PASCAL VOC的XML或者YOLO的TXT，这样后续才能方便地用于模型训练。
设计用户界面布局。一个清晰的界面能极大提升标注效率。我采用了经典的左右分栏布局。左侧大面积区域留给图像显示与标注画布，这里是主要的操作区。右侧则划分为上下两个面板：上方是文件列表，显示当前文件夹下的所有图片，点击可以快速切换；下方是标签管理区，包括当前可用标签的列表、添加新标签的输入框，以及当前选中标注框的标签信息显示与修改入口。底部再放一排按钮，用于“打开文件夹”、“保存”、“上一张”、“下一张”等全局操作。这样布局，功能分区明确，操作路径短。
实现图片加载与浏览逻辑。这个部分关键在于维护一个图片路径列表和一个当前索引。当用户点击“打开文件夹”时，程序会遍历文件夹下支持的图片格式（如.jpg, .png），将路径存入列表并在右侧面板显示。点击列表项或使用导航按钮，就会根据索引加载对应的图片到左侧画布。这里要注意图片的缩放显示，要确保无论原图多大，都能在不失真的前提下适配显示区域，同时为后续的坐标映射（将屏幕坐标换算回原图坐标）打下基础。
攻克矩形框绘制与交互的难点。这是整个工具最核心也最需要细心处理的部分。实现思路是：在画布上监听鼠标的按下、移动、释放事件。鼠标按下时，记录起始点坐标；移动时，实时计算当前点与起始点的差值，动态绘制一个矩形预览框；释放时，确认矩形框的最终坐标，并将其作为一个标注对象存储起来。这里有几个细节：一是坐标转换，因为画布上显示的可能是缩放后的图片，所以存储的坐标必须是相对于原始图片尺寸的，这需要根据缩放比例进行换算。二是框的视觉反馈，绘制时要有半透明填充和边框，方便用户确认。三是要考虑框的选中状态，点击已有的框可以将其激活，进行编辑或删除。
构建标签系统与数据绑定。每个矩形框都必须关联一个标签。我预先定义了一个默认标签列表（如“person”, “car”, “dog”），并允许用户通过右侧面板的输入框动态添加新标签。当绘制完成一个框或选中一个已有框时，可以通过一个下拉菜单或输入框为其指定或修改标签。所有标签信息在内存中与对应的框对象绑定。这里的数据结构设计很重要，通常我会用一个列表来存储所有标注对象，每个对象包含框的坐标（xmin, ymin, xmax, ymax）、标签名称和唯一ID。
实现标注结果的保存与导出。数据标注的最终目的是为了使用，因此导出功能必须可靠。我实现了两种主流格式的保存。一是PASCAL VOC格式的XML文件，这种格式信息很全，会为每张图片生成一个XML文件，里面记录图片尺寸、每个标注框的坐标和标签。二是YOLO格式的TXT文件，这种格式更简洁，它将坐标归一化为0到1之间的相对值，每行代表一个物体，包含类别索引和归一化后的中心点坐标及宽高。保存时，根据用户选择的格式，遍历当前图片的所有标注对象，进行相应的计算和写入即可。
完善编辑与用户体验细节。基础功能完成后，一些提升体验的细节能让工具更好用。我增加了对标注框的编辑功能：选中一个框后，可以按Delete键删除；可以直接在标签下拉菜单中修改其类别。此外，还加入了快捷键支持，比如用A/D键切换上一张/下一张图片，用Ctrl+S快速保存，能显著提升连续标注时的效率。最后，必要的状态提示也很重要，比如在界面底部显示当前图片路径、已标注框的数量等信息。
通过这样一个步骤一个步骤地构建，一个具备基本功能的图像标注工具原型就出来了。整个过程让我对GUI事件处理、坐标系统转换以及数据标注的规范有了更具体的认识。当然，这个原型还有很多可以扩展的地方，比如支持多边形标注（用于图像分割）、标签颜色自定义、自动保存、以及更强大的标注框编辑（调整大小、移动）等功能。
这次实践让我感触最深的是，想法到原型的距离被大大缩短了。我是在InsCode(快马)平台上完成这个探索的。它最方便的地方在于，不需要我在本地安装Python、PyQt5这些环境，打开网站就能直接开始写代码、看效果。对于想快速验证一个工具类应用是否可行的场景来说，这种即开即用的体验非常友好。
整个编码过程就在网页编辑器里完成，左侧写代码，右侧甚至能直接看到运行后的界面效果，调试起来很直观。而且，像这样一个带有图形界面的、可以持续运行交互的程序，在InsCode上还能直接一键部署成一个随时可以访问的在线应用原型。
这意味着我不仅可以自己用，生成一个链接就能分享给同事看看效果，收集反馈，这比打包发一个安装包或者录屏解释要直观多了。对于快速原型开发、功能演示或者小组内部试用来说，这种“写完即部署”的流畅感，确实省去了不少配置和分发上的麻烦。如果你也有类似的想法想快速动手试试，不妨用它来当你的第一个“试验场”。