QTableView 樣式參考
阿新 • • 發佈:2019-01-30
先看效果
QTableView樣式分多個區域
- 整體樣式
QTableView {
color: white; /*表格內文字顏色*/
gridline-color: black; /*表格內框顏色*/
background-color: rgb(108, 108, 108); /*表格內背景色*/
alternate-background-color: rgb(64, 64, 64);
selection-color : white; /*選中區域的文字顏色*/
selection-background-color: rgb(77, 77, 77); /*選中區域的背景色*/
border: 2px groove gray;
border-radius: 0px;
padding: 2px 4px;
}
奇偶行區分顏色樣式
cpp:
view->setAlternatingRowColors(true);
qss:
QTableView{
background-color: rgb(250, 250 , 115);
alternate-background-color: rgb(141, 163, 215);
}
- 水平/垂直表頭
設定表頭樣式
QHeaderView {
color: white;
font: bold 10pt;
background-color: rgb(108, 108, 108);/*設定表頭空白區域背景色*/
border: 0px solid rgb(144, 144, 144);
border:0px solid rgb(191,191,191);
border-left-color: rgba(255, 255 , 255, 0);
border-top-color: rgba(255, 255, 255, 0);
border-radius:0px;
min-height:29px;
}
為垂直及水平表頭分別設定樣式
表頭為QHeaderView,水平表頭和垂直表頭都是QHeaderView,需要設定QTableView兩個表頭的ObjectName進行區分
view->horizontalHeader()->setObjectName("hHeader");
view->verticalHeader()->setObjectName("vHeader");
樣式中根據不同物件名稱進行樣式設定
QHeaderView#hHeader::section {
background-color:darkcyan;
color: red;padding-left: 4px;
border: 1px solid #6c6c6c;
height:40;
}
QHeaderView#vHeader::section {
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);
color: white;padding-left: 4px;border: 1px solid #6c6c6c;
width:30;
}
- 左上角空白區域
設定完QTableView頭部後,左上角區域為白色,需要為左上角區域設定樣式
/*QTableView 左上角樣式*/
QTableView QTableCornerButton::section {
/* background: red;
border: 2px outset red;*/
color: red;
background-color: rgb(64, 64, 64);
border: 5px solid #f6f7fa;
border-radius:0px;
border-color: rgb(64, 64, 64);
}
- 表頭內容區域
QHeaderView::section {
color: white;
background-color: rgb(64, 64, 64);
border: 5px solid #f6f7fa;
border-radius:0px;
border-color: rgb(64, 64, 64);
}
全部樣式程式碼:
/*QTableView 左上角樣式*/
QTableView QTableCornerButton::section {
/* background: red;
border: 2px outset red;*/
color: red;
background-color: rgb(64, 64, 64);
border: 5px solid #f6f7fa;
border-radius:0px;
border-color: rgb(64, 64, 64);
}
QTableView {
color: white; /*表格內文字顏色*/
gridline-color: black; /*表格內框顏色*/
background-color: rgb(108, 108, 108); /*表格內背景色*/
alternate-background-color: rgb(64, 64, 64);
selection-color: white; /*選中區域的文字顏色*/
selection-background-color: rgb(77, 77, 77); /*選中區域的背景色*/
border: 2px groove gray;
border-radius: 0px;
padding: 2px 4px;
}
QHeaderView {
color: white;
font: bold 10pt;
background-color: rgb(108, 108, 108);
border: 0px solid rgb(144, 144, 144);
border:0px solid rgb(191,191,191);
border-left-color: rgba(255, 255, 255, 0);
border-top-color: rgba(255, 255, 255, 0);
border-radius:0px;
min-height:29px;
}
QHeaderView::section {
color: white;
background-color: rgb(64, 64, 64);
border: 5px solid #f6f7fa;
border-radius:0px;
border-color: rgb(64, 64, 64);
}