学习样式表的目的:可以设计出好看的控件。(比如可以给一些按钮设计成好看的图片)
QT 样式表的思想很大程度上是来自于HTML的层叠式样式表(CSS),通过调用QWidget->setStyleSheet()或者QApplication->setStyleSheet(),你可以为一个独立的子部件、整个窗口,甚至是整个应用程序指定一个样式表。
样式表的语法基础:
QT样式表与CSS的语法规则几乎完全相同。
一个样式表由一系列的样式规则构成,每个样式规则都有着下面的形式;
selector { attribute: value }
选择器:(selector )部分通常是一个类名(例如QComboBox),当然也还有其他的语法形式。
属性(attribute)部分是一个样式表属性的名字,值(value )部分是赋给该属性的值。
为了使用上的方便,我们还可以使用一种简化形式:
selector1, selector2, ..., selectorM { attribute1: value1; attribute2: value2; attribute3: value3; ....... attributeN: valueN; }
这种简化方式可以同时为与M个选择器相匹配的部件设置N种属性。例如:
QChecked,QComboBox, QSpinBox{ color :red; background-color :white; font :bold; }
示列代码如下:
#include "widget.h" #include "ui_widget.h" Widget::Widget(QWidget *parent) : QWidget(parent), ui(new Ui::Widget) { ui->setupUi(this); //功能:改变控件的背景色 this->setStyleSheet("QLabel{color:rgb(0,255,255);" "background-color:red;" "}"); /* 功能:将控件背景换为图片 * "background-image:url(://res/1.jpg);"不可以伸缩, * * "border-image:url(://res/1.jpg);" 可以伸缩,更加的实用 * * "border-image:url(://res/1.jpg) 4 4 4 4 stretch stretch;"可以实现对图片的裁剪 */ ui->label_2->setStyleSheet("QLabel{color:rgb(0,255,255);" "background-color:blue;" // "background-image:url(://res/1.jpg);" // "border-image:url(://res/1.jpg);" "border-image:url(://res/1.jpg) 4 4 4 4 stretch stretch;" "}"); //处理 伪状态 /* 功能:当鼠标进入控件的区域内是改变背景图 * * 部件的外观可以按照用户界面元素状态的不同来分别定义,这在样式表中被称为“伪状态”。 * 例如:如果我们想在一个 push button在被按下的时候具有sunken的外观,我们可以指定一个叫做:pressed的伪状态。 * */ ui->pushButton->setStyleSheet("QPushButton{" "border: 2px outset green;" "border-image:url(://res/1.jpg);" "}" "QPushButton:hover{" "border-image:url(://res/2.png);" "}" ); } Widget::~Widget() { delete ui; }
类似"QPushButton:hover{" "border-image:url(://res/2.png);" "}"中的hover伪状态列表还有如下:
伪状态 描述
:checked button部件被选中
:disabled 部件被选中
:enable 部件被启用
:focus 部件获得焦点
:hover 鼠标位于部件上
:indeterminate checked或radiobutton被部分选中
:off 部件可以切换,且处于off状态
:on 部件可以切换,且处于on 状态
:pressed 部件被鼠标按下
:unchecked button部件未被选中
下面两张图是运行显示图:
图一鼠标没有位于button部件上,图二是鼠标位于button上
图一:
图二:
到此为止,QT的样式表的学习就先告一段落了。运行的结果也是可以的。
转载于:https://www.cnblogs.com/doker/p/11045429.html
相关资源:Qt样式表使用大全(中文整理资料)