【QT】常⽤控件详解(三）常用按钮控件PushButton RadioButton CheckButton Tool Button

---

前言

一、PushButton

1.1 QAbstractButton

使用QPushButton表示一个按钮.这也是当前我们最熟悉的一个控件了.
QPushButton继承自QAbstractButton .这个类是一个抽象类.是其他按钮的父类.

在QtDesigner中也能够看到这⾥的继承关系.

QAbstractButton 中,和QPushButton 相关性较⼤的属性

属性	说明
text	按钮中的文本
icon	按钮中的图标
iconSize	按钮中图标的尺寸
shortCut	按钮对应的快捷键
autoRepeat	按钮是否会重复触发。当鼠标左键按住不放时， 如果设为 true，则会持续产生鼠标点击事件； 如果设为 false，则必须释放鼠标，再次按下鼠标时才能产生点击事件。 （相当于游戏手柄上的 “连发” 效果）
autoRepeatDelay	重复触发的延时时间。按住按钮多久之后，开始重复触发。
autoRepeatInterval	重复触发的周期。

1. QAbstractButton作为Qwidget的子类,当然也继承了Qwidget的属性.上面
   介绍的 Qwidget里的各种属性用法,对于QAbstractButton同样适用.因此表格仅列出QAbstractButton独有的属性.
   2.Qt的api 设计风格是非常清晰的.此处列出的属性都是可以获取和设置的.例如,使用text()获取按钮文本;使用setText()设置文本.

事实上，QPushButton的核心功能都是QAbstractButton提供的.自身提供的属性都比较简单.
其中default和audoDefault影响的是按下enter时自动点击哪个按钮的行为;flat把按钮设置为扁平的样式.这里我们暂时都不做过多关注.

1.2 添加图标的按钮

1)创建resource.qrc⽂件,并导⼊图⽚

#include "widget.h"
#include "ui_widget.h"
#include <QIcon>
#include <QSize>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);QIcon icon(":/hachimitsu.jpg");ui->pushButton->setIcon(icon);ui->pushButton->setIconSize(QSize(100, 1000));}

1)在界面中拖五个按钮.
五个按钮的objectName分别为pushButton_target , pushButton_up,pushButton_down , pushButton_left , pushButton_right
五个按钮的初始位置随意,其中 pushButton_target尺寸设置为100*100,其余按钮设为50*50.文本内容均清空

2) 创建resource.qrc ,并导⼊5个图⽚.

像上述这样的图⽚资源,可以在"阿⾥巴巴⽮量图标库"中查找并免费下载.
https://www.iconfont.cn/

1.3 给按钮添加快捷键

3. 修改widget.cpp,设置图标资源和快捷键
   使用setShortcut给按钮设置快捷键.参数是一个QKeySequence对象.表示一个按键序列.支持组合键(ctrl+c这种).
   QKeySequence的构造函数参数,可以直接使用"ctrl+c"这样的按键名字符串表示,也可以使用预定义好的常量(形如Qt : : CTRL + Qt : :Key_C )表示.

#include "widget.h"
#include "ui_widget.h"
#include <QIcon>
#include <QSize>
#include <QDebug>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);// 正确设置目标按钮的图标（QPushButton使用setIcon而非setPixmap）QIcon targetIcon(":/hachimitsu.jpg");ui->pushButton_target->setIcon(targetIcon);// 设置图标大小（根据需要调整，避免过大或过小）ui->pushButton_target->setIconSize(QSize(140, 120));  // 修正原代码中1000的不合理高度// 方向按钮图标设置ui->pushButton_up->setIcon(QIcon(":/up.png"));ui->pushButton_down->setIcon(QIcon(":/down.png"));ui->pushButton_left->setIcon(QIcon(":/left.png"));ui->pushButton_right->setIcon(QIcon(":/right.png"));// 统一方向按钮图标大小QSize btnSize(30, 30);ui->pushButton_up->setIconSize(btnSize);ui->pushButton_down->setIconSize(btnSize);ui->pushButton_left->setIconSize(btnSize);ui->pushButton_right->setIconSize(btnSize);// 设置快捷键// 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::~Widget()
{delete ui;
}// 上移按钮
void Widget::on_pushButton_up_clicked()
{const QRect& rect = ui->pushButton_target->geometry();ui->pushButton_target->setGeometry(rect.x(), rect.y() - 5, rect.width(), rect.height());qDebug() << "上移";  // 修正调试信息
}// 下移按钮
void Widget::on_pushButton_down_clicked()
{const QRect& rect = ui->pushButton_target->geometry();ui->pushButton_target->setGeometry(rect.x(), rect.y() + 5, rect.width(), rect.height());qDebug() << "下移";  // 修正调试信息
}// 左移按钮
void Widget::on_pushButton_left_clicked()
{const QRect& rect = ui->pushButton_target->geometry();ui->pushButton_target->setGeometry(rect.x() - 5, rect.y(), rect.width(), rect.height());qDebug() << "左移";  // 修正调试信息
}// 右移按钮
void Widget::on_pushButton_right_clicked()
{const QRect& rect = ui->pushButton_target->geometry();ui->pushButton_target->setGeometry(rect.x() + 5, rect.y(), rect.width(), rect.height());qDebug() << "右移";  // 修正调试信息
}

5. 运⾏程序,此时点击按钮,或者使⽤wasd 均可让哈基米飞行移动.

1.4 代码⽰例:按钮的重复触发

在上述案例中,按住快捷键,是可以进⾏重复触发的.但是⿏标点击则不能.
修改widget.cpp,在构造函数中开启重复触发.

