【Qt】Qt窗口(四)QStatusBar状态栏,QDockWidget子窗口/浮动窗口的使用
小编个人主页详情—请点击小编个人gitee代码仓库—请点击Qt系列专栏—请点击倘若命中无此运孤身亦可登昆仑送给屏幕面前的读者朋友们和小编自己!目录前言一、QStatusBarQStatusBar中显示消息QStatusBar中添加其它控件二、QDockWidgetQDockWidget子窗口的创建QDockWidget子窗口标题的设置QDockWidget子窗口中添加一个控件QDockWidget子窗口中添加多个控件QDockWidget子窗口位置的设置总结前言【Qt】Qt窗口三QToolBar工具栏的使用设置图标工具栏和菜单栏搭配使用创建多个工具栏工具栏的位置——书接上文 详情请点击——本文由小编为大家介绍——【Qt】Qt窗口四QStatusBar状态栏QDockWidget子窗口/浮动窗口的使用一、QStatusBarQStatusBar中显示消息Status Bar状态栏一般出现在程序窗口的最下方状态栏用于显示一些状态信息例如上图就是画图板中最下方的状态栏依次表示鼠标的位置画图的尺寸画图的大小等状态信息那么我想要QStatusBar上显示一些文本该如何做呢所以接下来我们创建一个项目名为QStatusBar基类为QMainWindow派生类为MainWindow的项目#includemainwindow.h#includeui_mainwindow.hMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QStatusBar*statusBarthis-statusBar();this-setStatusBar(statusBar);}MainWindow::~MainWindow(){deleteui;}由于我们勾选了ui文件Qt帮我们自动生成了一个状态栏QStatusBar所以我们需要使用this-QStatusBar的方式获取状态栏原因和通过this-menuBar的方式一致 在第五点关于QMenuBar创建方式的讨论进行的讲解详情请点击——所以此时我们创建状态栏然后将状态栏设置进窗口中即可运行结果如下直接运行程序那么窗口下方并没有任何关于状态栏的显示原因很简单此时状态栏上并没有任何消息或者控件所以自然的状态栏不会显示#includemainwindow.h#includeui_mainwindow.hMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QStatusBar*statusBarthis-statusBar();this-setStatusBar(statusBar);statusBar-showMessage(这是一个状态消息);}MainWindow::~MainWindow(){deleteui;}下面我们给状态栏使用showMessage在状态栏中显示一个文本运行结果如下此时我们可以看到状态消息一直进行显示那么有没有什么手段让状态栏上的消息显示3秒呢有的此时对于showMessage的第二个参数timeout也就是文本存在的时间默认为0如果文本存在时间我们不填写那么就为默认值0此时消息就会持久存在同样的对于文本存在的时间timeout我们可以自行传入单位是ms毫秒所以如果想要状态栏上的消息显示3秒s的话就应该给showMessage的第二个参数传入3000因为3秒等于3000毫秒运行结果如下所以此时状态栏上显示的消息文本显示了3秒之后就消失了QStatusBar中添加其它控件同样的我们也可以使用addWidget或者addPermanentWidget在QStatusBar状态栏中添加其它控件那么这两者都可以向状态栏中添加控件又有什么区别呢我们知道状态栏的形状是一个长条状的addWidget是从左向右进行添加控件addPermanentWidget是从右向左进行添加控件#includemainwindow.h#includeui_mainwindow.h#includeQLabelMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QStatusBar*statusBarthis-statusBar();this-setStatusBar(statusBar);// statusBar-showMessage(这是一个状态消息, 3000);QLabel*labelnewQLabel(这是一个QLabel);statusBar-addWidget(label);}MainWindow::~MainWindow(){deleteui;}那么我们先将状态栏显示的消息的代码注释掉以免对我们显示控件产生干扰所以此时我们创建一个QLabel并且设置好文本先使用addWidget从左向右向状态栏中先添加一个QLabel运行结果如下此时界面上状态栏就出现左侧就出现了一个QLabel#includemainwindow.h#includeui_mainwindow.h#includeQLabelMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QStatusBar*statusBarthis-statusBar();this-setStatusBar(statusBar);// statusBar-showMessage(这是一个状态消息, 3000);QLabel*labelnewQLabel(这是一个QLabel);statusBar-addWidget(label);QLabel*label2newQLabel(这是另外一个QLabel);statusBar-addWidget(label2);}MainWindow::~MainWindow(){deleteui;}那么既然可以添加一个QLabel是否状态栏中可以出现两个QLabel呢并且是否addWidget是从左向右向状态栏中依次添加控件的呢所以此时我们再创建一个QLabel并且设置好文本使用addWidget再向状态栏中添加一个QLabel运行结果如下首先状态栏中出现了两个QLabel即状态栏上是可以出现重复类型的控件的并且第二个QLabel出现在了第一个QLabel的右边即addWidget果然是从左向右依次向状态栏中添加控件的#includemainwindow.h#includeui_mainwindow.h#includeQLabel#includeQProgressBarMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QStatusBar*statusBarthis-statusBar();this-setStatusBar(statusBar);// statusBar-showMessage(这是一个状态消息, 3000);QLabel*labelnewQLabel(这是一个QLabel);statusBar-addWidget(label);// QLabel* label2 new QLabel(这是另外一个QLabel);// statusBar-addWidget(label2);QProgressBar*progressBarnewQProgressBar();statusBar-addWidget(progressBar);}MainWindow::~MainWindow(){deleteui;}那么我们先将第二个QLabel的代码注释掉也就是此时我们仅仅给状态栏添加一个QLabel去掉第二个QLabel接下来我们创建一个进度条然后使用addWidget从左向右的给状态栏添加一个进度条运行结果如下此时进度条就已经从左向右的添加到状态栏中了#includemainwindow.h#includeui_mainwindow.h#includeQLabel#includeQProgressBarMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QStatusBar*statusBarthis-statusBar();this-setStatusBar(statusBar);// statusBar-showMessage(这是一个状态消息, 3000);QLabel*labelnewQLabel(这是一个QLabel);statusBar-addWidget(label);// QLabel* label2 new QLabel(这是另外一个QLabel);// statusBar-addWidget(label2);QProgressBar*progressBarnewQProgressBar();progressBar-setRange(0,100);progressBar-setValue(50);statusBar-addWidget(progressBar);}MainWindow::~MainWindow(){deleteui;}但是此时状态栏中进度条的进度为0所以此时我们使用setRange设置进度条中的值value的取值范围是0到100然后使用setValue将进度条中的值value设置为50运行结果如下所以此时进度条的进度就为百分之五十了同样的如果在需要进行加载的界面中我们就可以借助在状态栏上设置进度条通过计算加载的进度以进度条的形式告知用户这样用户的体验感会更好#includemainwindow.h#includeui_mainwindow.h#includeQLabel#includeQProgressBar#includeQPushButtonMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QStatusBar*statusBarthis-statusBar();this-setStatusBar(statusBar);// statusBar-showMessage(这是一个状态消息, 3000);QLabel*labelnewQLabel(这是一个QLabel);statusBar-addWidget(label);// QLabel* label2 new QLabel(这是另外一个QLabel);// statusBar-addWidget(label2);QProgressBar*progressBarnewQProgressBar();progressBar-setRange(0,100);progressBar-setValue(50);statusBar-addWidget(progressBar);QPushButton*buttonnewQPushButton(按钮);statusBar-addPermanentWidget(button);}MainWindow::~MainWindow(){deleteui;}那么如果想要从右向左的给状态栏添加控件该如何做呢所以此时我们创建一个按钮然后使用addPermanentWidget从右向左的给状态栏添加一个按钮运行结果如下所以此时按钮就被从右向左的添加到了状态栏上注意这可是一个按钮所以可以和用户进行交互那么我们可以给这个按钮的clicked点击信号关联并实现槽函数在槽函数中完成某些功能这样用户点击状态栏上的按钮就会触发按钮的clicked信号进而就会执行关联的槽函数在槽函数中就会执行代码完成某些功能所以此时就可以和用户进行交互也就是用户点击按钮就会完成某些功能二、QDockWidgetQDockWidget子窗口的创建QDockWidget叫做铆接部件也可以叫做浮动窗口通俗来讲就是子窗口对于一个子窗口来讲子窗口可以出现在主窗口的上方下方左侧右侧例如我们在Qt中打开一个之前的文件然后点击ui文件进入Qt Creator那么上图中左侧红框的窗口可以称为一个子窗口右侧上方红框的窗口可以称为一个子窗口右侧下方红框的窗口可以称为一个子窗口所以也就意味着子窗口可以存在多个并且上方下方左侧右侧都可以存在Qt中使用QDockWidget来实现子窗口那么子窗口究竟是长什么样子呢我们又如何给子窗口添加控件呢所以接下来我们创建一个项目名为QDockWidget基类为QMainWindow派生类为MainWindow的项目#includemainwindow.h#includeui_mainwindow.h#includeQDockWidgetMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QDockWidget*dockWidgetnewQDockWidget();this-addDockWidget(Qt::LeftDockWidgetArea,dockWidget);}MainWindow::~MainWindow(){deleteui;}所以此时我们先创建一个子窗口QDockWidget接下来就要将子窗口使用addDockWidget添加到主窗口MainWindow中如上我们可以看到addDockWidget有两个参数第一个参数是枚举类型要求我们传入一个如下的区域枚举类型第二个参数是传入子窗口的指针所以第一个参数我们传入Qt::LeftDockWidgetArea让子窗口的初始位置停靠在左侧第二个参数我们传入子窗口的指针即可 关于第一个参数的区域位置也就是子窗口的位置的设置其实和工具栏的位置讲解类似在第一点QToolBar的使用中的创建多个工具栏工具栏的位置中的第4点进行的讲解详情请点击——1Qt::TopDockWidgetArea停靠在上边也就是顶部2Qt::BottomDockWidgetArea停靠在下边也就是底部3Qt::LeftDockWidgetArea停靠在左边也就是左侧4Qt::RightDockWidgetArea停靠在右边也就是右侧5Qt::AllDockWidgetAreas上下左右都可以进行停靠一般不用于初始化子窗口的位置运行结果如下此时子窗口的初始位置就是出现在主窗口MainWindow的左侧那么我们可以拖动子窗口出现在窗口的上方下方左侧右侧同样的我们也可以将子窗口拖动到MainWindow的中央处于浮动状态并且我们还可以把子窗口拖拽的大一点此时我们注意到子窗口也是有标题的并且子窗口还可以拖动到MainWindow的外面我们还可以点击❌️关闭子窗口但是子窗口内部还是有些单调的子窗口内部没有控件所以后面我们要向子窗口内部添加控件QDockWidget子窗口标题的设置#includemainwindow.h#includeui_mainwindow.h#includeQDockWidgetMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QDockWidget*dockWidgetnewQDockWidget();this-addDockWidget(Qt::LeftDockWidgetArea,dockWidget);dockWidget-setWindowTitle(这是一个浮动窗口);}MainWindow::~MainWindow(){deleteui;}通过上一个代码的运行我们看到子窗口也就是浮动窗口是有窗口标题WindowTitle的关于窗口标题在第二点QWidget的windowTitle属性中进行的讲解详情请点击——所以此时我们就使用setWindowTitle给浮动窗口添加标题即可运行结果如下所以此时子窗口也就是浮动窗口的标题就被设置了QDockWidget子窗口中添加一个控件在之前我们提到了其实浮动窗口内部有点单调了一个控件都没有所以此时我们来给浮动窗口添加控件按照我们之前的经验给窗口添加控件可以使用addWidget但是此时我们给浮动窗口添加控件的时候发现并没有所谓的addWidget嘶难道不能直接给浮动窗口添加多个控件嘛那么我们来试试setWidget果然有这个接口也就意味着此时对浮动窗口来讲我们不能直接给浮动窗口添加多个控件只能给浮动窗口添加一个控件好吧好吧一个控件就一个控件#includemainwindow.h#includeui_mainwindow.h#includeQDockWidget#includeQLabelMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QDockWidget*dockWidgetnewQDockWidget();this-addDockWidget(Qt::LeftDockWidgetArea,dockWidget);dockWidget-setWindowTitle(这是一个浮动窗口);QLabel*labelnewQLabel(这是一个QLabel);dockWidget-setWidget(label);}MainWindow::~MainWindow(){deleteui;}所以此时我们创建一个标签QLabel并且设置好文本接下来使用setWidget将标签控件设置进子窗口中即可运行结果如下所以此时我们就成功的给浮动窗口添加了一个QLabel控件但是问题来了我们如何才能给浮动窗口添加多个控件呢并且此时小编拖动浮动窗口到主窗口中央然后拖动浮动窗口的大小其中的QLabel控件并不能随着浮动窗口的大小而改变如何才能让浮动窗口内的控件随着浮动窗口的大小而自适应调整呢这些问题小编接下来就来进行解答QDockWidget子窗口中添加多个控件通过我们之前的学习QWidget也是一个控件但是不同的是QWidget是一个窗口控件也就是说QWidget中可以包含很多的控件诶此时不就正好符合我们的需求嘛我们给QWidget窗口控件中放置很多的控件然后将QWidget窗口设置到浮动窗口中这样浮动窗口尽管只包含了一个QWidget窗口控件但是QWidget窗口控件中包含了很多的控件呀此时就相当于我们给浮动窗口中添加了多个控件那么如何才能让浮动窗口内的多个控件随着浮动窗口的大小改变而自适应的调整呢此时我们可以使用布局管理器这里我们简单一点使用水平布局管理器即可但是这个水平布局管理器不是直接设置给浮动窗口的而是设置给浮动窗口内的QWidget窗口的为什么呢首先浮动窗口内添加了QWidget窗口之后默认这个QWidget窗口就会适配满浮动窗口也就是说QWidget窗口的大小和浮动窗口一致换句话来说当浮动窗口的大小改变的时候此时QWidget窗口也会进行改变而我们要求的是浮动窗口内的多个控件随着浮动窗口大小的改变而改变而这些控件是直接处于浮动窗口内的嘛不是不是这些控件是处于浮动窗口包含的QWidget窗口内的所以我们给QWidget窗口设置布局管理器才可以影响到这些控件让这些控件的大小自适应QWidget窗口的变化而QWidget窗口的变化又是随着浮动窗口大小的改变而改变所以换句话来讲浮动窗口的大小改变会影响QWidget窗口的大小由于我们给QWidget窗口设置了水平布局管理器所以QWidget窗口大小的改变又会影响QWidget窗口内的多个控件进行自适应调整那么此时就相当于实现了浮动窗口内的多个控件随着浮动窗口大小的改变而自适应调整 关于水平布局管理器QHBoxLayout在第二点QHBoxLayout中进行的讲解详情请点击——#includemainwindow.h#includeui_mainwindow.h#includeQDockWidget#includeQLabel#includeQHBoxLayout#includeQPushButtonMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QDockWidget*dockWidgetnewQDockWidget();this-addDockWidget(Qt::LeftDockWidgetArea,dockWidget);dockWidget-setWindowTitle(这是一个浮动窗口);QWidget*containernewQWidget();dockWidget-setWidget(container);QHBoxLayout*layoutnewQHBoxLayout();container-setLayout(layout);QLabel*labelnewQLabel(这是一个QLabel);layout-addWidget(label);QPushButton*buttonnewQPushButton(这是一个按钮);layout-addWidget(button);}MainWindow::~MainWindow(){deleteui;}需要注意的是虽然QWidget窗口可以通过对象树机制添加多个控件也就是我们在创建多个控件的时候通过指定控件的父元素为QWidget进而QWidget可以直接添加多个控件但是由于此时我们引入了水平布局管理器所以我们就不采用这种对象树机制给QWidget窗口添加多个控件了而是采用水平布局管理器的addWidget方式接下来我们首先创建QWidget对象然后将QWidget对象使用setWidget设置进QDockWidget浮动窗口中然后我们创建水平布局管理器将水平布局管理器通过setLayout设置进QWidget窗口中接下来我们创建QLabel并设置文本使用addWidget将QLabel标签添加到水平布局管理器中同样的创建QPushButton按钮并设置文本使用addWidget将按钮添加到水平布局管理器中所以此时处于水平布局管理器的两个控件在列上就会随着QWidget窗口大小的调整而调整而由于QWidget窗口的大小是随着QDockWidget浮动窗口调整的所以QDockWidget浮动窗口大小的调整就会影响QWidget窗口的大小而一旦QWidget窗口的大小发生改变那么水平布局管理器内的两个控件就会自适应的调整自身大小去适应QWidget窗口的变换进而此时就呈现浮动窗口内的控件就会自适应调整自身大小去适应浮动窗口的大小改变的效果运行结果如下此时很完美浮动窗口内的控件自适应调整自身大小去适应浮动窗口大小的改变#includemainwindow.h#includeui_mainwindow.h#includeQDockWidget#includeQLabel#includeQHBoxLayout#includeQPushButtonMainWindow::MainWindow(QWidget*parent):QMainWindow(parent),ui(newUi::MainWindow){ui-setupUi(this);QDockWidget*dockWidgetnewQDockWidget();this-addDockWidget(Qt::LeftDockWidgetArea,dockWidget);dockWidget-setWindowTitle(这是一个浮动窗口);QWidget*containernewQWidget();dockWidget-setWidget(container);QHBoxLayout*layoutnewQHBoxLayout();container-setLayout(layout);QLabel*labelnewQLabel(这是一个QLabel);layout-addWidget(label);QPushButton*buttonnewQPushButton(这是一个按钮);layout-addWidget(button);dockWidget-setAllowedAreas(Qt::LeftDockWidgetArea|Qt::TopDockWidgetArea);}MainWindow::~MainWindow(){deleteui;}QDockWidget子窗口位置的设置同样的我们还可以通过setAllowedAreas设置浮动窗口允许停靠的位置通过传入Qt::LeftDockWidgetArea | Qt::TopDockWidgetArea设置浮动窗口只允许停靠在主窗口MainWindow的左侧和顶部 关于浮动窗口区域位置的设置也就是子窗口的位置的设置其实和工具栏的位置讲解类似在第一点QToolBar的使用中的创建多个工具栏工具栏的位置中的第6点进行的讲解详情请点击——运行结果如下所以此时浮动窗口只能停靠在主窗口MainWindow的左侧和顶部当小编将浮动窗口放到主窗口MainWindow的右侧和底部的时候此时并不会出现蓝色框自适应区域也就是说浮动窗口无法停靠在主窗口MainWindow的右侧和底部这也很好理解因为我们当初设置的就是只允许浮动窗口停靠在主窗口MainWindow的左侧和顶部但是此时小编拖拽将浮动窗口拖拽到主窗口MainWindow的右侧和底部貌似浮动窗口停在了主窗口MainWindow的右侧和底部注意此时浮动窗口是出于浮动状态那么我们可以通过setFloatable设置浮动窗口的floatable属性为false此时浮动窗口就不能浮动了也就无法停留在主窗口MainWindow的右侧和底部了此时也就可以验证出来类似的过程小编在工具栏中已经进行了验证 关于浮动窗口区域位置的设置也就是子窗口的位置的设置其实和工具栏的位置讲解类似在第一点QToolBar的使用中的创建多个工具栏工具栏的位置中的第7点进行的讲解详情请点击——同样的对于浮动窗口可以通过通过如下四种方案来进行控制浮动窗口的位置1可以设置浮动窗口出现的初始位置分别是上下左右2可以设置浮动窗口允许停靠在哪些边缘3可以设置浮动窗口是否允许浮动4可以设置浮动窗口是否允许移动对于如上的四种方案对于第1种和第2钟小编已经带领大家验证了关于第3钟和第4钟小编其实在工具栏中也已经进行了验证了这里关于浮动窗口位置的设置其实浮动窗口和工具栏都是想通的所以这里小编就不再进行验证了感兴趣的读者友友可以自行验证同样的小编其实在工具栏也进行了验证这四种方案 关于工具栏四种方案的验证在第一点QToolBar的使用中的创建多个工具栏工具栏的位置中的第3点中进行的讲解详情请点击——总结以上就是今天的博客内容啦希望对读者朋友们有帮助水滴石穿坚持就是胜利读者朋友们可以点个关注点赞收藏加关注找到小编不迷路