QComboBox drop-down list - set selected item style

Question

Is it possible to set selected item style (Qt style sheet) of the QComboBox drop-down list?

score 11 · Answer 1 · edited Jun 13 '18 at 13:52

The solution is to

create a ListView object
set its stylesheet
use it as the view of the ComboBox

Here is how:

    int main(int argc, char *argv[])
    {
    QApplication app(argc, argv);
    QMainWindow * mainWindow = new QMainWindow();
    QComboBox * combo = new QComboBox(mainWindow);
    QListView * listView = new QListView(combo);
    combo->addItem("foo");
    combo->addItem("bar");
    combo->addItem("foobar");
    combo->addItem("fooooo");

    listView->setStyleSheet("QListView::item {                              \
                             border-bottom: 5px solid white; margin:3px; }  \
                             QListView::item:selected {                     \
                             border-bottom: 5px solid black; margin:3px;    \
                             color: black;                                  \
                            }                                               \
                            ");
    combo->setView(listView);


    mainWindow->show();
    app.exec();

    return 0;
    }

Remark: I think, according to the Qt docs applying this style should also work...but it does not.

QComboBox QAbstractItemView::item {
    border-bottom: 5px solid white; margin:3px;
}
QComboBox QAbstractItemView::item:selected {
    border-bottom: 5px solid black; margin:3px;
}

Thanks! But one more question... How to get rid of thin selection frame? See example: http://vlasovsoft.net/images/1.png — Sergey Vlasov, Dec 10 '11 at 16:02
An event better solution is showed here http://stackoverflow.com/questions/13308341/qcombobox-abstractitemviewitem?rq=1 — bkausbk, Jan 18 '13 at 12:51

score 2 · Answer 2 · edited Jun 13 '18 at 14:28

If you mean you want the selected item to appear different when the combo box is showing its elements (i.e. in the "dropped down" state), you can change the colors for the Highlight and HighlightedText in the palette, or style the inner QAbstractItemView

#include <QtGui>

int main(int argc, char **argv) {
  QApplication app(argc, argv);

  QComboBox cb;
  cb.addItem("Item 1");
  cb.addItem("Item 2");
  cb.addItem("Item 3");
  cb.show();

  QPalette p = cb.palette();
  p.setColor(QPalette::HighlightedText, QColor(Qt::red));
  p.setColor(QPalette::Highlight, QColor(Qt::green));
  cb.setPalette(p);

  // OR ...
  // cb.setStyleSheet("QComboBox QAbstractItemView { "
  //                  "selection-background-color: green; "
  //                  "selection-color: red; }");

  return app.exec();
}

If you just mean the style of the element in its "collapsed" state, I'd take a look at the "Customizing QComboBox" section of the Qt Style Sheets reference for examples on what you are trying to do.

Thanks for answer! I'm just trying to change combobox drop-down item selection. I don't want to use the background color for selection. I want to use bottom border. I managed to do this with QMenu: QMenu::item { border-bottom: 5px solid white; margin:3px; } QMenu::item::selected { border-bottom: 5px solid black; margin:3px; } and want to do it with the combobox drop-down item... — Sergey Vlasov, Dec 07 '11 at 15:07

score 0 · Answer 3 · answered Aug 18 '18 at 18:41

@Sergey Vlasov: I don't know if there is a better solution to your problem but , but I managed to solve it with the following:

class MyDelegate : public QStyledItemDelegate
{
protected:
    void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const override
    {
        if (option.state & QStyle::State_HasFocus){
            QStyleOptionViewItem my_option = option;
            my_option.state = my_option.state ^ QStyle::State_HasFocus;
            QStyledItemDelegate::paint(painter, my_option, index);
            return;
        }
        QStyledItemDelegate::paint(painter, option, index);
    }
};

And then using your delegate in your combobox:

QStyledItemDelegate* itemDelegate = new MyDelegate();
    combobox->setItemDelegate(itemDelegate);

this eliminates nasty frame around selected item

QComboBox drop-down list - set selected item style

3 Answers3

Linked