Qt样式表Qt StyleSheet(QSS)用法和例程

---

Qt样式表Qt StyleSheet(QSS)用法和例程

QT样式表setStyleSheet使用例程，包含13种不同的样式，实现简单换皮肤效果。

主要修改：
1.button/edit/label/widget等样式更改。
2.去除窗口标题，自绘标题栏并实现最小最大关闭功能。
3.支持手动修改颜色值，设置后查看效果。

补充说明：颜色风格和使用方法感谢网上的各路大神，我这边只是做了简单的整合和测试，代码小白级别，望见谅。

Demo链接(白嫖): https://download.csdn.net/download/long00000kid/15900563.

---

效果示例

自定义风格

淡蓝色风格

浅灰色风格

调用方式

示例如下：

	QString stylesheet = "QLineEdit,QTextEdit,QTableWidget{color:#DCDCDC;background: #444444;}";
	this->setStyleSheet(stylesheet);

部分代码

设置无边框和界面透明：

    this->setWindowFlags(Qt::FramelessWindowHint);   //设置无边框窗口//
//   this->setWindowFlags(Qt::CustomizeWindowHint);   //设置无标题窗口//
    this->setWindowOpacity(0.98);//设置程序界面透明//

样式风格：

void MainWindow::SelectStyle(int style)
{
    switch (style) {
    case 0://自定义风格//
        SetStyle(m_styleUser[0], m_styleUser[1], m_styleUser[2], m_styleUser[3], m_styleUser[4], m_styleUser[5], m_styleUser[6], m_styleUser[7]);
        break;
    case 1://银色风格//
        SetStyle("#000000", "#F5F5F5", "#B2B6B9", "#E1E4E6", "#CCD3D9", "#F2F3F4", "#E7E9EB", "#00BB9E");
        break;
    case 2://蓝色风格//
        SetStyle("#324C6C", "#CFDDEE", "#7F9AB8", "#C0D3EB", "#BCCFE7", "#D2E3F5", "#CADDF3", "#00BB9E");
        break;
    case 3://淡蓝色风格//
        SetStyle("#386487", "#EAF7FF", "#C0DCF2", "#DEF0FE", "#C0DEF6", "#F2F9FF", "#DAEFFF", "#00BB9E");
        break;
    case 4://深蓝色风格//
        SetStyle("#7AAFE3", "#0E1A32", "#132743", "#133050", "#133050", "#033967", "#033967", "#00BB9E");
        break;
    case 5://灰色风格//
        SetStyle("#000000", "#F0F0F0", "#A9A9A9", "#E4E4E4", "#A2A2A2", "#DBDBDB", "#C1C1C1", "#00BB9E");
        break;
    case 6://浅灰色风格//
        SetStyle("#6F6F6F", "#E6E6E6", "#D4D0C8", "#EEEEEE", "#E5E5E5", "#FCFCFC", "#F7F7F7", "#00BB9E");
        break;
    case 7://深灰色风格//
        SetStyle("#5D5C6C", "#EBECF0", "#A9ACB5", "#D8D9DE", "#C8C8D0", "#EFF0F4", "#DDE0E7", "#00BB9E");
        break;
    case 8://黑色风格//
        SetStyle("#F0F0F0", "#464646", "#353535", "#4D4D4D", "#292929", "#636363", "#575757", "#00BB9E");
        break;
    case 9://浅黑色风格//
        SetStyle("#E7ECF0", "#616F76", "#738393", "#667481", "#566373", "#778899", "#708090", "#00BB9E");
        break;
    case 10://深黑色风格//
        SetStyle("#D7E2E9", "#1F2026", "#111214", "#242629", "#141518", "#007DC4", "#0074BF", "#00BB9E");
        break;
    case 11://PS黑色风格//
        SetStyle("#DCDCDC", "#444444", "#242424", "#484848", "#383838", "#646464", "#525252", "#00BB9E");
        break;
    case 12://黑色扁平//
        SetStyle("#BEC0C2", "#2E2F30", "#67696B", "#404244", "#404244", "#262829", "#262829", "#00BB9E");
        break;
    case 13://白色扁平//
        SetStyle("#57595B", "#FFFFFF", "#B6B6B6", "#E4E4E4", "#E4E4E4", "#F6F6F6", "#F6F6F6", "#00BB9E");
        break;
    default:
        break;
    }
}

自定义风格：

	QString stylesheet =
		"QWidget{background:qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #585858, stop: 1.0 #484848);}"
		"QLineEdit,QTextEdit,QTableWidget{color:#DCDCDC;background: #444444;selection-color:black;selection-font:bold;selection-background-color:white;border-radiusx:2px}"
		//普通态//
		"QComboBox, QPushButton{color:#DCDCDC;background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, "
		"stop: 0 #484848, stop: 0.4 #424242,"
		"stop: 0.5#525252, stop: 1.0 #646464);border:2px groove gray;border-radius:6px;padding:2px 6px;}"
		//停留态//
		"QPushButton:hover{color:rgb(250,250,240);background-color:rgb(15,80,138);font:bold;}"
		"QLineEdit:hover{color:rgb(250,250,240);background-color:rgb(15,80,138);font:bold;}"
		"QTextEdit:hover{color:rgb(250,250,240);background-color:rgb(15,80,138);font:bold;}"
		//按下态//
		"QPushButton:pressed{background-color:rgb(13,69,119);padding-left:8px;padding-top:4px;}"
		"QLabel{color:#DCDCDC;}";
	this->setStyleSheet(stylesheet);

---

总结

用到的东东并不多，来来去去就几种，具体的解释和效果建议直接测试，或者找度娘，一查一个准。
如果想程序更加美观好看，找美工吧，贴图效果更好，如果没这个精力，现在这种方法比较简单快捷。