抠图应用程序设计(三)——QT用户界面的实现

简介

​ 本设计的GUI其实是由一个用户界面demo开发而成,主要由弹窗以及主界面组成。弹窗主要用于提示用户操作,为用户提供选择;主界面用于交互功能的实现。

外观设计

​ 外观设计部分大部分在Qt Designer上完成。将所需控件按照方案论证中的布局图拖动至预设位置,并根据对应的功能对其合适的命名以方便后续程序的编写。接着选择合适的Layout类型控制各控件的布局,如在按键较密集的功能选择区采用网格布局,使其中的按钮整齐排列。接着在合适的位置添加Spacer控件,这个控件可以控制各控件间的距离以达到窗口缩放时界面布局随之缩放的目的。处理好布局后,在iconfont中找到风格统一的矢量图作为各按键的图标。

​ 除此之外,部分外观优化也通过QSS在类函数中完成。我们在Widget和MyMessageBox类中定义了用于设置窗口stylesheet的initUi函数,其中使用setAttribute (Qt:: WA_TranslucentBackground , true)使得窗口透明等美化语句。同时也在MyMessageBox类中定义setIcon函数,实现根据弹窗类型设置合适的弹窗图标的功能。

至此,我们得到如下的ui界面。

逻辑设计

GUI的逻辑设计主要涉及一下模块。

1)Qt控件与程序代码的关联

​ 通常这一功能主要由QObject::connect函数实现,这一方法需要在主窗口类的构造函数显式声明,不够简洁。本设计中我们将按键(如pushBtn)对应的槽函数命名为on_pushBtn_clicked,它是QtCreator默认的按键关联写法,编译时自动

​ 此外,程序也使用自定义的信号槽Q_SIGNALS的功能实现代码与控键的关联,如将ROI截取函数与后续处理的函数关联起来。首先需要在helper类中定义一个信号函数void signalCompleteCature(int x, int y, int h, int w)。后续重写的键盘事件中,函数将调用此函数发出信号,返回用户选定的ROI信息。而在Widget类的onCatureImage()函数中,同样使用connect函数实现关联,其中需要设置信号signal为signalCompleteCature函数,对应槽slot为用于后续处理的onCompleteCature函数。

2)程序使用中相关信息的存储

​ 本程序处理过程中涉及了处理前的前景图像,选定的背景图像,抠图过程得到的掩码以及抠图结果等图像矩阵,这些信息都可以直接创建类属性进行存储。值得注意的是Widget类中的scale属性以及helper类中的imgPos和labelCenter属性,它们是ROI截取过程中重要的信息。由于控件大小与原始图像大小不一样,程序需要记录界面中显示图像相对于原图的缩放比例,进而对后续截取到的ROI进行比例换算。而imgPos和labelCenter则用于判断截取时鼠标是否超出图像范围以及ROI在待操作图像的像素坐标系中位置的计算。

3)图像文件的打开与保存

​ 首先使用QFileDialog::getSaveFileName函数获得目的路径并转化为string类型,再通过cv::imread或cv::imwrite打开或保存图像。需要注意的是若需要在读入图像后将其显示于QLabel上,则需要对图像格式进行转换。由于OpenCV中对彩色图像的默认保存格式为BGR,而Qt中的QImage需要的彩色图像格式为RGB,所以需要使用cvtColor函数将Mat类型变量的格式转换为RGB才能构造对应的QImage变量。得到QImage类型变量后,还需要根据QLabel的大小将其resize,注意使用参数Qt::KeepAspectRatio以保证缩放前后图像的长宽比例保持不变。最后结合使用setPixmap与QPixmap::fromImage函数即可实现图像显示功能。

4)截取待操作图片的ROI

​ 这一功能涉及了helper和Widget两个类。首先是helper类,它继承自QWidget类,构造函数包含待操作图像的位置中心point以及大小size参数,通过它们,程序可以计算出整幅图像在屏幕中的范围。同时还需要使用grabWindow函数截取当前屏幕的图片,而后续操作都是在这张屏幕截图上进行的。接着重写鼠标事件以及paintEvent实现鼠标左键按下拖动时矩形框的绘制与ROI位置计算的功能。这一步需要利用构造函数中计算所得的图像范围信息,判断选取的ROI是否超出待操作图像的区域以便在超出时将矩形修正限制于图像范围内,并由鼠标事件记录的矩形框左上角与右下角点计算出ROI在像素坐标系中的位置。然后需要重写keyPressEvent,内部逻辑为:接收到esc输入时放弃ROI选取;接收到回车enter输入时,调用signalCompleteCature函数发出选取结束的信号,并将选取到的ROI信息返回给对应的槽函数Widget::onCompleteCature。回到Widget类中,onCatureImage是用于关联ROI选区抠图按键的函数。其中结合使用了mapToGlobal、QWidget::pos和QWidget::size函数获取QLabel中心(同时也是图像中心)在屏幕中的位置以及待操作图像的大小。根据这两个变量定义helper类对象,并使用connect将signalCompleteCature和onCompleteCature函数关联起来。后者接收到ROI信息后将根据显示的图片相对于原图的缩放比例计算出用户所选区域在原图中的位置与大小。

