/* 未下拉時,QComboBox的樣式 */ QComboBox { border: 1px solid gray; /* 邊框 */ border-radius: 3px; /* 圓角 */ padding: 1px 18px 1px 3px; /* 字體填襯 */ color: #000; font: normal normal 15px "Microsoft YaHei"; background: transparent; } /* 下拉后,整個下拉窗體樣式 */ QComboBox QAbstractItemView { outline: 0px solid gray; /* 選定項的虛框 */ border: 1px solid yellow; /* 整個下拉窗體的邊框 */ color: green; background-color: red; /* 整個下拉窗體的背景色 */ selection-background-color: lightgreen; /* 整個下拉窗體被選中項的背景色 */ } /* 下拉后,整個下拉窗體每項的樣式 */ QComboBox QAbstractItemView::item { height: 50px; /* 項的高度(設置pComboBox->setView(new QListView());后,該項才起作用) */ } /* 下拉后,整個下拉窗體越過每項的樣式 */ QComboBox QAbstractItemView::item:hover { color: #FFFFFF; background-color: lightgreen; /* 整個下拉窗體越過每項的背景色 */ } /* 下拉后,整個下拉窗體被選擇的每項的樣式 */ QComboBox QAbstractItemView::item:selected { color: #FFFFFF; background-color: lightgreen; } /* QComboBox中的垂直滾動條 */ QComboBox QAbstractScrollArea QScrollBar:vertical { width: 10px; background-color: #d0d2d4; /* 空白區域的背景色*/ } QComboBox QAbstractScrollArea QScrollBar::handle:vertical { border-radius: 5px; /* 圓角 */ background: rgb(160,160,160); /* 小方塊的背景色深灰lightblue */ } QComboBox QAbstractScrollArea QScrollBar::handle:vertical:hover { background: rgb(90, 91, 93); /* 越過小方塊的背景色yellow */ } /* 設置為可編輯(setEditable(true))editable時,編輯區域的樣式 */ QComboBox:editable { background: green; } /* 設置為非編輯(setEditable(false))!editable時,整個QComboBox的樣式 */ QComboBox:!editable { background: blue; } /* 設置為可編輯editable時,點擊整個QComboBox的樣式 */ QComboBox:editable:on { background: green; } /* 設置為非編輯!editable時,點擊整個QComboBox的樣式 */ QComboBox:!editable:on { background: blue; } /* 設置為可編輯editable時,下拉框的樣式 */ QComboBox::drop-down:editable { background: lightblue; } /* 設置為可編輯editable時,點擊下拉框的樣式 */ QComboBox::drop-down:editable:on { background: lightgreen; } /* 設置為非編輯!editable時,下拉框的樣式 */ QComboBox::drop-down:!editable { background: lightblue; } /* 設置為非編輯!editable時,點擊下拉框的樣式 */ QComboBox::drop-down:!editable:on { background: lightgreen; } /* 點擊QComboBox */ QComboBox:on { } /* 下拉框樣式 */ QComboBox::drop-down { subcontrol-origin: padding; /* 子控件在父元素中的原點矩形。如果未指定此屬性,則默認為padding。 */ subcontrol-position: top right; /* 下拉框的位置(右上) */ width: 15px; /* 下拉框的寬度 */ border-left-width: 1px; /* 下拉框的左邊界線寬度 */ border-left-color: darkgray; /* 下拉框的左邊界線顏色 */ border-left-style: solid; /* 下拉框的左邊界線為實線 */ border-top-right-radius: 3px; /* 下拉框的右上邊界線的圓角半徑(應和整個QComboBox右上邊界線的圓角半徑一致) */ border-bottom-right-radius: 3px; /* 同上 */ }
/* 越過下拉框樣式 */
QComboBox::drop-down:hover {
background: yellow;
}
/* 下拉箭頭樣式 */
QComboBox::down-arrow {
width: 15px; /* 下拉箭頭的寬度(建議與下拉框drop-down的寬度一致) */
background: transparent; /* 下拉箭頭的的背景色 */
padding: 0px 0px 0px 0px; /* 上內邊距、右內邊距、下內邊距、左內邊距 */
image: url(:/images/combobox_arrow_down.png);
}
/* 點擊下拉箭頭 */
QComboBox::down-arrow:on {
image: url(:/images/combobox_arrow_up.png); /* 顯示下拉箭頭 */
}
注意:
QComboBox* pComboBox = new QComboBox(this);
pComboBox->setView(new QListView()); //下拉列表項高才能生效