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 = 0);

    ~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");