Qt樣式表(QComboBox下拉框)


/* 未下拉時,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());   //下拉列表項高才能生效

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM