基于Qt5的图像交互控件开发（C++实现）

---

前言

博主近期看到海康VM、halcon以及visionpro视觉软件都包含一个图像智能交互控件，然后近期根据其中的技术原理，也基于Qt5仿照开发了一个类似的功能，包含矩形、旋转矩形、任意多边形、圆、圆环、扇环，直线卡尺以及圆卡尺等常用控件，图像智能交互是在计算机视觉领域中常用的技术，用于视觉软件图像ROI，广泛应用于工业自动化、机器视觉等领域。具体效果如下：

Qt5图像智能交互控件

---

一、图像交互控件

1.1 概述

在机器视觉领域，常用的图像交互控件包括以下几种：

1. 标注工具（Annotation Tools）：标注工具允许用户在图像上进行标注和绘制，例如绘制边界框。这些标注可用于图像分类、目标检测、语义分割等任务的数据标注。

2. 拖动和调整工具（Drag and Adjust Tools）：这些工具允许用户通过拖动或调整图像中的特定区域来进行交互。例如，可以拖动边界框或控制点来调整目标的位置、大小或形状。

3. 交互式区域选择工具（Interactive Region Selection Tools）：这些工具允许用户通过绘制、拖动或选择特定区域来指定感兴趣的区域。例如，用户可以使用矩形选择工具、多边形选择工具或魔棒工具来选择图像中的目标或区域。

4. 缩放和导航工具（Zoom and Navigation Tools）：这些工具用于在图像上进行缩放、平移和导航操作，以便用户可以查看和分析图像的不同部分。常见的缩放和导航工具包括放大、缩小、平移和旋转操作。

5. 参数调整滑块（Parameter Adjustment Sliders）：在机器视觉任务中，一些算法或模型可能需要调整不同的参数或阈值。参数调整滑块允许用户通过滑动滑块来调整参数的值，并实时观察算法或模型的输出变化。

博主采用交互控件写的两个文章如下：
第一个：利用OpenCV与Qt5构建卡尺拟合直线工具（C++实现)
第二个：利用OpenCV与Qt5构建卡尺找圆工具（C++实现）

1.2 图像显示交互功能

本文采用Qt5的QGraphicsView显示图像控件，QGraphicsScene用来管理图形交互控件，Qt5中的QGraphicsView是一个图形视图框架，用于在应用程序中显示和交互2D图形。它是Qt的图形模块（Graphics Module）提供的一部分，为开发者提供了一个灵活的工具来创建基于图形的用户界面。

QGraphicsView的主要功能包括：

1. 图形显示：QGraphicsView允许开发者在视图中显示2D图形项（Graphics Item），例如图像、文本、几何图形、路径等。这些图形项可以自定义外观、位置和交互行为。

2. 缩放和平移：通过QGraphicsView，用户可以通过鼠标滚轮或手势来缩放视图中的图形，以及通过鼠标拖动来平移视图。这使用户能够查看和导航大型或超出视图边界的图形。

3. 坐标系统：QGraphicsView提供了一个坐标系统，允许用户在视图中进行图形项的定位和操作。开发者可以指定视图中的逻辑坐标，并使用这些坐标来添加、移动和变换图形项。

4. 交互操作：通过QGraphicsView，开发者可以实现丰富的交互功能，例如选择图形项、拖动图形项、缩放选定的图形项等。这些交互操作可以通过重写相应的事件处理函数来实现。

5. 双缓冲绘制：QGraphicsView使用双缓冲技术，以提供平滑的绘制和动画效果。它可以高效地处理大量图形项的绘制，并自动进行局部更新，以减少绘制的开销。

6. 视图和场景：QGraphicsView与QGraphicsScene一起使用，QGraphicsScene提供了图形项的容器，并管理它们之间的关系。QGraphicsView充当了场景的视图，用于在窗口中显示场景中的图形项。

1.3 棋盘格功能实现

图像显示为棋盘格实现代码如下：

