【Qt】从QMainWindow到UI框架

2024-03-16 03:28
文章标签 qt ui 框架 qmainwindow

本文主要是介绍【Qt】从QMainWindow到UI框架，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

目录

  • 简介
  • UI布局元素
    • Central Widget
    • Menu Bar
    • Toolbars
    • Status Bar
    • Dock Widgets
  • 参考文档

简介

如下图所示，我们常见的一些desktop软件，比如VS Code、Smart VCI等，一般都会包含顶部的菜单栏，底部的状态栏，以及一些其他UI布局元素。
在这里插入图片描述
在这里插入图片描述

新建Qt项目是以MainWindow作为显示的载体，MainWindow是继承自QMainWindow的一个子类。

如下图所示，QMainWindow本身提供了常用的UI布局元素1，包括：

  • Menu Bar 菜单栏
  • Toolbars 工具栏
  • Status Bar 状态栏
  • Dock Widgets Dock栏
  • Central Widget 页面内容区域
    在这里插入图片描述
    合理利用这几种元素，我们就可以构建出我们常见的desktop布局了：
    在这里插入图片描述

接下来我们一次介绍这些元素及其基本使用方法

UI布局元素

Central Widget

Central Widget主要用来显示页面内容，通常是自定义Widget，也就是QWidget的子类，用来展示我们App的主要内容。可以调用QMainWindow的setCentralWidget()方法来设置Central Widget。

Menu Bar

Menu Bar也就是我们常见的菜单栏，在Qt中是用QMenuBar2类创建的。
在介绍QMenuBar之前，需要先介绍另外一个类QAction3。在desktop应用中，经常通过菜单栏中的菜单、工具栏按钮或者快捷键调用一些应用中常用的功能，比如打开文件操作。对于同一个功能，不管通过什么方式调用，执行的命令应该是同一个。这种情况下把功能抽象为Action是非常有用的，在Qt中，就是QAction。也就是说QAction是某个应用功能的抽象，可以同时被添加到菜单栏、工具栏和快捷键，Qt会自动完成在不同地方的状态同步。以下面代码为例：

    // ...QAction *submenu4 = new QAction("子菜单四");submenu4->setCheckable(true);submenu4->setShortcuts(QKeySequence::Copy);// ...menubar->addAction(submenu4);toolbar->addAction(submenu4);

如果在应用中执行“Ctrl + C”， 子菜单四就会被选中，菜单栏、工具栏中的子菜单四状态都会同时发生改变：
在这里插入图片描述

接下来可以开始介绍QMenuBar了，它的功能就是创建菜单栏，容纳QMenu4。通过QMainWinow的void setMenuBar(QMenuBar *menuBar)5功能添加菜单栏，通过QMenuBar的addMenu6方法为菜单栏添加菜单元素，通过addAction方法添加具体命令。
通过下面例子介绍具体使用：

QMenuBar *menubar = new QMenuBar();
// 创建多级菜单
QMenu *menu1 = new QMenu("菜单一");QMenu *submenu1 = new QMenu("子菜单一");
QAction *submenu11 = new QAction("二级子菜单一");
QAction *submenu12 = new QAction("二级子菜单二");
submenu1->addAction(submenu11);
submenu1->addAction(submenu12);QAction *submenu2 = new QAction("子菜单二");
menu1->addMenu(submenu1);
menu1->addAction(submenu2);// 没有子菜单的一级菜单
QAction *menu2 = new QAction("菜单二");menubar->addMenu(menu1);menubar->addAction(menu2);

效果如下图
在这里插入图片描述

Toolbars

与菜单栏类似，Qt通过QToolBar7创建工具栏，通过QMainWindow的void addToolBar(QToolBar *toolbar)8可以为窗口添加工具栏，一个窗口中可以添加多个工具栏。
工具栏元素可以添加QAction也可以添加QWidget，对应添加方法是addAction()、addWidget()。QMainWindow添加工具栏时可以指定工具栏的默认位置，通过下面的例子介绍具体使用

    QAction *submenu2 = new QAction("子菜单二");QAction *submenu3 = new QAction("子菜单三");QAction *submenu4 = new QAction("子菜单四");QPushButton *btn = new QPushButton("按钮");QToolBar *toolbar = new QToolBar();toolbar->addAction(submenu2);toolbar->addAction(submenu3);toolbar->addSeparator(); // 菜单元素之间增加分割线toolbar->addWidget(btn);QToolBar *toolbar2 = new QToolBar();toolbar2->addAction(submenu4);addToolBar(toolbar);addToolBar(toolbar2);