效果

源码下载

基于opencv和qt的多功能抠图应用

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/38808.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【虚幻引擎UE】UE5 AR初体验之静态动态模型加载

UE5的AR初体验之静态动态两种模型加载 基于配置好AR环境(参考另一篇文章) 先## 标题简单了解一下它的项目结构 这里的brush就是我们的操作空间范围 官方模板可以实现平面识别,控制对象的旋转和缩放。 本文主要说明在AR项目中实现模型加载…

在虚幻引擎5中构建你的首款游戏 - 04 - 地形和草地

在虚幻引擎5中构建你的首款游戏 - 04 - 地形和草地 前言介绍: 原版地址: << [功能亮点]在虚幻引擎5中构建你的首款游戏(官方字幕)_哔哩哔哩_bilibili >> << https://www.bilibili.com/video/BV1M34y1x7tc >> 官网地址: << Your First Game In Un…

虚幻引擎(UE5)-大世界分区WorldPartition教程(三)

文章目录 前言LevelInstance的使用1.ALevelInstance2.选择Actor创建关卡3.运行时加载LevelInstance 总结 上一篇&#xff1a;虚幻引擎(UE5)-大世界分区WorldPartition教程(二) 前言 在制作大关卡时&#xff0c;可能会遇到这样一种情况&#xff0c;就是关卡中的某些Actor会重复…

虚幻引擎5 学习笔记2

一、visual studio 2019添加工作负荷 选中工具-获取工具和功能 点击工作负载-勾选要添加的负载——“使用c的桌面开发”和“使用c的游戏开发” “” 二、创建项目 创建一个c的项目&#xff0c;初学者包也勾上。名字不要有中文。 报错&#xff1a; 提示缺少了net程序&…

在虚幻引擎5中构建你的首款游戏 - 05 - 岩石和植物

在虚幻引擎5中构建你的首款游戏 - 05 - 岩石和植物 前言介绍: 原版地址: << [功能亮点]在虚幻引擎5中构建你的首款游戏(官方字幕)_哔哩哔哩_bilibili >> << https://www.bilibili.com/video/BV1M34y1x7tc >> 官网地址: << Your First Game In Un…

虚幻引擎(UE5)-大世界分区WorldPartition教程(四)

文章目录 前言一、Data Layers的使用1.添加Actor到Data Layers2.运行时处理 总结 上一篇&#xff1a;虚幻引擎(UE5)-大世界分区WorldPartition教程(三) 前言 Data Layers&#xff08;UE4中叫Layers&#xff09;用于将Actor划分到不同的Layer中&#xff0c;通过在编辑器和运行…

UE5使用MetaHuman构建超现实的角色

使用免费的MetaHuman创造者应用程序为虚幻构建超现实的角色。 流派:电子学习| MP4 |视频:h264&#xff0c;1280720 |音频:AAC&#xff0c;48.0 KHz 语言&#xff1a;英语中英文字幕&#xff08;根据原英文字幕机译更准确&#xff09;|大小解压后:1.66 GB 含课程文件|时长:1h 49…

虚幻引擎5改变了游戏,并与Perforce原生集成

游戏发展|版本控制 作者&#xff1a;Ryan L Italien 虚幻引擎是当下流行的游戏引擎之一。虽然很多团队喜欢UE4&#xff0c;但虚幻引擎5 (UE5)的抢先版本包含了一些期待已久的改进(加上一些令人惊叹的新功能)。 这篇文章将分析我们为什么对虚幻引擎 5 感到如此兴奋。此外&…

UE5 最新动态虚幻引擎全新版本引爆互联网

自 1998 年上市以来&#xff0c;虚幻引擎一直是顶级游戏开发工具之一。一些史上最大型游戏 —《杀出重围》和《生化奇兵》系列、《火箭联盟》、《堡垒之夜》等等 — 均使用该引擎的不同迭代版本进行构建。 随着电影和电视行业日益认识到虚拟引擎的作用&#xff0c;甚至在游戏业…

UE4 回合游戏项目 22- 控制新角色

