QComboBox自定义设置

样式示例：

QComboBox {     border: 1px solid gray;     border-radius: 3px;     padding: 1px 18px 1px 3px;     min-width: 6em; }   QComboBox:editable   {     background: white; }   QComboBox:!editable,   QComboBox::drop-down:editable {      background: qlineargradient(x1: 0, y1:   0, x2: 0, y2: 1,                                  stop: 0   #E1E1E1, stop: 0.4 #DDDDDD,                                  stop: 0.5   #D8D8D8, stop: 1.0 #D3D3D3); }   /* QComboBox gets   the "on" state when the popup is open */ QComboBox:!editable:on,   QComboBox::drop-down:editable:on {     background: qlineargradient(x1: 0, y1: 0,   x2: 0, y2: 1,                                 stop: 0   #D3D3D3, stop: 0.4 #D8D8D8,                                 stop: 0.5   #DDDDDD, stop: 1.0 #E1E1E1); }   QComboBox:on { /*   shift the text when the popup opens */     padding-top: 3px;     padding-left: 4px; }   QComboBox::drop-down   {     subcontrol-origin: padding;     subcontrol-position: top right;     width: 15px;       border-left-width: 1px;     border-left-color: darkgray;     border-left-style: solid; /* just a   single line */     border-top-right-radius: 3px; /* same   radius as the QComboBox */     border-bottom-right-radius: 3px; }   QComboBox::down-arrow   {     image:   url(/usr/share/icons/crystalsvg/16x16/actions/1downarrow.png); }   QComboBox::down-arrow:on   { /* shift the arrow when popup is open */     top: 1px;     left: 1px; }   //点击之后的样式 QComboBox::drop-down:checked{}   

//设置下拉列表框样式

方法一

//QComboBox下拉列表不支持直接定义样式，需要在源代码中使用到样式委托对象QStyledItemDelegate //用于下拉框item的样式美化 QStyledItemDelegate*   itemDelegate = new QStyledItemDelegate(); ui.comboBox1->setItemDelegate(itemDelegate); //然后再在qss脚本中定义QAbstractItemView相关样式，以下是简易示例： QComboBox   QAbstractItemView {      border: 1px solid rgb(161,161,161); }   QComboBox   QAbstractItemView::item {     height: 24px; }   QComboBox   QAbstractItemView::item:selected {             background-color: rgba(54, 98, 180); }   

方法二

//，当需要更加丰富的显示的时候，例如图片加文字等等，可以选择QListWidget；但是需要添加代理，才可以把数据写到combobox上。【使用listview时候，不需要代理】     //事例代码 m_listWidget = new QListWidget(this); // 设置子项目代理，否则下拉框选项周围会出现虚线框 m_listWidget->setItemDelegate(new NoFocusFrameDelegate(this)); ui.comboBox->setEditable(true); ui.comboBox->setModel(m_listWidget->model()); ui.comboBox->setView(m_listWidget);   // 在下拉框中添加5个选项 for (int i = 0; i < 5; ++i) { ComboboxItem* item = new ComboboxItem(this);//自定义的widget 类 item->setLabelContent(QString("Account") + QString::number(i, 10)); connect(item, SIGNAL(chooseAccount(const QString&)), this, SLOT(onChooseAccount(const QString&)));//不使用代理时候，可以使用槽函数来实现选择某一项。 QListWidgetItem* widgetItem = new QListWidgetItem(m_listWidget); m_listWidget->setItemWidget(widgetItem, item); } 

方法三：使用listview

QComboBox *combox= new QComboBox(); cbb->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding); combox->setView(new QListView()); int count = combox->count(); for(int i=0; i 
  
    ( combox->view()->model() )->item( i )->setTextAlignment( Qt::AlignCenter ); } //qss QComboBox QAbstractItemView{   outline: 0px; font: 11pt "PingFang SC Medium"; background-color: rgb(255, 255, 255); }   QComboBox QAbstractItemView::item{   margin-left:10px;  margin-right: 10px;  margin-top: 5px; margin-bottom: 5px; height: 52px; border-radius: 5px; border: 1px outset rgb(212,212,212); border: 1px solid rgb(212,212,212); background-color: qlineargradient(spread:pad, x1:0, y1:1, x2:0, y2:0.320, stop:0 rgba(234, 234, 234, 255), stop:1 rgba(255, 255, 255, 255)); }   QComboBox QAbstractItemView::item:selected{ margin-left: 10px;  margin-right: 10px;    margin-top: 5px;  margin-bottom: 5px; height: 52px; border-radius: 5px; color: rgb(255, 255, 255); border: 1px outset rgb(30,139,195); border: 1px solid rgb(96,173,215); background-color: rgb(72,186,248); } 
  

3D效果

/* QComboBox gets   the "on" state when the popup is open */  QComboBox:!editable:on,   QComboBox::drop-down:editable:on {      background: qlineargradient(x1: 0, y1:   0, x2: 0, y2: 1,                                  stop: 0   #D3D3D3, stop: 0.4 #D8D8D8,                                  stop: 0.5   #DDDDDD, stop: 1.0 #E1E1E1);  }  QComboBox:on { /* shift the text when the   popup opens */      padding-top: 3px;      padding-left: 4px;  } QComboBox::down-arrow:on   { /* shift the arrow when popup is open */      top: 1px;      left: 1px;  } 

点击的时候，不是下拉而是弹窗的实现：使用事件过滤器

QComboBox *cbb = new QComboBox(); cbb->installEventFilter(this);   //需要注册的控件才会触发该事件 bool SampleProOptionDlg::eventFilter(QObject *obj, QEvent *ev) {     if(ev->type() == QEvent::MouseButtonPress){         QComboBox *cbb = qobject_cast 
  
    (obj);         if(nullptr != cbb){             slotTestType(cbb);             return true;//关键         }       }     return QDialog::eventFilter(obj, ev); } 
  

使用技巧

• 自动补全
• 使用QLineEdit配合使用

ui->comboBox->setLineEdit(ui->lineEdit); QCompleter *completer = new QCompleter(users, this); ui->lineEdit->setCompleter(completer); 

Widget::Widget(QWidget *parent)     : QWidget(parent) {     word_list<<"Java"<<"C++"<<"C#"<<"PHP"<<"Perl"<<"Python"<<"Delphi"<<"Ruby";     search_line_edit = new QLineEdit(this);     completer = new QCompleter(this);     string_list_model = new QStringListModel(word_list, this);     completer->setCaseSensitivity(Qt::CaseInsensitive);     completer->setModel(string_list_model);     search_line_edit->setCompleter(completer);     connect(search_line_edit, SIGNAL(editingFinished()), this, SLOT(editComplete())); }   void Widget::editComplete() {     QString text = search_line_edit->text();     if(QString::compare(text, QString("")) != 0) {         bool is_contains = word_list.contains(text, Qt::CaseInsensitive);         if(!is_contains) {            word_list< 
  
    setStringList(word_list);            //completer->setModel(new QStringListModel(wordList, this));         }     } } 
  

每次编译完成后按回车键，会将不存在列表中的文本加入到改列表中。Qt::CaseSensitivity取值，Qt::CaseInsensitive：大小写不敏感；Qt::CaseSensitive：大小写敏感。默认为：Qt::CaseSensitive。

• 补全路径

{        QDirModel *model = new QDirModel(this);     search_line_edit = new QLineEdit(this);     completer = new QCompleter(this);     completer->setModel(model);     search_line_edit->setCompleter(completer); } 

组合框QComboBox的定制

https://www.cnblogs.com/csuftzzk/p/qss_combobox.html

http://blog.sina.com.cn/s/blog_a6fb6cc90101en3a.html

http://blog.sina.com.cn/s/blog_a6fb6cc90101ed6n.html

/*普通常用*/ QComboBox QAbstractItemView {      border: 1px solid #d2d2d2;     outline: 0px;     font: 13pt "思源黑体 CN Medium";     background-color: rgb(255, 255, 255);     border-top: 1px solid rgb(62, 179, 233); }      QComboBox QAbstractItemView::item {       margin-left:10px;      margin-right: 10px;      margin-top: 5px;     margin-bottom: 5px;     height: 52px;     border-radius: 5px;     border: 1px outset rgb(212,212,212);     border: 1px solid rgb(212,212,212);     background-color: qlineargradient(spread:pad, x1:0, y1:1, x2:0, y2:0.320, stop:0 rgba(234, 234, 234, 255), stop:1 rgba(255, 255, 255, 255)); }      QComboBox QAbstractItemView::item:selected {     margin-left: 10px;      margin-right: 10px;        margin-top: 5px;      margin-bottom: 5px;     height: 52px;     border-radius: 5px;     color: rgb(255, 255, 255);     border: 1px outset rgb(30,139,195);     border: 1px solid rgb(96,173,215);     background-color: rgb(30,139,195); } QComboBox {     height:41px;     color: #;     padding-left:5px;     font: 13pt "思源黑体 CN Medium";     border-radius: 2px;     border: 1px solid rgb(195, 195, 195); } QComboBox:checked {     border: 1px solid rgb(62, 179, 233); } QComboBox::drop-down {     width:39px;     height:41px;     background-image: url(:/Style/img/QComboBox/comBox_uncheck(39x41).png); } QComboBox::drop-down:checked {     background-image: url(:/Style/img/QComboBox/comBox_check(39x41).png); } QComboBox:disabled {     height:41px;     color: #;     font: 13pt "思源黑体 CN Medium";     border-radius: 2px;     background-color: rgb(238, 238, 238);     border: 1px solid rgb(195, 195, 195); } QComboBox::drop-down:disabled {     width:39px;     height:41px;     background-image: url(:/Style/img/QComboBox/comBox_gray(39x41).png); }