往期回顾
【QT入门】Qt自定义控件与样式设计之QPushButton常用qss-CSDN博客
【QT入门】 Qt自定义控件与样式设计之QPushButton实现鼠标悬浮按钮弹出对话框-CSDN博客
【QT入门】 Qt自定义控件与样式设计之QComboBox样式表介绍-CSDN博客
【QT入门】 Qt自定义控件与样式设计之QCheckBox、qss实现按钮开关
一、最终效果
实现点击按钮切换开启和关闭两种状态,并对两种状态进行不同的样式设计,其实很简单,用了两张图片去切换。
二、checkbox控件
在Qt框架中,checkbox控件是通过QCheckBox类来实现的。QCheckBox类提供了一种方便的方式来创建和管理复选框控件,用于表示两种状态之间的选择,类似于HTML中的checkbox元素。
1、常见特点和用法
1.1创建QCheckBox控件
可以使用以下代码在Qt中创建一个QCheckBox控件:
QCheckBox *checkBox = new QCheckBox("选择项", parent);
1.2设置文本和状态
可以使用setText()方法设置复选框显示的文本,setChecked()方法设置复选框的选中状态。
1.3获取复选框状态
可以使用isChecked()方法来获取复选框当前的选中状态。
1.4信号和槽机制
QCheckBox类提供了stateChanged(int state)信号,可以通过连接这个信号和槽函数来响应复选框状态的改变。
1.5样式定制
可以通过设置样式表来自定义复选框的外观,比如改变颜色、大小、边框等。
1.6布局管理
可以将QCheckBox控件放置在布局管理器中,以便更好地控制其位置和大小。
2、实现按钮开关示例
上面说了,QCheckBox类提供了一种方便的方式来创建和管理复选框控件,用于表示两种状态之间的选择,但是,其实checkbox是一个三态按钮,还有一个状态,不仅仅有选中和未选中两种状态,还有一种部分选中状态
ConstantValueDescription
Qt::Unchecked 0 The item is unchecked.
Qt::PartiallyChecked 1 The item is partially checked. Items in hierarchical models may be partially checked if some, but not all, of their children are checked.
Qt::Checked 2 The item is checked.
2.1状态解释
Qt::Unchecked (数值为0): | 表示复选框未被选中,即未被勾选的状态。 |
Qt::PartiallyChecked (数值为1): | 表示复选框处于部分选中状态。在具有层次结构的模型中,如果某个项目的部分子项目被选中,但不是所有子项目都被选中,那么该项目就会处于部分选中状态。 |
Qt::Checked (数值为2): | 表示复选框已被选中,即被勾选的状态。 |
2.2代码示例
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
ui->checkBox->setFixedSize(128, 64);
QString qss = "QCheckBox::indicator:unchecked{ \
image:url(:/resources/status_close.png); \
} \
QCheckBox::indicator:checked { \
image: url(:/resources/status_open.png); \
}";
ui->checkBox->setStyleSheet(qss);
ui->checkBox->setChecked(true);
//ui->checkBox->setTristate(true);
connect(ui->checkBox, &QCheckBox::stateChanged , [=](int state){
qDebug() << state;
});
}
以上就是QCheckBox qss实现按钮开关基本示例,更多是对QCheckBox控件的掌握
都看到这里了,点个赞再走呗朋友~
加油吧,预祝大家变得更强!