在上一节&#xff08;UE4 回合游戏项目 21- 添加多种类型的敌人&#xff09;基础上新添加一个玩家角色 效果&#xff1a; 步骤&#xff1a; 1.打开进阶游戏资源&#xff0c;解压“回合迁移_第七节&#xff08;只是新人物包&#xff09;” 2.解压后双击打开工程 3.选中“ziyuan…

腾讯发布 3D 虚拟场景自动生成解决方案,用 AIGC 助力游戏开发提效

3月28日记者获悉&#xff0c;腾讯 AI Lab在2023游戏开发者大会&#xff08;Game Developers Conference&#xff09;上发布了自研的3D游戏场景自动生成解决方案&#xff0c;通过AIGC技术&#xff0c;帮助开发者在极短的时间内打造出高拟真、多样化的虚拟城市场景&#xff0c;大…

在虚幻引擎5中构建你的首款游戏 - 09 - 压力板和开关门

在虚幻引擎5中构建你的首款游戏 - 09 - 压力板和开关门 前言介绍: 原版地址: << [功能亮点]在虚幻引擎5中构建你的首款游戏(官方字幕)_哔哩哔哩_bilibili >> << https://www.bilibili.com/video/BV1M34y1x7tc >> 官网地址: << Your First Game I…

如何使用UE5新功能 “打包型关卡Actor” 实现场景的性能优化

如何使用UE5新功能“打包型关卡蓝图”实现场景性能优化 内容分为&#xff1a; 简介实操优化结果展示 看不懂原理看看实操就大概就能明白 什么是“打包型关卡蓝图” “打包型关卡蓝图”是UE5新功能 世界分区&#xff08;World Partition&#xff09; 的一部分 但 不依赖于项目…

在虚幻引擎5中构建你的首款游戏 - 10[完] - 特效音效镜头震动打包

在虚幻引擎5中构建你的首款游戏 - 10[完] - 特效&音效&镜头震动&打包 前言介绍: 原版地址: << [功能亮点]在虚幻引擎5中构建你的首款游戏(官方字幕)_哔哩哔哩_bilibili >> << https://www.bilibili.com/video/BV1M34y1x7tc >> 官网地址: &…

UE5的项目建立及UE5(虚幻引擎5)个人视角移动按键操作及运行项目/day.2

1.UE5的项目建立 进入UE5的界面就是这样&#xff1a; 由于我们是刚下载的&#xff0c;“最近打开的项目”是没有项目打开的所以我们需要新建一个新的项目。 注意&#xff0c;项目位置最好是英文的&#xff0c;否则可能会出错。&#xff08;可能不会&#xff0c;毕竟很多人都说有…

在虚幻引擎5中构建你的首款游戏 - 01 - 介绍

在虚幻引擎5中构建你的首款游戏 - 01 - 介绍 1. 教程介绍 本系列是针对 Epic开发者社区 的教程 << Your First Game In Unreal Engine 5 | Epic Developer Community (epicgames.com) (您在虚幻引擎 5 中的第一款游戏) >> 的学习笔记. 在官网上的视频是没有中文字…

在虚幻引擎5中构建你的首款游戏 - 06 - 游戏模式相机运动按键

在虚幻引擎5中构建你的首款游戏 - 06 - 游戏模式&相机&运动&按键 前言介绍: 原版地址: << [功能亮点]在虚幻引擎5中构建你的首款游戏(官方字幕)_哔哩哔哩_bilibili >> << https://www.bilibili.com/video/BV1M34y1x7tc >> 官网地址: <&…

在虚幻引擎5中构建你的首款游戏 - 07 - 角色模型和动画

在虚幻引擎5中构建你的首款游戏 - 07 - 角色模型和动画 前言介绍: 原版地址: << [功能亮点]在虚幻引擎5中构建你的首款游戏(官方字幕)_哔哩哔哩_bilibili >> << https://www.bilibili.com/video/BV1M34y1x7tc >> 官网地址: << Your First Game I…

在虚幻引擎5中构建你的首款游戏 - 08 - AI控制和道具

在虚幻引擎5中构建你的首款游戏 - 08 - AI控制和道具 前言介绍: 原版地址: << [功能亮点]在虚幻引擎5中构建你的首款游戏(官方字幕)_哔哩哔哩_bilibili >> << https://www.bilibili.com/video/BV1M34y1x7tc >> 官网地址: << Your First Game In …

AIGC时代,如何妙用chatgpt进行酣畅淋漓的创作

生成式人工智能AIGC&#xff08;Artificial Intelligence Generated Content&#xff09;是人工智能1.0时代进入2.0时代的重要标志。 “ChatGPT"代表"Chat-based GPT”&#xff0c;是指一种基于对话模式的生成式预训练模型。它是由OpenAI开发的&#xff0c;GPT&…