Qt6教程之二(3) Buttons

2301_81505962 2024-02-20 10:22:57

按钮是我们常用的控件，Qt中的按钮有push button 、tool button、radio button、check box、command link button、dialog button box几种。下面将依次进行介绍。

相信各位小伙伴到这里，对于创建项目、基本的工程文件结构也比较熟悉了，为了节约大家阅读的时间及控制文章篇幅，下面将只讲解重点相关部分。

对于创建工程、控件拖拽、控件布局等均不会再一一演示和讲解，忘各位小伙伴见谅，下面咱们正式开始写代码吧！

（一)  使用UI界面使用按钮

1、push button

push button是比较常用的一个控件，在软件的各个交互页面会高频出现。首先在界面放置一个push button按钮，并双击按钮把名字改为 button，

https://img-blog.csdnimg.cn/4ab0ff091c50477fb7544ad04dd60c93.png

这里为了演示按钮的作用，我们提前引入按钮事件（关于事件后面的教程会细细讲解） 的实现方法，在Qt中使用 信号与槽的技术来处理事件，那么当鼠标点击一下按钮时就产生了一个点击事件，下面将进行演示按钮事件如何使用。

首先点击信号与槽图标，

https://img-blog.csdnimg.cn/414eba1b19b748d6b500baa49b20e139.png

鼠标左键按住按钮不放向右滑动，此时会弹出槽函数选择框，

https://img-blog.csdnimg.cn/da9ba85c744945ba89aeb75563c7d29b.png

按照下述步骤进行操作，我们实现一个点击按钮关闭窗口的功能；

https://img-blog.csdnimg.cn/f8cee6f7f86e491f9b51d197913dd810.png

点击确定按钮后，如下（代表button按钮的clicked信号已经与窗口的close槽函数连接）；

https://img-blog.csdnimg.cn/3636f4e1c1144a84af843b6937a49f50.png

接着按下Ctrl +S 保存工程文件，我们运行程序，当点击按钮后窗口就会关闭，同时程序也会退出！

https://img-blog.csdnimg.cn/bebeb2e07a944e19ba1adb5e7269d8e2.png

是不是非常简单，因为我们没写一行代码！

2、tool button

tool button （工具按钮）有区别于push button，工具按钮可以显示图标，并且有自己独有的四个属性：

https://img-blog.csdnimg.cn/45a2b97665274fc7a95036d26cfb9ce5.png

同时还多一个trigered信号，就是实现弹出菜单，然后咱们点击了哪一项action，发射的信号。

工具菜单的使用场景：配合菜单栏、action使用，如实现图标按钮，伸缩式菜单等！

首先在UI界面拉取一个tool button，双击按钮把名字改为 工具按钮 ，同时设置显示图标和名字；

https://img-blog.csdnimg.cn/4ed957a897da4799bad63cb0798f5ee7.png

既然tool button同属于qt下的Buttons，那么push button有的属性和方法，tool button也是有的，下面我们来实现点击tool button的信号与槽的绑定，还是实现 关闭窗口的功能。

绑定信号与槽的操作方式与push button一样：

https://img-blog.csdnimg.cn/4a6b9c29da1747319e5ad81b755a163a.png

按下 Ctrl + S保存工程，然后运行程序，当点击toolbutton时，关闭窗口并退出程序。

https://img-blog.csdnimg.cn/82e87ab5004a4070a05f079bf3f0bb4b.png

另外上面提到的  trigered信号，直接使用UI界面的方式暂无实现方案，这个留到纯代码方式实现在讲解！

https://img-blog.csdnimg.cn/ff06e71c36a44adf86a7597e26c274b1.png

3、radio button

radio button称为单选框按钮，当多个radio button同属于一个父组件时，只能选择一个单选按钮，多个按钮之间形成互斥关系！

开始演示： 在UI界面放置3个radio button，

https://img-blog.csdnimg.cn/2a5b16fc096a42eca43eb69268b23d3e.png

按下Ctrl+S 保存工程文件，运行程序后使用鼠标依次点击三个单选框按钮，你会发现始终只能选择一个，

https://img-blog.csdnimg.cn/f83ebf21aa9644b9b63d0eaa791c5100.png

接下来我们实现单选框按钮的事件，就是绑定信号与槽，

不用多说，push button按钮有的信号radio button大部分都有，比如绑定clicked信号实现关闭窗口和程序的功能，

https://img-blog.csdnimg.cn/5d6670eef9854f9bab11e3ae55308afa.png

