QT定制有标题的扁平化下拉框控件

关键字：QT，QComboBox，QLineEdit，QListView，QPushButton，QMenu，QWidgetAction，setStyleSheet

OS：Windows 7

方法一：QComboBox+QLineEdit+QListView

相关问题链接：QComboBox: Can we make the entire combobox clickable, not just the dropdown button (arrow) itself?

为了使整个combobox都是可点击的，所以加个QTComboBoxButton类继承QLineEdit，在mousePressEvent里面showPopup。

class QTComboBoxButton : public QLineEdit
{
    Q_OBJECT
public:
    QTComboBoxButton(QWidget *parent = );
    ~QTComboBoxButton();

protected:
    void mousePressEvent(QMouseEvent *);
};

QTComboBoxButton::QTComboBoxButton(QWidget *parent /* = 0 */) :
    QLineEdit(parent)
{
}

QTComboBoxButton::~QTComboBoxButton()
{
}

void QTComboBoxButton::mousePressEvent(QMouseEvent * e)
{
    QComboBox* combo = dynamic_cast<QComboBox*>(parent());
    if(combo)
        combo->showPopup();
}

QComboBox+QLineEdit+QListView的使用如下：

QComboBox* myCombo = new QComboBox;
    myCombo->setView(new QListView());
    myCombo->setEditable(true);
    myCombo->setLineEdit(new QTComboBoxButton(m_pAnswer));
    myCombo->lineEdit()->setReadOnly(true);
    myCombo->addItem("Option1");
    myCombo->addItem("Option2");
    myCombo->addItem("Option3");
    myCombo->setMaxVisibleItems(myCombo->count());
    myCombo->lineEdit()->setText("Please select");
    QString arrowImagePath = "c:\arrow.png";
    myCombo->setStyleSheet("QComboBox {font-family: \"Arial\"; font-size: 13px; padding: 3px 0x 3px 5px;}"
        "QComboBox::drop-down {subcontrol-origin: padding; subcontrol-position: top right; width: 30 px; border: 0px;}"
        "QComboBox::down-arrow {image: url("+ arrowImagePath +");}");
    myCombo->view()->setStyleSheet("QListView {font-family: \"Arial\"; font-size: 13px; outline: 0px;}"
        "QListView::item {padding: 3px 0x 3px 5px; border-width: 0px;}"
        "QListView::item:selected {background-color: rgb(74, 144, 226);}");

UI效果如下图：

方法二：QPushButton+QMenu+QWidgetAction

相关问题链接：QMenu: How to customize the menu items of QMenu

定制类QTDropDownButton

class QTDropDownButton : public QPushButton
{
    Q_OBJECT
public:
    QTDropDownButton(QString text, QWidget *parent = nullptr);

    void addItem(QString text);

protected slots:
    void menuAboutToShow();
    void menuTriggered(QAction *action);

private:
    QMenu* menu_;
};

QTDropDownButton::QTDropDownButton(QString text, QWidget *parent) :
    QPushButton(text, parent)
{
    setFlat(true);
    menu_ = new QMenu();
    setMenu(menu_);

    connect(menu_, SIGNAL(aboutToShow()), this, SLOT(menuAboutToShow()));
    connect(menu_, SIGNAL(triggered(QAction*)), this, SLOT(menuTriggered(QAction*)));

    setStyleSheet("QPushButton {text-align: left; font-family: Arial; font-size: 13pt; color: #808080; border: 1px solid gray; padding: 5px;}"
        "QPushButton::menu-indicator {subcontrol-origin: padding; subcontrol-position: right center; right:5px;}");
    menu_->setStyleSheet("QLabel {font-family: Arial; font-size: 13pt; padding: 5px 0 5px 0; background-color: transparent;}"
        "QLabel:hover {background-color: rgb(51, 153, 255);}");
}

void QTDropDownButton::addItem(QString text)
{
    if(!menu_)
        return;

    QWidgetAction* wa1 = new QWidgetAction(menu_);
    QLabel* l1 = new QLabel(text);
    wa1->setDefaultWidget(l1);
    menu_->addAction(wa1);
}

void QTDropDownButton::menuAboutToShow()
{
    if(menu_)
    {
        menu_->setFixedWidth(this->width());
    }
}

void QTDropDownButton::menuTriggered(QAction *action)
{
    if(!action)
        return;

    QWidgetAction* qwa = dynamic_cast<QWidgetAction*>(action);
    if(!qwa)
        return;

    QLabel* ql = dynamic_cast<QLabel*>(qwa->defaultWidget());
    if(!ql)
        return;

    setText(ql->text());
}

使用QTDropDownButton

QTDropDownButton* ddb = new QTDropDownButton("Please select");
ddb->addItem("Option1");
ddb->addItem("Option2");