《OpenCV图像处理》——1.7 用户交互工具

简介:

本节书摘来自华章计算机《OpenCV图像处理》一书中的第1章,第1.7节,作者:[西]葛罗瑞亚·布埃诺·加西亚(Gloria Bueno García)著,更多章节内容可以访问云栖社区“华章计算机”公众号查看

1.7 用户交互工具

前面几节介绍了如何创建窗口(namedWindow)来显示(imshow)一幅图像和提取/处理事件(waitKey)。我们提供的示例展示了一种通过键盘使用OpenCV应用进行用户交互的简单方法。waitKey函数在超时之前会返回一个按键
编码。
幸运的是,OpenCV为用户交互提供了更为灵活的方式,例如,滑动条和鼠标交互,它们可以和某些绘图功能结合提供丰富的用户体验。而且,如果使用Qt支持(CMake的WITH_QT选项)对OpenCV进行本地编译,那么一组新函数可用来编写一个更好的用户界面(UI)。
本节给出一个快速综述来说明,在使用Qt支持的一个OpenCV项目中,编写用户界面的可用功能。下面使用一个名为showUI的示例,在OpenCV界面支持下对上述综述进行说明。
该示例展示了一个窗口中的一幅彩色图片,说明如何使用某些基本元素来丰富用户交互。图1-6显示了在该示例中创建的UI元素:

screenshot

showUI示例(没有回调函数)的源代码如下:

screenshot
screenshot
screenshot

当使用Qt支持建立OpenCV时,每个所创建的窗口(通过highgui模块)显示了一个默认工具栏(见图1-6),带有平移、缩放、保存和打开属性窗口的选项(从左到右)。
除了上述提到的工具栏(仅在Qt上可用),下面几节将说明在该示例中创建的各种UI元素和实现这些UI元素的代码。
1.7.1 滑动条
在指定的窗口(winname)中,使用createTrackbar(const String& trackbarname, const String& winname, int value, int count, TrackbarCallback onChange=0, void userdata=0)函数创建滑动条,该函数使用了一个链接整数值(value)、一个最大值(count)、一个当滑动条改变时被调用的可选回调函数(onChange)和回调函数的一个参数(userdata)。回调函数本身得到两个参数:值(通过滑动条选取)和一个指向userdata(可选)的指针。对于Qt支持,如果没有指定窗口,那么会在属性窗口中创建该滑动条。在showUI示例中,创建了两个滑动条:第一个在主窗口中,第二个在属性窗口中。滑动条回调的代码是:
screenshot

1.7.2 鼠标交互
总是生成鼠标事件使得用户可以用鼠标(移动和点击)进行交互。通过设置正确的处理程序或回调函数,可以实现诸如选择、拖放之类的动作。在指定的窗口(winname)和可选参数(userdata)下使用setMouseCallback(const String& winname, MouseCallback onMouse, void* userdata=0)函数可启用该回调函数(onMouse)。
处理鼠标事件的回调函数的源代码是:
screenshot
screenshot
screenshot

在showUI示例中,通过一个回调函数(cbMouse),可用鼠标事件绘制一个矩形来选择一个矩形区域。在这个示例中,该函数的声明为void cbMouse(int event, int x, int y, int f?lags, void*),其参数为事件发生点(x, y)的位置、事件发生(f?lags)时的条件和可选项userdata。
可以在highgui.hpp头文件中找到可用的事件、标志以及它们对应的定义符号。
1.7.3 按钮
OpenCV(只在使用Qt支持时)允许创建三种类型的按钮:复选框(QT_CHECKBOX)、单选框(QT_RADIOBOX)和按钮(QT_PUSH_BUTTON)。可以分别使用这些类型的按钮来设置选项、设置互斥选项和按钮上的执行动作。在属性窗口中,这三个按钮可使用函数createButton(const String& button_name, ButtonCallback on_change, void* userdata=0, int type=QT_PUSH_BUTTON, bool init_state=false)来创建,它被安排在这个窗口所创建的最后一个滑动条之后的一个按钮条中。该按钮的参数是它的名字(button_name)、状态变化(on_change)时调用的回调函数、该回调函数的一个可选参数(userdate)、按钮的类型(type)和该按钮的初始状态(init_state)。
接下来,展示本示例中按钮所对应的回调函数的源代码:
screenshot

