草庐IT

从零开始学习Qt GUI编程

才鲸嵌入式 2023-04-15 原文

从零开始学习Qt GUI编程

作者将狼才鲸
创建日期2021-11-23
  • 注:所有的代码都是参考的网上的资料,有贴上源地址
  • 编译环境1(002_GuiDisplay/下001~012cases期间):
    Win10 + Qt6.2.1(MSVC 2019 64-bit) + Qt Creator5.0.3
  • 编译环境2(004_MultiMedia_VideoAudio/下002~003cases期间):
    Win10 + Qt5.15.2(MSVC 2019 64-bit) + Qt Creator5.0.3
  • 编译环境3(004_MultiMedia_VideoAudio/下001、004~00xcases期间,005_Qt_with_C_language/及以后所有):
    Win10 + Qt6.2.3(MSVC 2019 64-bit) + Qt Creator7.0.0

一、目录结构

$ tree
.
|-- backup							// 待删的一些旧文件
|-- projects						// 已弃用,对同一份代码有makefile、qt、visual studio三个工程
|   |-- 001_HelloWorld_makefile
|   |-- 001_HelloWorld_qt
|   `-- 001_HelloWorld_vs
|-- readme.md
`-- source							// 源码
    |-- 001_HelloWorld				/* Hello world */
    |   `-- hello_world.c
    |-- 002_GuiDisplay				// 演示GUI
    |   |-- 001_Window				/* 主窗口 + HelloWorld */
    |   |   |-- 001_Window.pro		// Qt工程文件
    |   |   |-- documents			// 该Demo存放文档路径
    |   |   |   |-- 001_Window.md	// 该Demo说明文档
    |   |   |   `-- 001_Window.png	// 该Demo演示效果的图片
    |   |   |-- main.cpp			// 主程序,程序入口
    |   |   |-- mainwindow.cpp		// 主窗口显示逻辑
    |   |   |-- mainwindow.h		// 主窗口头文件
    |   |   `-- mainwindow.ui		// 主窗口布局
    |   |-- 002_Dialog				/* 对话框 */
    |   |-- 003_LoginDialog			/* 登录功能 */
    |   |-- 004_menu_logo			/* 添加菜单栏和图标 */
    |   |-- 005_icon_and_layout		/* 完整菜单栏和居中动态布局 */
    |   |-- 006_text_file_edit		/* 记事本编辑功能 */
    |   |-- 007_text_find			/* 文本查找功能 */
    |   |-- 008_keyboard_mouse		/* 键盘和鼠标功能 */
    |   |-- 009_2D_painter			/* 2D绘图 */
    |   |-- 010_image				/* 图片绘制 */
    |   |-- 011_3D_painter          /* 3D三维绘制 */
    |   |-- 012_media_play			/* Qt老版本的视频播放 */
    |   |   xxx_xxx
    |   |   ……
    |   `-- documents
    |       `-- GuiDisplay.md
    |-- 003_QtExamples_Qt-6.2.3		// Qt官方的各种经典示例
    |   |-- 001_xxx
    |   `-- documents
    |       `-- QtExamples_Qt-6.2.3.md
    |-- 004_MultiMedia_VideoAudio	// 演示如何使用音视频播放与录制
    |   |-- 001_qt6.2.3_multimedia  /* Qt6.2.3提供的完整播放器代码 */
    |   |-- 002_pcm_audio_play      /* PCM音频播放 */
    |   |-- 003_yuv_video_play      /* YUV视频播放 */
    |   |-- 004_pcm_input_save_file /* 从麦克风录制pcm文件 */
    |   |-- 005_yuv_input_save_file /* 从摄像头录制yuv文件 */
    |   `-- documents
    |       `-- MultiMedia_VideoAudio.md
    |-- 005_Qt_with_C_language		/* C++与C混合编程 */
    |-- 006_AudioVideo_Codec   		/* Qt中ffmpeg音视频编解码 */
    `-- 007_Embeded_Player			/* 自行实现音视频编解码与播放器(嵌入式仿真用) */
        `-- documents

二、Qt介绍(针对没接触过Qt的人)

二、GUI Demo介绍

  • qt_gui_simple2complex\source\002_GuiDisplay\下的GUI部分:

001_Window:创建一个主窗口

步骤:
第1篇 Qt5基础(一)Qt开发环境的搭建和hello world
效果:


002_Dialog:在主窗口之外创建一个对话框

步骤:
第2篇 Qt5基础(二)编写Qt多窗口程序
效果:


003_LoginDialog:登录功能

正确的用户名:demo,正确的密码:demo123456
步骤:
第3篇 Qt5基础(三)Qt登录对话框
效果:

004_menu_logo:添加菜单栏和图标


005_icon_and_layout:完整菜单栏和居中动态布局


006_text_file_edit:记事本编辑功能


007_text_find:文本查找功能


008_keyboard_mouse.md:键盘和鼠标功能


009_2D_painter.md:2D绘图


010_image.md:图片绘制


011_3D_painter:3D绘制


012_media_play:视频播放


三、多媒体Demo介绍

  • qt_gui_simple2complex\source\004_MultiMedia_VideoAudio\下的多媒体部分:

001_qt6.2.3_multimedia:音视频多媒体播放


002_pcm_audio_play:PCM音频播放


003_yuv_video_play:YUV视频播放


004_pcm_input_save_file:从麦克风保存PCM音频文件

  • 步骤:
    详见源码中文档和注释

  • 注意事项:
    使用Qt6.2.3编译,实现方式和Qt5完全不同


005_yuv_input_save_file:从摄像头保存YUV视频文件

  • 步骤:
    详见源码中文档和注释

  • 注意事项:
    使用Qt6.2.3编译,实现方式和Qt5完全不同


四、Qt官方Demo介绍

  • qt_gui_simple2complex\source\003_QtExamples_Qt-6.2.3\下的Demo部分:

  • Qt官方Demo的整体介绍详见 子文档QtExamples_Qt-6.2.3.md


001_animation_动画_缓冲曲线.gif


002_Screenshot_截屏.png


003_Systray_修改系统托盘.gif


004_ClassWizart_翻页.gif


005_Extension_扩展列表.gif


006_FindFiles_打开文件夹_查找文件.gif


007_LicenseWizard_注册向导.gif


008_StandardDialogs_常用对话框.gif


009_TabDialog_列表对话框.gif


010_TrivialWizard_简单向导.gif


011_DraggableIcons_拖动图标.gif


012_DraggableText_拖动文本.gif


013_DropSite.png


014_FridgeMagnets_拖动贴靠.gif


015_Puzzle_拼图游戏.gif


016_BlurPicker_模糊选择器.gif


017_FadeMessage_界面渐变.gif


018_Gallery_综合界面和主题.gif


019_ImageGestures_打开图片.gif



  • 前面已列出的官方用例还不到1/5,Qt\Examples\Qt-6.2.3\下的Demo还有非常多, 建议先了解有哪些类型的Demo,需要用到相关功能的时候先去找官方示例,后续的示例效果图省略。

  • 官方所有示例的介绍有文字简介和示意图地址(英文版,可以用浏览器翻译成中文查阅,先看Qt Widgets章节,主页只有文字介绍,点开具体示例可以看到演示图片和使用说明):
    All Qt Examples

  • 其它的演示效果图参考网址:
    Qt Examples Qt实例汇总
    Qt Examples


五、Qt C++与C语言混合编程

  • qt_gui_simple2complex\source\005_Qt_with_C_language\下的Demo部分:
  • 主要用于嵌入式的仿真,各种基础模块都自行实现。

六、Qt ffmpeg音视频编解码

  • qt_gui_simple2complex\source\006_AudioVideo_Codec\下的Demo部分:
  • 用于替代硬件音视频编解码器的仿真。

七、用于嵌入式仿真用的音视频播放器

  • qt_gui_simple2complex\source\007_Embeded_Player\下的Demo部分:
  • 只使用Qt的pcm、yuv输入输出和GUI界面显示,音视频编解码库使用ffmpeg,其它封装解封装、音视频同步、播放器API部分都使用C语言自行实现,非常容易就移植到有硬件视频编解码器、硬件音频编解码器、display显示模块的嵌入式开发板。

有关从零开始学习Qt GUI编程的更多相关文章

  1. ruby - 寻找通过阅读代码确定编程语言的ruby gem? - 2

    几个月前,我读了一篇关于ruby​​gem的博客文章,它可以通过阅读代码本身来确定编程语言。对于我的生活,我不记得博客或gem的名称。谷歌搜索“ruby编程语言猜测”及其变体也无济于事。有人碰巧知道相关gem的名称吗? 最佳答案 是这个吗:http://github.com/chrislo/sourceclassifier/tree/master 关于ruby-寻找通过阅读代码确定编程语言的rubygem?,我们在StackOverflow上找到一个类似的问题:

  2. Observability:从零开始创建 Java 微服务并监控它 (二) - 2

    这篇文章是继上一篇文章“Observability:从零开始创建Java微服务并监控它(一)”的续篇。在上一篇文章中,我们讲述了如何创建一个Javaweb应用,并使用Filebeat来收集应用所生成的日志。在今天的文章中,我来详述如何收集应用的指标,使用APM来监控应用并监督web服务的在线情况。源码可以在地址 https://github.com/liu-xiao-guo/java_observability 进行下载。摄入指标指标被视为可以随时更改的时间点值。当前请求的数量可以改变任何毫秒。你可能有1000个请求的峰值,然后一切都回到一个请求。这也意味着这些指标可能不准确,你还想提取最小/

  3. 网络编程套接字 - 2

    网络编程套接字网络编程基础知识理解源`IP`地址和目的`IP`地址理解源MAC地址和目的MAC地址认识端口号理解端口号和进程ID理解源端口号和目的端口号认识`TCP`协议认识`UDP`协议网络字节序socket编程接口`sockaddr``UDP`网络程序服务器端代码逻辑:需要用到的接口服务器端代码`udp`客户端代码逻辑`udp`客户端代码`TCP`网络程序服务器代码逻辑多个版本服务器单进程版本多进程版本多线程版本线程池版本服务器端代码客户端代码逻辑客户端代码TCP协议通讯流程TCP协议的客户端/服务器程序流程三次握手(建立连接)数据传输四次挥手(断开连接)TCP和UDP对比网络编程基础知识

  4. LC滤波器设计学习笔记(一)滤波电路入门 - 2

    目录前言滤波电路科普主要分类实际情况单位的概念常用评价参数函数型滤波器简单分析滤波电路构成低通滤波器RC低通滤波器RL低通滤波器高通滤波器RC高通滤波器RL高通滤波器部分摘自《LC滤波器设计与制作》,侵权删。前言最近需要学习放大电路和滤波电路,但是由于只在之前做音乐频谱分析仪的时候简单了解过一点点运放,所以也是相当从零开始学习了。滤波电路科普主要分类滤波器:主要是从不同频率的成分中提取出特定频率的信号。有源滤波器:由RC元件与运算放大器组成的滤波器。可滤除某一次或多次谐波,最普通易于采用的无源滤波器结构是将电感与电容串联,可对主要次谐波(3、5、7)构成低阻抗旁路。无源滤波器:无源滤波器,又称

  5. CAN协议的学习与理解 - 2

    最近在学习CAN,记录一下,也供大家参考交流。推荐几个我觉得很好的CAN学习,本文也是在看了他们的好文之后做的笔记首先是瑞萨的CAN入门,真的通透;秀!靠这篇我竟然2天理解了CAN协议!实战STM32F4CAN!原文链接:https://blog.csdn.net/XiaoXiaoPengBo/article/details/116206252CAN详解(小白教程)原文链接:https://blog.csdn.net/xwwwj/article/details/105372234一篇易懂的CAN通讯协议指南1一篇易懂的CAN通讯协议指南1-知乎(zhihu.com)视频推荐CAN总线个人知识总

  6. 深度学习部署:Windows安装pycocotools报错解决方法 - 2

    深度学习部署:Windows安装pycocotools报错解决方法1.pycocotools库的简介2.pycocotools安装的坑3.解决办法更多Ai资讯:公主号AiCharm本系列是作者在跑一些深度学习实例时,遇到的各种各样的问题及解决办法,希望能够帮助到大家。ERROR:Commanderroredoutwithexitstatus1:'D:\Anaconda3\python.exe'-u-c'importsys,setuptools,tokenize;sys.argv[0]='"'"'C:\\Users\\46653\\AppData\\Local\\Temp\\pip-instal

  7. ruby - 我正在学习编程并选择了 Ruby。我应该升级到 Ruby 1.9 吗? - 2

    我完全不是程序员,正在学习使用Ruby和Rails框架进行编程。我目前正在使用Ruby1.8.7和Rails3.0.3,但我想知道我是否应该升级到Ruby1.9,因为我真的没有任何升级的“遗留”成本。缺点是什么?我是否会遇到与普通gem的兼容性问题,或者甚至其他我不太了解甚至无法预料的问题? 最佳答案 你应该升级。不要坚持从1.8.7开始。如果您发现不支持1.9.2的gem,请避免使用它们(因为它们很可能不被维护)。如果您对gem是否兼容1.9.2有任何疑问,您可以在以下位置查看:http://www.railsplugins.or

  8. ruby - 如何以编程方式删除实例上的 "singleton information"以使其编码(marshal)? - 2

    我创建了一个由于“在运行时执行的单例元类定义”而无法编码的对象(这段代码的描述是否正确?)。这是通过以下代码执行的:#defineclassXthatmyusesingletonclassmetaprogrammingfeatures#throughcallofmethod:break_marshalling!classXdefbreak_marshalling!meta_class=class我该怎么做才能使对象编码正确?是否可以从对象instance_of_x的classX中“移除”单例组件?我真的需要一个建议,因为我们的一些对象需要通过Marshal.dump序列化机制进行缓存。

  9. Ruby 元编程问题 - 2

    我正在查看Ruby日志记录库Logging.logger方法并从sourceatgithub提出问题与这段代码有关:logger=::Logging::Logger.new(name)logger.add_appendersappenderlogger.additive=falseclass我知道类 最佳答案 这实际上删除了方法(当它实际被执行时)。这是确保close不会被调用两次的保障措施。看起来好像有嵌套的“class 关于Ruby元编程问题,我们在StackOverflow上找到一

  10. ruby - Paperclip:以编程方式分配图像并设置其名称 - 2

    使用Paperclip,我想从这样的URL抓取图像:require'open-uri'user.photo=open(url)问题是我最后得到一个像“open-uri20110915-4852-1o7k5uw”这样的文件名。有什么方法可以更改user.photo上的文件名?作为一个额外的变化,Paperclip将我的文件存储在S3上,所以如果我可以在初始分配中设置我想要的文件名就更好了,这样图像就会上传到正确的S3key。像这样:user.photo=open(url),:filename=>URI.parse(url).path 最佳答案

随机推荐