当选中第一个按钮时，程序将关闭！

https://img-blog.csdnimg.cn/4ba29048ac384702a6da73d231630fc8.png

QRadioButton 没有自己独有的信号，可以使用pressed、released、clicked、toggled等信号。由于QRadioButton常用作选择按钮，需要判断选择状态，所以toggled信号比较常用，使用void toggled(bool checked);信号可以获得该按钮的选中状态，对于这个状态的监控我们留在纯代码实现时在详细讲解，toggled信号如下：（选中按钮实现窗口隐藏）；

https://img-blog.csdnimg.cn/605fe92aa27a4a96a4971b7b5ca7d040.png

4、check box

check box是一个带文本标签的浮选框，这意味着当同一父组件下存在多个check box时，可以选中多个，与radio button刚好相反。

示范：   在UI界面放置五个check box复选框，并设置自己喜欢的文本，

https://img-blog.csdnimg.cn/db672cd73c90493983fa261259795132.png

保存工程文件，运行程序，可以直接选中五个复选框，

https://img-blog.csdnimg.cn/38adbf2b4b89409ca23c3ebbb56f7d77.png

对于复选框，最常用的功能就是检测是否选中，信号为stateChange，

https://img-blog.csdnimg.cn/40c55b0d7a5141f0aabd123edaa18d71.png

这里还是实现关闭程序的功能，至于检测是否选中的详细使用咱们留在纯代码实现时讲解！

https://img-blog.csdnimg.cn/ee7b2e40c2f3489b980ffe3f39f8e50a.png


 运行程序后，当选中第一个复选框时程序关闭，

https://img-blog.csdnimg.cn/2b1badc833914b40bf31c50871a32f83.png

command link button是命令链接按钮，可以显示图标和文字，常用于向导和对话框中的单选按钮的替代。

示范：在桌面拉取一个command link button控件，然后可以在右侧的属性栏设置图标、文字等，

https://img-blog.csdnimg.cn/1c111906457140eda9903ccd0ad00525.png

https://img-blog.csdnimg.cn/4d4122f0a6d74fff90ad1df34af9229e.png

咱们还是利用clicked信号来实现关闭程序的功能，

https://img-blog.csdnimg.cn/f5858f628214495bafdd5334eae2c649.png


 

https://img-blog.csdnimg.cn/a4c409dbd3614f5086b406ef423da1b2.png

运行程序后，点击command link button将关闭窗口， 

 

https://img-blog.csdnimg.cn/560f69d74b94440e9c3994c2ed87d207.png

其他详细功能我们在纯代码实现时详细讲解！ 

6、dialog button box

dialog button box是一个包含很多按钮的控件，可以向QDialogButtonBox添加按钮，QDialogButtonBox会根据平台自动使用合适的布局。

示例： 在UI界面拉取一个dialog button box控件，然后在右侧属性栏找到standardButtons属性，可以按照需求选择多个按钮，并且设置按钮是以水平排列还是垂直排列；

https://img-blog.csdnimg.cn/38c70b2489b0491fafbbf1ac327cf059.png

比如设置为垂直排列，并选择多个按钮，

https://img-blog.csdnimg.cn/398c6ccd642f4e42a3d86d32c0c4ec39.png

对于dialog button box的信号使用：

1当按钮的ButtonRole为AcceptRole或者YesRole时，会触发void QDialogButtonBox::accepted()；

当按钮的ButtonRole为RejectRole或者NoRole时，会触发void QDialogButtonBox::rejected()；

当按钮的ButtonRole为HelpRole时，会触发void QDialogButtonBox::helpRequested()；

示例：

https://img-blog.csdnimg.cn/0af08cba85d646999304beb0e4246ac5.png

选择信号与槽绑定之后，运行程序，点击不同的按钮会依次实现不同类型的功能，如下面实现点击是之后关闭程序，点击否隐藏程序窗口但是不退出。其他详细的功能使用咱们放到纯代码实现时讲解！

 

https://img-blog.csdnimg.cn/f849a37724c241138d5edf787361107f.png

 

https://img-blog.csdnimg.cn/cf4085d6fcd644d69d77de8d53e485a2.png

（二）用纯代码使用按钮

1、push button

2、tool button

3、radio button

4、check box

6、dialog button box

话不多说，直接上代码，这里为了方便，直接把五种按钮写一起了：

mainwindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QPushButton>
#include <QRadioButton>
#include <QToolButton>
#include <QCheckBox>
#include <QCommandLinkButton>
#include <QDialogButtonBox>

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:

    QPushButton *bt;
    QToolButton *toolButton;

    QRadioButton *toolBt;
    QRadioButton *toolBt2;
    QRadioButton *toolBt3;
    QRadioButton *toolBt4;
    QRadioButton *toolBt5;
    QRadioButton *toolBt6;

    QCheckBox *checkBox;
    QCommandLinkButton *commandLinkBtton;
    QDialogButtonBox *dialogButtonBox;

private slots:
   void btnToggled(bool checked);
   void btnCheck(int index);
   void openBaidu();
   void onButtonBoxClick(QAbstractButton *button);

};
#endif // MAINWINDOW_H

mainwindow.cpp

#include "mainwindow.h"
#include <QButtonGroup>
#include <QMenu>
#include<QPushButton>
#include <QDesktopServices>
#include<QUrl>
#include<QDialog>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{

    setGeometry(10,10,1200,1200);

    bt=new QPushButton("button",this);
    connect(bt,SIGNAL(clicked()),this,SLOT(close()));
    bt->setGeometry(10,10,200,30);

    toolButton=new QToolButton(this);
    toolButton->setGeometry(10,110,200,30);
    toolButton->setText("tool button");
    toolButton->setPopupMode(QToolButton::InstantPopup);
    QMenu *menu=new QMenu;
    QAction *open=new QAction("open");
    QAction *close=new QAction("close");
    QAction *save=new QAction("save");
    menu->addAction(open);
    menu->addAction(close);
    menu->addAction(save);
    toolButton->setMenu(menu);
    connect(open,SIGNAL(triggered()),SLOT(close()));
    connect(close,SIGNAL(triggered()),SLOT(close()));
    connect(save,SIGNAL(triggered()),SLOT(close()));

    QButtonGroup *group1=new QButtonGroup(this);
    QButtonGroup *group2=new QButtonGroup(this);
    toolBt=new QRadioButton("blue",this);
    toolBt->setGeometry(10,130,100,30);
    toolBt2=new QRadioButton("red",this);
    toolBt2->setGeometry(10,160,100,30);
    toolBt3=new QRadioButton("yellow",this);
    toolBt3->setGeometry(10,180,100,30);
    group1->addButton(toolBt,0);
    group1->addButton(toolBt2,0);
    group1->addButton(toolBt3,0);
    toolBt4=new QRadioButton("greem",this);
    toolBt4->setGeometry(10,200,100,30);
    toolBt5=new QRadioButton("black",this);
    toolBt5->setGeometry(10,220,100,30);
    toolBt6=new QRadioButton("white",this);
    toolBt6->setGeometry(10,240,100,30);
    group2->addButton(toolBt4,0);
    group2->addButton(toolBt5,0);
    group2->addButton(toolBt6,0);


    //处理事件
    connect(toolBt,SIGNAL(clicked(bool)),this,SLOT(btnToggled(bool)));
    connect(toolBt2,SIGNAL(clicked(bool)),this,SLOT(btnToggled(bool)));
    connect(toolBt3,SIGNAL(clicked(bool)),this,SLOT(btnToggled(bool)));
    connect(toolBt4,SIGNAL(clicked(bool)),this,SLOT(btnToggled(bool)));
    connect(toolBt5,SIGNAL(clicked(bool)),this,SLOT(btnToggled(bool)));
    connect(toolBt6,SIGNAL(clicked(bool)),this,SLOT(btnToggled(bool)));

     checkBox=new QCheckBox("checkBox",this);
     checkBox->setGeometry(10,280,100,30);
     connect(checkBox,SIGNAL(stateChanged(int)),this,SLOT(btnCheck(int)));

     commandLinkBtton=new QCommandLinkButton("baidu","baidu.com",this);
     commandLinkBtton->setGeometry(10,300,100,60);
     connect(commandLinkBtton,SIGNAL(clicked()),this,SLOT(openBaidu()));


     dialogButtonBox=new QDialogButtonBox(QDialogButtonBox::Help|QDialogButtonBox::Ok,Qt::Orientation::Vertical,this);
     dialogButtonBox->setGeometry(10,360,100,200);
     connect(dialogButtonBox,SIGNAL(accepted()),this,SLOT(close()));
     connect(dialogButtonBox,SIGNAL(helpRequested()),this,SLOT(openBaidu()));