效果如图：在这里插入图片描述
菜单栏默认会被添加在窗口上方，菜单栏默认也是可以拖动到窗口的四个边，也可以处于悬浮状态请添加图片描述
对于上述的默认值，可以手动做一些限制和调整：

  • 指定初始位置，在调用addToolBar()时指定位置，比如addToolBar(toolbar, Qt::TopToolBarArea)。位置包括LeftToolBarArea、RightToolBarArea、TopToolBarArea、BottomToolBarArea。
  • 是否允许多动，通过QToolBar的void setMovable(bool movable)
  • 指定可以拖动到的窗口位置，通过QToolBar的void setAllowedAreas(Qt::ToolBarAreas areas)，比如只允许窗口上方或者窗口下方toolbar->setAllowedAreas(Qt::TopToolBarArea | Qt::BottomToolBarArea);
  • 菜单栏是否可以处于悬浮状态，通过QToolBar的void setFloatable(bool floatable)

Status Bar

通过QStatusBar9为窗口添加状态栏，位于窗口底部，一般用于显示一些通知和提示。QMainWindow的setStatusBar()函数为窗口设置状态栏。
通过statusBar()->showMessage("Message", 2000);在状态栏显示信息，并支持指定信息存在的时长。

Dock Widgets

相比于QToolBar，Dock Widgets10的内容有更多自由度，一般用于显示一些工作区域，比如文档目录这些。通过QMainWindow的addDockWidget为窗口添加Dock Widget。

和工具栏类似，Dock Widget也可以指定初始位置、是否可以拖动、允许的位置以及是否可以处于悬浮状态等。

同一个窗口同样可以添加多个Dock Widget，多个Widget还可以组合在一起，通过tab切换

通过如下示例说明：

    QDockWidget *dockWidget = new QDockWidget("Dock Widget");QLabel *dockWidgetContent = new QLabel("dock Widget内容");dockWidgetContent->setStyleSheet("background-color:green;color: white;");dockWidget->setWidget(dockWidgetContent);addDockWidget(Qt::LeftDockWidgetArea, dockWidget);QDockWidget *dockWidget2 = new QDockWidget("Dock Widget 2");QLabel *dockWidgetContent2 = new QLabel("dock Widget 2 内容");dockWidgetContent2->setStyleSheet("background-color:green;color: white;");dockWidget2->setWidget(dockWidgetContent2);addDockWidget(Qt::LeftDockWidgetArea, dockWidget2);QDockWidget *dockWidget3 = new QDockWidget(tr("Dock Widget 3"));dockWidget3->setAllowedAreas(Qt::LeftDockWidgetArea |Qt::RightDockWidgetArea);QLabel *dockWidgetContent3 = new QLabel("dock Widget 3 内容");dockWidgetContent3->setStyleSheet("background-color:green;color: white;");dockWidget3->setWidget(dockWidgetContent3);addDockWidget(Qt::LeftDockWidgetArea, dockWidget3);tabifyDockWidget(dockWidget, dockWidget2); // 将dockWidget和dockWidget2组合tabifyDockWidget(dockWidget, dockWidget3); // 将docketWidget、dockWidget2以及dockWidget3组合在一起

效果如下图：
在这里插入图片描述

请添加图片描述

参考文档

  1. https://doc.qt.io/qt-6/qmainwindow.html#qt-main-window-framework ↩︎

  2. https://doc.qt.io/qt-6/qmenubar.html ↩︎

  3. https://doc.qt.io/qt-6/qaction.html ↩︎

  4. https://doc.qt.io/qt-6/qmenu.html ↩︎

  5. https://doc.qt.io/qt-6/qmainwindow.html#setMenuBar ↩︎

  6. https://doc.qt.io/qt-6/qmenubar.html#addMenu-1 ↩︎

  7. https://doc.qt.io/qt-6/qtoolbar.html ↩︎

  8. https://doc.qt.io/qt-6/qmainwindow.html#addToolBar-1 ↩︎

  9. https://doc.qt.io/qt-6/qstatusbar.html ↩︎

  10. https://doc.qt.io/qt-6/qdockwidget.html#details ↩︎

这篇关于【Qt】从QMainWindow到UI框架的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/814121。

相关文章

PyQt6中QMainWindow组件的使用详解

PyQt6中QMainWindow组件的使用详解

