Qt Style Sheets

Qt - 通用实时样式Qss刷新 - 知乎 (zhihu.com)

上面的文章提到的实时刷新很好用！

推荐给大家！

---

下面是Qt官方文档中Qt Style Sheets的一部分翻译。

因为我最近感觉自己在这方面还需要再补补课，就再研究研究。

---

 使用样式层叠表定制Qt Widgets

当使用样式层叠表时，每个widget被看成一个带有4个同中心(类似坐标的原点)的矩形的盒子：

margin 矩形 （页边空白）

border 矩形   (边框）

padding 矩形 （内边距）

content 矩形  （内容）

盒子模型更详细地描述了上面的内容。

---

盒子模型

这4个同中心的矩形从概念上呈现如下：

margin落在border的外边

border在margin和padding之间被绘制

padding落在border内部，在border和实际的contents之间

content就是我们移出(去掉)margin，border和padding后，原始widget或子控件(subcontrol)所剩下的内容。

margin，border-width和padding属性都默认是0。因此，默认情况下，4个矩形（margin，border，padding，content）恰好重叠。

 margin，border-width和padding三者是在一个层次的（你可以看到，它们的定义都差不多），都表示长度(length)。

margin和padding都是无法被看见的（就是没有颜色） 

border不一样，可以通过指定border的width,style,color来可视化。

---

你可以使用background-image属性为widget指定一个background。

效果图：

我在工作中还没怎么用到过background-image,用border-image比较多。 

---

 默认地，background-image只在border内部被绘制。

这可以通过background-clip属性被改变。

你可以使用background-repeat和background-origin来控制background-image的重复和原点。

---

background-image不会随着widget的大小改变而改变。为了提供一个皮肤或随着widget大小改变而改变的background，必须使用border-image。

因为border-image属性提供了一个供选择的background，不需要指定background-image当border-image被指定时。在特定情况下，当它们都被指定时，border-image被画在background-image上面。

---

此外，image属性可能被使用来绘制图片在border-image更上面一层。

当image的大小与widget的大小不匹配时，被指定的image不会平铺和伸展，它的对齐使用image-position属性来指定。不同于background-image和border-image，我们可以指定一个svg在image属性中，在这种情况下image会随着widget大小自动调整大小。

---

渲染规则的步骤如下：

为整个渲染操作设置剪辑（border-radius）

绘制background(background-image)

绘制border(border-image, border)

绘制最上层的image(image)

---

子控件

一个widget被视为子控件的一个层次结构（tree）。（不太好理解）

例如：QComboBox绘制drop-down 子控件，然后绘制down-arrow子控件。

QComboBox区域包含drop-down区域

drop-down区域包含drop-arraw区域

因此，一个QComboBox按如下顺序被渲染：

Render the QComboBox { } rule
Render the QComboBox::drop-down { } rule
Render the QComboBox::down-arrow { } rule

 Sub-controls共享一个parent-child关系，在QComboBox这个例子中，down-arrow的父亲是drop-down，drop-down的父亲是widget本身。

子控件被放置在它们的父亲窗体内，利用subcontrol-position和subcontrol-origin属性。

一旦被放置，子控件可以使用box model来设计。

---

注意：对于复杂的widgets，比如QComboBox和QScrollBar，如果一个属性或子控件被订制，所有其他属性或子控件也都必须被订制。