//     Yes按钮： 产生accepted信号
//     Yes to All 按钮： 产生accepted信号
//     OK 按钮： 产生accepted信号
//     Save 按钮： 产生accepted信号
//     Save All 按钮： 产生accepted信号
//     Open 按钮： 产生accepted信号
//     Retry 按钮： 产生accepted信号
//     Ignore 按钮： 产生accepted信号
//     Discard 按钮：不产生accepted、rejected、helpRequested信号
//     No 按钮： 产生rejected信号
//     No to All 按钮： 产生rejected信号
//     Abort 按钮： 产生rejected信号
//     Close 按钮： 产生rejected信号
//     Cancel 按钮： 产生rejected信号
//     Apply、 Reset、 Restore Defaults ：这三个按钮不产生accepted、rejected、helpRequested信号
//     Help 按钮： 产生helpRequested信号

}

MainWindow::~MainWindow()
{
}




void MainWindow::btnToggled(bool checked)
{
    if(checked) qDebug()<<"is cheked";
    else qDebug()<<"is uncheked";
}

void MainWindow::btnCheck(int index)
{
    if(index==0){
        qDebug()<<"is uncheked";
    }else {
        qDebug()<<"is cheked";
    }
}

void MainWindow::openBaidu()
{
    QDesktopServices::openUrl(QUrl("https://www.baidu.com/",QUrl::TolerantMode));
}

void MainWindow::onButtonBoxClick(QAbstractButton *button)
{
    if(button==dialogButtonBox->button(QDialogButtonBox::Ok)){
        qDebug()<<"is ok";
    }else if(button==dialogButtonBox->button(QDialogButtonBox::Apply)){
        qDebug()<<"is apply";
    }else if(button==dialogButtonBox->button(QDialogButtonBox::Help)){
        qDebug()<<"is help";
    }
}

main.cpp

#include "mainwindow.h"

#include <QApplication>
#include <QWidget>
#include <QPushButton>
#include <QHBoxLayout>



int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    //创建主窗口
    MainWindow w;
    w.show();

    return a.exec();
}

运行效果： 布局看起来有点乱，但是本节的重点依然是如何实现五种按钮的纯代码使用。

https://img-blog.csdnimg.cn/9979c054eaa946ee83d786f68d0db781.png

文章来源： https://blog.csdn.net/XiaoWang_csdn/article/details/129052371
版权声明： 本文为博主原创文章，遵循CC 4.0 BY-SA 知识共享协议，转载请附上原文出处链接和本声明。

...全文
169 回复 打赏 收藏 转发到动态 举报
写回复
用AI写文章
回复
切换为时间正序
请发表友善的回复…
发表回复
QT_CREATE 教程
Qt是诺基亚开发的一个跨平台的C++图形用户界面应用程序框架。它提供给应用程序开发者建立艺术级的图形用户界面所需的所用功能。Qt是完全面向对象的，很容易扩展，并且允许真正地组件编程。自从1996年早些时候，Qt进入商业领域，它已经成为全世界范围内数千种成功的应用程序的基础。Qt也是流行的Linux桌面环境KDE 的基础。 基本上，Qt 同 X Window 上的 Motif，Openwin，GTK 等图形界 面库和 Windows 平台上的 MFC，OWL，VCL，ATL 是同类型的东西，但Qt具有优良的跨平台特性、面向对象 、丰富的API、大量的开发文档等优点。
qt creator系列教程
qt creator系列教程，学习qt creator的材料
qt creator入门教程
qt creator入门教程,有许多简单基础的实例和源代码
qt+creator教程（经典）初学必看
qt+creator教程（经典）初学必看
qt4系列教程
qt4系列教程,包含如何安装，及一些简单的入门例子
微软技术社区

6,230

社区成员

37,278

社区内容

发帖
与我相关
我的任务
社区描述
微软技术社区为中国的开发者们提供一个技术干货传播平台，传递微软全球的技术和产品最新动态，分享各大技术方向的学习资源，同时也涵盖针对不同行业和场景的实践案例，希望可以全方位地帮助你获取更多知识和技能。
windowsmicrosoft 企业社区
社区管理员
  • 微软技术分享
  • 郑子铭
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

微软技术社区为中国的开发者们提供一个技术干货传播平台，传递微软全球的技术和产品最新动态，分享各大技术方向的学习资源，同时也涵盖针对不同行业和场景的实践案例，希望可以全方位地帮助你获取更多知识和技能。

予力众生，成就不凡！微软致力于用技术改变世界，助力企业实现数字化转型。

试试用AI创作助手写篇文章吧

+ 用AI写文章