《PyQt6中QMainWindow组件的使用详解》QMainWindow是PyQt6中用于构建桌面应用程序的基础组件,本文主要介绍了PyQt6中QMainWindow组件的使用,具有一定的参考价值,... 目录1. QMainWindow 组php件概述2. 使用 QMainWindow3. QMainW
阅读更多...
在 PyQt 加载 UI 三种常见方法

在 PyQt 加载 UI 三种常见方法

《在PyQt加载UI三种常见方法》在PyQt中,加载UI文件通常指的是使用QtDesigner设计的.ui文件,并将其转换为Python代码,以便在PyQt应用程序中使用,这篇文章给大家介绍在... 目录方法一：使用 uic 模块动态加载 （不推荐用于大型项目）方法二：将 UI 文件编译为 python 模
阅读更多...
Spring框架中@Lazy延迟加载原理和使用详解

Spring框架中@Lazy延迟加载原理和使用详解

《Spring框架中@Lazy延迟加载原理和使用详解》：本文主要介绍Spring框架中@Lazy延迟加载原理和使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录一、@Lazy延迟加载原理1.延迟加载原理1.1 @Lazy三种配置方法1.2 @Component
阅读更多...
Qt实现网络数据解析的方法总结

Qt实现网络数据解析的方法总结

《Qt实现网络数据解析的方法总结》在Qt中解析网络数据通常涉及接收原始字节流,并将其转换为有意义的应用层数据,这篇文章为大家介绍了详细步骤和示例,感兴趣的小伙伴可以了解下... 目录1. 网络数据接收2. 缓冲区管理（处理粘包/拆包）3. 常见数据格式解析3.1 jsON解析3.2 XML解析3.3 自定义
阅读更多...
C++如何通过Qt反射机制实现数据类序列化

C++如何通过Qt反射机制实现数据类序列化

《C++如何通过Qt反射机制实现数据类序列化》在C++工程中经常需要使用数据类,并对数据类进行存储、打印、调试等操作,所以本文就来聊聊C++如何通过Qt反射机制实现数据类序列化吧... 目录设计预期设计思路代码实现使用方法在 C++ 工程中经常需要使用数据类，并对数据类进行存储、打印、调试等操作。由于数据类
阅读更多...
Qt中QGroupBox控件的实现

Qt中QGroupBox控件的实现

《Qt中QGroupBox控件的实现》QGroupBox是Qt框架中一个非常有用的控件,它主要用于组织和管理一组相关的控件,本文主要介绍了Qt中QGroupBox控件的实现,具有一定的参考价值,感兴趣... 目录引言一、基本属性二、常用方法2.1 构造函数 2.2 设置标题2.3 设置复选框模式2.4 是否
阅读更多...
QT进行CSV文件初始化与读写操作

QT进行CSV文件初始化与读写操作

《QT进行CSV文件初始化与读写操作》这篇文章主要为大家详细介绍了在QT环境中如何进行CSV文件的初始化、写入和读取操作,本文为大家整理了相关的操作的多种方法,希望对大家有所帮助... 目录前言一、CSV文件初始化二、CSV写入三、CSV读取四、QT 逐行读取csv文件五、Qt如何将数据保存成CSV文件前言
阅读更多...
Qt中QUndoView控件的具体使用

Qt中QUndoView控件的具体使用

《Qt中QUndoView控件的具体使用》QUndoView是Qt框架中用于可视化显示QUndoStack内容的控件,本文主要介绍了Qt中QUndoView控件的具体使用,具有一定的参考价值,感兴趣的... 目录引言一、QUndoView 的用途二、工作原理三、 如何与 QUnDOStack 配合使用四、自
阅读更多...
Qt spdlog日志模块的使用详解

Qt spdlog日志模块的使用详解

《Qtspdlog日志模块的使用详解》在Qt应用程序开发中,良好的日志系统至关重要,本文将介绍如何使用spdlog1.5.0创建满足以下要求的日志系统,感兴趣的朋友一起看看吧... 目录版本摘要例子logmanager.cpp文件main.cpp文件版本spdlog版本：1.5.0采用1.5.0版本主要
阅读更多...
Python Dash框架在数据可视化仪表板中的应用与实践记录

Python Dash框架在数据可视化仪表板中的应用与实践记录

《PythonDash框架在数据可视化仪表板中的应用与实践记录》Python的PlotlyDash库提供了一种简便且强大的方式来构建和展示互动式数据仪表板,本篇文章将深入探讨如何使用Dash设计一... 目录python Dash框架在数据可视化仪表板中的应用与实践1. 什么是Plotly Dash？1.1
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2