// 开启重复触发
ui->pushButton_up->setAutoRepeat(true);
ui->pushButton_down->setAutoRepeat(true);
ui->pushButton_left->setAutoRepeat(true);
ui->pushButton_right->setAutoRepeat(true);

此时,按住⿏标时,即可让哈基米连续飞行移动.

二、 RadioButtion

2.1简介

属性	说明
checkable	是否能选中
checked	是否已经被选中。checkable 是 checked 的前提条件。
autoExclusive	是否排他。 选中一个按钮之后是否会取消其他按钮的选中。 对于 QRadioButton 来说默认就是排他的。

QRadioButton是单选按钮.可以让我们在多个选项中选择一个.
作为QAbstractButton和 Qwidget的子类,上面介绍的属性和用法,对于 QRadioButton同样适用.
QAbstractButton中和QRadioButton关系较大的属性

2. 修改widget.cpp,编辑三个QRadioButton 的slot函数.

void Widget::on_radioButton_male_clicked()
{ui->label->setText("你的选择的性别为：男");
}void Widget::on_radioButton_female_clicked()
{ui->label->setText("你的选择的性别为：女");
}void Widget::on_radioButton_other_clicked()
{ui->label->setText("你的选择的性别为：其他");
}

3. 运⾏程序,可以看到随着选择不同的单选按钮,label中的提⽰⽂字就会随之变化.
   
4. 当前代码中,如果程序启动,则不会选择任何选项.
   可以修改代码,让程序启动默认选中性别男

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//设置默认选中按钮ui->radioButton_male->setChecked(true);ui->label->setText("你的选择的性别为：男");
}

此时运⾏程序,即可看到性别男已经被选中了.

5. 当前代码中,也可以禁⽤"其他"被选中.

修改widget.cpp的构造函数

 // 禁⽤ other 选项ui->radioButton_other->setCheckable(false);

可见无论怎么点其他都无法选中

2.2 几个槽函数 click,press,release, toggled 的区别

一直用clicked，这次来学习一下，这剩下四个的区别

• clicked表⽰⼀次"点击"
• pressed表⽰⿏标"按下"
• released表⽰⿏标"释放"
• toggled表⽰按钮状态切换

1. 在界⾯上创建四个单选按钮
   objectName分别为radioButton , radioButton_2 , radioButton_3 ,radioButton_4
   
   2)给1创建clicked槽函数,给2创建pressed槽函数,给3创建released槽函数,给4创建toggled槽函数.

void Widget::on_radioButton_1_clicked(bool 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)
{if (checked) {qDebug() << "toggled checked true";} else {qDebug() << "toggled checked false";}
}

3. 运⾏程序,可以看到

• clicked 是⼀次⿏标按下+⿏标释放触发的.
• pressed 是⿏标按下触发的.
• released 是⿏标释放触发的.
• toggled 是checked属性改变时触发的.
  总的来说,toggled是最适合

2.2 模拟分组点餐

1. 在界⾯上创建6个单选框,⽤来模拟⻨当劳点餐界⾯.
   objectName 分别为radioButton 到radioButton_6
   
   此时直接运⾏程序,可以看到,这六个QRadioButton 之间都是排他的.(也就是六个只能选一个)
   我们希望每⼀组内部来控制排他,但是组和组之间不能排他
   

2. 引⼊QButtonGroup进⾏分组.
   修改widget.cpp

#include "widget.h"
#include "ui_widget.h"
#include <QButtonGroup>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//创建三个 QButtonGroupQButtonGroup* group1 = new QButtonGroup(this);QButtonGroup* group2 = new QButtonGroup(this);QButtonGroup* group3 = new QButtonGroup(this);//把 QRadioButton 两两一组，放到三个 QButtonGroup中group1->addButton(ui->radioButton);group1->addButton(ui->radioButton_2);group2->addButton(ui->radioButton_3);group2->addButton(ui->radioButton_4);group3->addButton(ui->radioButton_5);group3->addButton(ui->radioButton_6);
}

再次执⾏程序,可以看到可以按照正确的分组⽅式来完成排他了

三、 CheckBox

• QcheckBox表示复选按钮.可以允许选中多个.
• 和QcheckBox最相关的属性也是checkable和checked ,都是继承自QAbstractButton .
• 至于QCheckBox独有的属性tristate用来实现"三态复选框".这个东西比较冷门,咱们课堂不做讨论.

1)在界面上创建三个复选按钮,和一个普通按钮.
objectName分别为checkBox_eat , checkBox_sleep , checkBox_play ,以及pushButton

2. 给pushButton 添加slot函数

void Widget::on_pushButton_clicked()
{// 1. 重置结果，避免重复叠加QString result = "今天你的安排是：";// 2. 用列表存储选中的内容，自动处理逗号QStringList tasks;if (ui->checkBox_eat->isChecked())   tasks << ui->checkBox_eat->text();if (ui->checkBox_sleep->isChecked()) tasks << ui->checkBox_sleep->text();if (ui->checkBox_play->isChecked())  tasks << ui->checkBox_play->text();// 3. 拼接内容（自动用逗号分隔）result += tasks.join("、");// 4. 更新显示 + 调试输出ui->label->setText(result);qDebug() << "选中的内容：" << result;
}

效果：

四、Tool Button

QToolButton的大部分功能,和QPushButton是一致的.但是QToolButton主要应用在工具栏,菜单等场景.这个我们暂时先不介绍.
下篇写完会附注链接

---

🚩总结

属性	说明
checkable	是否能选中
checked	是否已经被选中。checkable 是 checked 的前提条件。
autoExclusive	是否排他。 选中一个按钮之后是否会取消其他按钮的选中。 对于 QRadioButton 来说默认就是排他的。