一、圆角渐变按钮美化
结合圆角、渐变、悬浮、按压状态,实现现代风格按钮:
qss
/* 圆角渐变按钮 */ QPushButton { background: qlineargradient(x1:0,y1:0,x2:0,y2:1, stop:0 #74b9ff, stop:1 #0984e3); color: #ffffff; border: none; border-radius: 6px; font-size: 13px; min-height: 30px; } QPushButton:hover { background: qlineargradient(x1:0,y1:0,x2:0,y2:1, stop:0 #a2d2ff, stop:1 #006ccb); } QPushButton:pressed { background: #0769b8; }二、进度条 QProgressBar 美化
修改轨道、填充色、圆角,去除默认样式:
qss
QProgressBar { border-radius: 4px; background-color: #eeeeee; text-align: center; } QProgressBar::chunk { background-color: #00b894; border-radius: 4px; }三、全局暗黑风格主题(整套通用)
适用于窗口、标签、输入框、按钮全套暗黑配色,直接给主窗口设置即可全局生效:
qss
/* 主窗口背景 */ QWidget { background-color: #2b2b2b; color: #e0e0e0; font-size: 12px; } /* 标签 */ QLabel { color: #cccccc; } /* 单行输入框 */ QLineEdit { background-color: #3c3f41; border: 1px solid #555555; border-radius: 3px; padding: 4px; } QLineEdit:focus { border-color: #0099ff; } /* 普通按钮(暗黑版) */ QPushButton { background-color: #4a4a4a; border: none; border-radius: 4px; color: #f0f0f0; min-height: 28px; } QPushButton:hover { background-color: #5c5c5c; } QPushButton:pressed { background-color: #383838; }四、代码加载外部 QSS 文件(项目标准用法)
cpp
运行
// 加载qss文件实现换肤 QFile file(":/style/dark.qss"); if(file.open(QFile::ReadOnly)) { QString style = QLatin1String(file.readAll()); this->setStyleSheet(style); file.close(); }小结
复杂界面推荐拆分多个 QSS 文件分类管理;进度条、滑块等控件需要使用子控件伪元素::chunk单独修饰。