一个按钮的回调函数得到两个参数:它的状态和一个指向用户数据的(可选项)指针。在showUI示例中,展示了如何将一个整数(radioboxCallBack(int state, void id))传递到指定的按钮和一个更复杂的对象(pushbuttonCallBack(int, void font))。
1.7.4 文本绘制与显示
实现图像处理结果与用户间通信的一种非常有效的方式是在被处理的图片上绘制形状或显示文本。通过imgproc模块,OpenCV提供了一些方便的功能来实现诸如输入文本、绘制线、圆、椭圆、矩形、多边形等之类的任务。showUI示例说明了如何在一幅图像上选择一个矩形区域和绘制一个矩形来标记所选择的区域。下面的函数绘制(img)一个矩形,该矩形通过在一幅图像上的两个点(p1,p2)定义,并具有指定的颜色和其他可选参数,如线条的宽度(对于填充形状是负数)和类型:
screenshot

除了支持形状绘制之外,imgproc模块提供一个功能,使用下面的函数在一幅图像上放置文本:
screenshot

在core.hpp头文件中,可以为文本检查可用的字体。
在highgui模块中,Qt支持还增加了一些附加方法用于在一个OpenCV应用的主窗口上显示文本:
图像上的文本:使用函数addText(const Mat& img, const String& text, Point org, const QtFont& font)得到这个结果。这个函数允许选择所显示文本的起点,该文本使用了之前用的函数fontQt(const String& nameFont, int pointSize=-1, Scalar color=Scalar::all(0), int weight=QT_FONT_NORMAL, int style=QT_STYLE_NORMAL, int spacing=0)创建的字体。在showUI示例中,当点击按钮时(通过在回调函数内调用addText函数)这个函数用于在图像上输入文本。
状态栏上的文本:使用函数displayStatusBar(const String& winname, const String& text, int delayms=0)显示状态栏中的文本,由最后一个参数(delayms)指定显示的毫秒数。在showUI示例中,当属性窗口的按钮和滑动条更改其状态时,使用该函数(在回调函数中)显示一条文本信息。
覆盖在图像上的文本:使用函数displayOverlay(const String& winname, const String& text, int delayms=0)显示覆盖在图像上的文本,由最后一个参数指定显示的毫秒数。在showUI示例中,当主窗口滑动条更改其值时,使用该函数(在回调函数中)显示文本信息。

相关文章
|
4月前
|
openCL 开发工具 C语言
OpenCV 图像处理学习手册:6~7
OpenCV 图像处理学习手册:6~7
84 0
|
4月前
|
存储 编解码 算法
OpenCV 图像处理学习手册:1~5
OpenCV 图像处理学习手册:1~5
35 0
|
3月前
|
人工智能 Linux API
OpenCV这么简单为啥不学——1.1、图像处理(灰度图、模糊图片、GaussianBlur函数、提取边缘、边缘膨胀、边缘细化)
OpenCV这么简单为啥不学——1.1、图像处理(灰度图、模糊图片、GaussianBlur函数、提取边缘、边缘膨胀、边缘细化)
48 0
|
5天前
|
算法 计算机视觉
【OpenCV】计算机视觉图像处理基础知识(下)
【OpenCV】计算机视觉图像处理基础知识(下)
|
5天前
|
人工智能 计算机视觉 Python
【OpenCV】计算机视觉图像处理基础知识(上)
【OpenCV】计算机视觉图像处理基础知识(上)
|
13天前
|
算法 安全 机器人
最新版opencv4.9安装介绍,基本图像处理详解
最新版opencv4.9安装介绍,基本图像处理详解
|
26天前
|
机器学习/深度学习 存储 算法
OpenCV与NumPy:图像处理中的黄金组合
【4月更文挑战第17天】OpenCV和NumPy是Python图像处理的两大利器,互补协作形成黄金组合。OpenCV专注计算机视觉,提供丰富算法,而NumPy擅长数值计算和数组操作。两者无缝对接,共同实现高效、灵活的图像处理任务。通过灰度化、二值化、边缘检测等案例,展示了它们的协同作用。未来,这一组合将在计算机视觉和机器学习领域发挥更大作用,解锁更多图像处理潜力。
|
27天前
|
机器学习/深度学习 算法 Linux
使用OpenCV在Python中进行图像处理
使用OpenCV在Python中进行图像处理
|
2月前
|
机器学习/深度学习 API vr&ar
Qt, OpenCV与OpenGL协同作战:图像处理与三维图形界面的完美结合
Qt, OpenCV与OpenGL协同作战:图像处理与三维图形界面的完美结合
144 4
|
3月前
|
编解码 算法 自动驾驶
探索OpenCV:图像处理的利器
探索OpenCV:图像处理的利器
31 0