void myqgraphicsview::drawBackground(QPainter * painter, const QRectF & rect)
{
    //绘制灰白棋盘图像背景
    int wid = this->geometry().width();
    int hei = this->geometry().height();
    QPointF m_ptCenter = this->mapToScene(wid / 2, hei / 2);
    QPixmap pix(wid, hei);
    QPainter pter(&pix);
    QColor clr_white(Qt::white);
    QColor clr_gray(240, 240, 240, 240);
    int spacing = 15;
    QColor useColor;
    for (int i = 0; i <= floor(wid / spacing); i++)
    {
        for (int j = 0; j <= floor(hei / spacing); j++)
        {
            useColor = ((i + j) % 2 == 0 ? clr_white : clr_gray);
            pter.fillRect(i*spacing, j*spacing, spacing, spacing, useColor);
        }
    }
    painter->drawImage(rect, pix.toImage());
}

1.4 形状控件基类

QAbstractGraphicsShapeItem是Qt中的一个抽象基类，用于表示具有形状的图形项（Graphics Item）。它是QGraphicsItem的子类，用于在QGraphicsScene中显示和操作2D图形。

QAbstractGraphicsShapeItem的主要特征和功能如下：

1. 形状定义：它定义了一个图形项的形状，可以是矩形、椭圆、多边形等。开发者可以通过重写shape()函数来自定义形状。

2. 外观样式：它具有一系列用于设置图形项外观的函数，如设置边框颜色、填充颜色、线宽等。通过这些函数，可以定制图形项的外观样式。

3. 碰撞检测：它提供了一些用于碰撞检测的函数，如collidesWithItem()和collidesWithPath()。这些函数可用于判断图形项与其他图形项或路径是否发生碰撞。

4. 交互操作：通过重写鼠标事件处理函数，可以实现与QAbstractGraphicsShapeItem的交互操作，如鼠标点击、拖动、移动等。可以根据需要进行自定义的交互行为。

5. 变换和位置：它继承了QGraphicsItem的功能，可以进行图形项的位置设置、旋转、缩放等变换操作。

QAbstractGraphicsShapeItem是一个抽象基类，不能直接实例化，需要通过继承并重写其纯虚函数来创建具体的形状图形项。常见的具体子类包括QGraphicsRectItem（矩形图形项）、QGraphicsEllipseItem（椭圆图形项）和QGraphicsPolygonItem（多边形图形项）等，它们分别提供了矩形、椭圆和多边形形状的图形项。使用QAbstractGraphicsShapeItem及其子类，开发者可以方便地创建具有形状和外观样式的2D图形项，并在QGraphicsScene中进行显示、交互和操作。这为绘图、图形编辑、数据可视化等应用提供了强大的图形绘制和操作功能。

1.5 鼠标交互实现

    virtual void hoverEnterEvent(QGraphicsSceneHoverEvent *event) override;
    virtual void hoverMoveEvent(QGraphicsSceneHoverEvent *event) override;
    virtual void hoverLeaveEvent(QGraphicsSceneHoverEvent *event) override;
    virtual void mousePressEvent(QGraphicsSceneMouseEvent* event) override;
    virtual void mouseMoveEvent(QGraphicsSceneMouseEvent* event) override;
    virtual void mouseReleaseEvent(QGraphicsSceneMouseEvent *event) override;

二、功能展示

2.1 图像加载

2.2 图像放大

2.3 图像缩小

2.4 图像自适应

2.5 图像实际大小

2.6 矩形框控件

2.7 旋转矩形框控件

2.8 任意多边形控件

2.9 圆控件

2.10同心圆控件

2.11 扇环控件

2.12 直线卡尺控件

2.13 圆卡尺控件

总结

由于博主能力有限，本篇文章中提及的方法，也难免会有疏漏之处，希望您能热心指出其中的错误，以便下次修改时能以一个更完美更严谨的样子，呈现在大家面前。