前言

使用QT中的QSS是一种美化可视控件非常高效的方式，QSS可以十分轻松地构建出优美的界面。

有时候我们想使用QSS来将QMainWindows界面设置为四角为圆角，但却发现无法设置，或底部背景仍是直角。

表现

我们想设置QMainWindow圆角，通常会习惯这样写qss：

1
2
3
4
5
6
QMainWindow{
    /* 设置圆角 */
    border-radius: 15px; 
    /* 设置背景颜色 */
    background-color: rgb(67, 94, 134);
}

结果

可以看到设置的背景颜色生效了但是圆角没有生效，继续尝试发现改成使用QWidget也不行

查找各种资料之后发现QMainWindow是不支持qss的radius属性的，因为他们没有了frame层。

那么我们要如何实现圆角效果呢，我们可以换个思路

观察到QMainWindow下还涵盖了centralwidget控件，它实际上是QWidget类的

我们可以设置centralwidget的qss效果，并将QMainWindow背景隐藏
如下：
在QSS中设置

1
2
3
4
QWidget#centralwidget{
    background-color: rgb(67, 94, 134);
    border-radius: 15px;
}

然后设置QMainWindow背景隐藏，这里顺便设置隐藏标题栏

1
2
this->setWindowFlags(Qt::FramelessWindowHint | Qt::WindowMinimizeButtonHint);
this->setAttribute(Qt::WA_TranslucentBackground);

大功告成，效果如下

这样就实现了我们想要的圆角效果，

另外如果没有centralwidget我们可以给QMainWindow手动添加一个QFrame，并使其填满整个窗口，再把所有控件都扔进这个QFrame，像上面QWidget#centralwidget一样设置QFrame的qss样式即可。