Qt QTableView 样式参考

QTableView样式分多个区域

整体样式

 1 QTableView {
 2     color: white;                                       /*表格内文字颜色*/
 3     gridline-color: black;                              /*表格内框颜色*/
 4     background-color: rgb(108, 108, 108);               /*表格内背景色*/
 5     alternate-background-color: rgb(64, 64, 64);
 6     selection-color: white;                             /*选中区域的文字颜色*/
 7     selection-background-color: rgb(77, 77, 77);        /*选中区域的背景色*/
 8     border: 2px groove gray;
 9     border-radius: 0px;
10     padding: 2px 4px;
11 }

奇偶行区分颜色样式

1 cpp:
2 view->setAlternatingRowColors(true);
3 
4 qss:
5 QTableView{
6     background-color: rgb(250, 250, 115);
7     alternate-background-color: rgb(141, 163, 215);
8 }

水平/垂直表头
设置表头样式

 1 QHeaderView {
 2     color: white;
 3     font: bold 10pt;
 4     background-color: rgb(108, 108, 108);/*设置表头空白区域背景色*/
 5     border: 0px solid rgb(144, 144, 144);
 6     border:0px solid rgb(191,191,191);
 7     border-left-color: rgba(255, 255, 255, 0);
 8     border-top-color: rgba(255, 255, 255, 0);
 9     border-radius:0px;
10     min-height:29px;
11 }

为垂直及水平表头分别设置样式
表头为QHeaderView，水平表头和垂直表头都是QHeaderView，需要设置QTableView两个表头的ObjectName进行区分

1 view->horizontalHeader()->setObjectName("hHeader");
2 view->verticalHeader()->setObjectName("vHeader");

样式中根据不同对象名称进行样式设置

 1 QHeaderView#hHeader::section {
 2     background-color:darkcyan;
 3     color: red;padding-left: 4px;
 4     border: 1px solid #6c6c6c;
 5     height:40;
 6 }
 7 QHeaderView#vHeader::section {
 8     background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1,stop:0 #616161, stop: 0.5 yellow,stop: 0.6 green, stop:1 cyan);
 9     color: white;padding-left: 4px;border: 1px solid #6c6c6c;
10     30;
11 }

左上角空白区域
设置完QTableView头部后，左上角区域为白色，需要为左上角区域设置样式

 1 /*QTableView 左上角样式*/
 2 QTableView QTableCornerButton::section {
 3    /*  background: red;
 4     border: 2px outset red;*/
 5     color: red;
 6     background-color: rgb(64, 64, 64);
 7     border: 5px solid #f6f7fa;
 8     border-radius:0px;
 9     border-color: rgb(64, 64, 64);
10  }

表头内容区域

1 QHeaderView::section {
2     color: white;
3     background-color: rgb(64, 64, 64);
4     border: 5px solid #f6f7fa;
5     border-radius:0px;
6     border-color: rgb(64, 64, 64);
7 }

全部样式代码：

 1 /*QTableView 左上角样式*/
 2 QTableView QTableCornerButton::section {
 3    /*  background: red;
 4     border: 2px outset red;*/
 5     color: red;
 6     background-color: rgb(64, 64, 64);
 7     border: 5px solid #f6f7fa;
 8     border-radius:0px;
 9     border-color: rgb(64, 64, 64);
10  }
11 
12  QTableView {
13     color: white;                                       /*表格内文字颜色*/
14     gridline-color: black;                              /*表格内框颜色*/
15     background-color: rgb(108, 108, 108);               /*表格内背景色*/
16     alternate-background-color: rgb(64, 64, 64);
17     selection-color: white;                             /*选中区域的文字颜色*/
18     selection-background-color: rgb(77, 77, 77);        /*选中区域的背景色*/
19     border: 2px groove gray;
20     border-radius: 0px;
21     padding: 2px 4px;
22 }
23 
24 QHeaderView {
25     color: white;
26     font: bold 10pt;
27     background-color: rgb(108, 108, 108);
28     border: 0px solid rgb(144, 144, 144);
29     border:0px solid rgb(191,191,191);
30     border-left-color: rgba(255, 255, 255, 0);
31     border-top-color: rgba(255, 255, 255, 0);
32     border-radius:0px;
33     min-height:29px;
34 }
35 
36 QHeaderView::section {
37     color: white;
38     background-color: rgb(64, 64, 64);
39     border: 5px solid #f6f7fa;
40     border-radius:0px;
41     border-color: rgb(64, 64, 64);
42 }