8.QT-按钮类控件|Push Button|Radio Button|Check Box|Tool Button(C++)
Push Button
使⽤ QPushButton 表⽰⼀个按钮.这也是当前我们最熟悉的⼀个控件了.
 QPushButton 继承⾃ QAbstractButton .这个类是⼀个抽象类.是其他按钮的⽗类
![![[Pasted image 20250419191533.png]]](https://i-blog.csdnimg.cn/direct/bc68f869d9e645bdba1c8c91e399a84e.png)
在Qt Designer中也能够看到这⾥的继承关系
| 属性 | 说明 | 
|---|---|
| text | 按钮中的⽂本 | 
| icon | 按钮中的图标 | 
| iconSize | 按钮中图标的尺⼨ | 
| shortCut | 按钮对应的快捷键 | 
| autoRepeat | 按钮是否会重复触发.当⿏标左键按住不放时, 如果设为true,则会持续产⽣⿏标点击事件; 如果设为false,则必须释放⿏标,再次按下⿏标时才能产⽣点击事件. (相当于游戏⼿柄上的"连发"效果) | 
| autoRepeatDelay | 重复触发的延时时间.按住按钮多久之后,开始重复触发. | 
| autoRepeatInterval | 重复触发的周期. | 
- QAbstractButton 作为 QWidget 的⼦类,当然也继承了 QWidget 的属性.上⾯介绍的 QWidget ⾥的各种属性⽤法,对于 QAbstractButton 同样适⽤.因此表格仅
 列出 QAbstractButton 独有的属性.
- Qt的api设计⻛格是⾮常清晰的.此处列出的属性都是可以 获取 和 设置 的.例如,使⽤ text() 获取按钮⽂本;使⽤ setText() 设置⽂本.
 事实上, QPushButton 的核⼼功能都是 QAbstractButton 提供的.⾃⾝提供的属性都⽐较简单.
 其中 default 和 audoDefault 影响的是按下enter时⾃动点击哪个按钮的⾏为; flat 把按钮设置为扁平的样式.这⾥我们暂时都不做过多关注.
代码⽰例:带有图标的按钮
1)创建 resource.qrc ⽂件,并导⼊图⽚
 ![![[Pasted image 20250419205021.png]]](https://i-blog.csdnimg.cn/direct/49b5677611744208b827eca237283622.png)
2)在界⾯上创建⼀个按钮
 ![![[Pasted image 20250419205128.png]]](https://i-blog.csdnimg.cn/direct/b402193c7777499c865ef8b9a1087438.png)
3)修改widget.cpp,给按钮设置图标
#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//创建图标对象QIcon icon(":/dog.jpg");//设置图标ui->pushButton->setIcon(icon);
}Widget::~Widget()
{delete ui;
}
![![[Pasted image 20250419205838.png]]](https://i-blog.csdnimg.cn/direct/3a6ad1aa27b5484283767437360a3a31.png)
#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//创建图标对象QIcon icon(":/dog.jpg");//设置图标ui->pushButton->setIcon(icon);//设置图标尺寸ui->pushButton->setIconSize(QSize(50, 50));
}Widget::~Widget()
{delete ui;
}
![![[Pasted image 20250419210014.png]]](https://i-blog.csdnimg.cn/direct/419d97493540478282e3bd58b11a61a3.png)
代码⽰例:带有快捷键的按钮
1)在界⾯中拖五个按钮.
 五个按钮的objectName分别为 pushButton_target , pushButton_up ,pushButton_down ,pushButton_left , pushButton_right 五个按钮的初始位置随意,其中 pushButton_target 尺⼨设置为100*100,其余按钮设为50*50.⽂本内容均清空
 2)创建 resource.qrc ,并导⼊5个图⽚
 ![![[Pasted image 20250419211936.png]]](https://i-blog.csdnimg.cn/direct/0583a451fe404db5a8fcf3851fb28d24.png)
3)修改widget.cpp,设置图标资源和快捷键
- 使⽤ setShortcut 给按钮设置快捷键.参数是⼀个QKeySequence对象.表⽰⼀个按键序列.⽀持组合键(ctrl+c这种).
- QKeySequence的构造函数参数,可以直接使⽤"ctrl+c"这样的按键名字符串表⽰,也可以使⽤预定义好的常量(形如 Qt::CTRL + Qt::Key_C )表⽰.
 ![![[Pasted image 20250419212257.png]]](https://i-blog.csdnimg.cn/direct/78952d09cb304295a4cd3d57e6b76616.png) 
![![[Pasted image 20250419212400.png]]](https://i-blog.csdnimg.cn/direct/1ab5bebbdf33498fabb070486f25e37a.png)
完成初始化
#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//设置图标ui->pushButton_target->setIcon(QIcon(":/image/box.png"));ui->pushButton_target->setIconSize(QSize(100,100));ui->pushButton_up->setIcon(QIcon(":/image/up.png"));ui->pushButton_up->setIconSize(QSize(50,50));ui->pushButton_down->setIcon(QIcon(":image/down.png"));ui->pushButton_down->setIconSize(QSize(50,50));ui->pushButton_left->setIcon(QIcon(":image/left.png"));ui->pushButton_left->setIconSize(QSize(50,50));ui->pushButton_right->setIcon(QIcon(":image/right.png"));ui->pushButton_right->setIconSize(QSize(50,50));
}Widget::~Widget()
{delete ui;
}
![![[Pasted image 20250419213210.png]]](https://i-blog.csdnimg.cn/direct/de4ee568ddd04b99a09fb825517e39d6.png)
完成槽函数
void Widget::on_pushButton_up_clicked()
{//获取target的位置QRect rect = ui->pushButton_target->geometry();//基于上次的位置,设置新的位置ui->pushButton_target->setGeometry(rect.x(), rect.y()-5, rect.width(), rect.height());
}void Widget::on_pushButton_down_clicked()
{//获取target的位置QRect rect = ui->pushButton_target->geometry();//基于上次的位置,设置新的位置ui->pushButton_target->setGeometry(rect.x(), rect.y()+5, rect.width(), rect.height());
}void Widget::on_pushButton_left_clicked()
{//获取target的位置QRect rect = ui->pushButton_target->geometry();//基于上次的位置,设置新的位置ui->pushButton_target->setGeometry(rect.x()-5, rect.y(), rect.width(), rect.height());
}void Widget::on_pushButton_right_clicked()
{//获取target的位置QRect rect = ui->pushButton_target->geometry();//基于上次的位置,设置新的位置ui->pushButton_target->setGeometry(rect.x()+5, rect.y(), rect.width(), rect.height());
}
在构造函数完成快捷键
    ui->pushButton_up->setShortcut(QKeySequence("w"));ui->pushButton_down->setShortcut(QKeySequence("s"));ui->pushButton_left->setShortcut(QKeySequence("a"));ui->pushButton_right->setShortcut(QKeySequence("d"));// ui->pushButton_up->setShortcut(QKeySequence(Qt::Key_W));  
// ui->pushButton_down->setShortcut(QKeySequence(Qt::Key_S));  
// ui->pushButton_left->setShortcut(QKeySequence(Qt::Key_A));  
// ui->pushButton_right->setShortcut(QKeySequence(Qt::Key_D));
代码⽰例:按钮的重复触发
在上述案例中,按住快捷键,是可以进⾏重复触发的.但是⿏标点击则不能.
 修改widget.cpp,在构造函数中开启重复触发
 在构造函数中
    ui->pushButton_up->setAutoRepeat(true);ui->pushButton_down->setAutoRepeat(true);ui->pushButton_left->setAutoRepeat(true);ui->pushButton_right->setAutoRepeat(true);
Radio Buttion
QRadioButton 是单选按钮.可以让我们在多个选项中选择⼀个.
 作为 QAbstractButton 和 QWidget 的⼦类,上⾯介绍的属性和⽤法,对于 QRadioButton 同样适⽤.
 QAbstractButton 中和 QRadioButton 关系较⼤的属性
| 属性 | 说明 | 
|---|---|
| checkable | 是否能选中 | 
| checked | 是否已经被选中.checkable是checked的前提条件. | 
| autoExclusive | 是否排他. 选中⼀个按钮之后是否会取消其他按钮的选中. 对于 QRadioButton 来说默认就是排他的 | 
代码⽰例:选择性别
1)在界⾯上创建⼀个label,和3个单选按钮
 设置的⽂本如下图.3个单选按钮的 objectName 分别为 radioButton_male ,radioButton_female , radioButton_other
 ![![[Pasted image 20250419220147.png]]](https://i-blog.csdnimg.cn/direct/9b6dcda43133478ead64399e28295753.png)
编写槽函数
void Widget::on_radioButton_male_clicked()
{//把界面上的label的内容进行更新ui->label->setText("你选择的性别为:男");
}void Widget::on_radioButton_female_clicked()
{ui->label->setText("你选择的性别为:女");
}void Widget::on_radioButton_other_clicked()
{ui->label->setText("你选择的性别为:其他");
}
![![[Pasted image 20250419220411.png]]](https://i-blog.csdnimg.cn/direct/64897a0d59694c8ea01a0c7d33a50688.png)
在构造函数添加默认选项
Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//添加一个默认的选项ui->radioButton_male->setChecked(true);ui->label->setText("你选择的性别为:男");
}
禁用其他选项
Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//添加一个默认的选项ui->radioButton_male->setChecked(true);ui->label->setText("你选择的性别为:男");//禁用其他选项ui->radioButton_other->setCheckable(false);
}
![![[Pasted image 20250419221123.png]]](https://i-blog.csdnimg.cn/direct/3a45c5cc6aa9456d9cf7813c36a8241d.png)
checkable只是能够让按钮不被选中,仍然是可以响应点击事件的
Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//添加一个默认的选项ui->radioButton_male->setChecked(true);ui->label->setText("你选择的性别为:男");//禁用其他选项//ui->radioButton_other->setCheckable(false);ui->radioButton_other->setEnabled(false);//ui->radioButton_other->setDisabled(true);
}
要使用Widget的属性
 ![![[Pasted image 20250419221409.png]]](https://i-blog.csdnimg.cn/direct/5a3edbbe2a554eca8a81b648bbc9f511.png)
代码⽰例:click,press,release,toggled的区别
- clicked表⽰⼀次"点击"
- pressed表⽰⿏标"按下"
- released表⽰⿏标"释放"
- toggled表⽰按钮状态切换.
 1)在界⾯上创建四个单选按钮
 objectName 分别为 radioButton , radioButton_2 , radioButton_3 ,radioButton_4
 ![![[Pasted image 20250419221819.png]]](https://i-blog.csdnimg.cn/direct/fb32eff0ee4a4e49a95c671c02a1141e.png) 
2)给 1 创建 clicked 槽函数,给 2 创建 pressed 槽函数,给 3 创建released 槽函数,给 4 创建 toggled 槽函数.
void Widget::on_radioButton_clicked(bool checked)
{// 此处从 checked 就表示了当前 radioButton 的选中状态qDebug() << "clicked: " << checked;
}void Widget::on_radioButton_2_pressed()
{qDebug() << "pressed";
}void Widget::on_radioButton_3_released()
{qDebug() << "released";
}void Widget::on_radioButton_4_toggled(bool checked)
{//如果当前checked状态发生改变,就会触发这个信号qDebug() << "toggled: " << checked;
}
![![[Pasted image 20250419222518.png]]](https://i-blog.csdnimg.cn/direct/d6f08e85081648e29ac374028890935d.png)
3)运⾏程序,可以看到
- clicked 是⼀次⿏标按下+⿏标释放触发的.
- pressed 是⿏标按下触发的.
- released 是⿏标释放触发的.
- toggled 是checked属性改变时触发的.
 总的来说,toggled是最适合 QRadioButton 的
代码⽰例:单选框分组
1)在界⾯上创建6个单选框,⽤来模拟⻨当劳点餐界⾯.
 objectName 分别为 radioButton 到 radioButton_6
 ![![[Pasted image 20250420085424.png]]](https://i-blog.csdnimg.cn/direct/6a2c3996b05b4f14a558f81859e1750b.png)
此时直接运⾏程序,可以看到,这六个 QRadioButton 之间都是排他的.
 我们希望每⼀组内部来控制排他,但是组和组之间不能排他.
 2)引⼊QButtonGroup进⾏分组.
Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//使用QButtonGroup对单选按钮进行分组QButtonGroup* group1 = new QButtonGroup(this);QButtonGroup* group2 = new QButtonGroup(this);QButtonGroup* group3 = new QButtonGroup(this);//把上述单选按钮,放到不同的组里group1->addButton(ui->radioButton);group1->addButton(ui->radioButton_2);group1->addButton(ui->radioButton_3);group2->addButton(ui->radioButton_4);group2->addButton(ui->radioButton_5);group2->addButton(ui->radioButton_6);group3->addButton(ui->radioButton_7);group3->addButton(ui->radioButton_8);
}
再次执⾏程序,可以看到可以按照正确的分组⽅式来完成排他了
 ![![[Pasted image 20250420090358.png]]](https://i-blog.csdnimg.cn/direct/df68684a7eb345d4b1e1027c8c26e1c5.png)
Check Box
QCheckBox 表⽰复选按钮.可以允许选中多个.和 QCheckBox 最相关的属性也是 checkable 和 checked ,都是继承⾃QAbstractButton .
 ⾄于 QCheckBox 独有的属性 tristate ⽤来实现"三态复选框".这个东西⽐较冷⻔,
代码⽰例:获取复选按钮的取值
1)在界⾯上创建三个复选按钮,和⼀个普通按钮.
 ![![[Pasted image 20250420091312.png]]](https://i-blog.csdnimg.cn/direct/fdcc7dc48c354d799f0643ee1213ae04.png)
2)给 pushButton 添加slot函数
void Widget::on_pushButton_clicked()
{QString result = "今天的安排是";if (ui->checkBox_study->isChecked()){result += ui->checkBox_study->text();}if (ui->checkBox_game->isChecked()){result += ui->checkBox_game->text();}if (ui->checkBox_work->isChecked()){result += ui->checkBox_work->text();}ui->label->setText(result);
}
3)运⾏程序,可以看到点击确认按钮时,就会在控制台中输出选中的内容
 ![![[Pasted image 20250420091809.png]]](https://i-blog.csdnimg.cn/direct/af62c26e622040b99debd813026cf823.png)
Tool Button
QToolButton 的⼤部分功能,和 QPushButton 是⼀致的.但是 QToolButton 主要应⽤在⼯具栏,菜单等场景
