【QT学习十二】QComboBox

目录

一、QComboBox 的基本概述

二、基本用法

1. 创建 QComboBox 对象

2. 添加选项

3. 可编辑的 QComboBox

4. 设置默认选中项

5. 获取当前选中项信息

6. 清空和移除选项

7、其它用法

三、QComboBox中的信号

四、QComboBox筛选和约束

五、QComboBox 式样

---

一、QComboBox 的基本概述

        QComboBox 是 Qt 中用于实现下拉框的强大工具，它提供了一种简便的方式来选择单个值或从一组选项中进行选择。

        QComboBox提供了一种以占用最小屏幕空间的方式向用户呈现选项列表的方法。ComboBox是一种选择小部件，显示当前项目，并可以弹出可选择项目的列表。

        QComboBox 是基于 Qt 框架的 QWidget 类的子类。它实现了一个下拉框，其中包含一个可供用户选择的列表。其原理主要基于使用了下拉列表（QListView）和按钮（QAbstractButton）。

二、基本用法

        QComboBox 是 Qt 中用于实现下拉框（组合框）的小部件，提供了一种方便的方式向用户呈现选项列表。以下是 QComboBox 的基本用法：

1. 创建 QComboBox 对象

        在你的 Qt 应用程序中，首先需要创建一个 QComboBox 对象。可以将其放置在主窗口或其他需要的地方。

#include 



// ...



QComboBox *comboBox = new QComboBox(parentWidget);

当然也可以通过拖拽创建，控件位置如下图：

2. 添加选项

        向 QComboBox 中添加选项，可以使用 `addItem` 函数。这些选项可以是字符串、图标，或者两者的组合。

comboBox->addItem("Option 1");

comboBox->addItem("Option 2");

comboBox->addItem(QIcon(":/icons/icon.png"), "Option 3 with Icon");

3. 可编辑的 QComboBox

        如果需要允许用户手动输入内容，使 QComboBox 可编辑，可以使用 `setEditable` 函数：

comboBox->setEditable(true);

        ComboBox可以是可编辑的，允许用户修改列表中的每个项目。ComboBox可以包含像素图像以及字符串；insertItem()和setItemText()函数已适当重载。对于可编辑的ComboBox，提供了clearEditText()函数，以清除显示的字符串而不更改ComboBox的内容。

4. 设置默认选中项

        如果希望在创建时就设置默认选中的项，可以使用 `setCurrentIndex` 函数：

comboBox->setCurrentIndex(1); // 设置默认选中第二个项

5. 获取当前选中项信息

        可以使用以下函数获取有关当前选中项的信息：

- `currentText()`: 获取当前选中项的文本。

- `currentIndex()`: 获取当前选中项的索引。

6. 清空和移除选项

        如果需要清空或移除选项，可以使用 `clear` 和 `removeItem` 函数：

comboBox->clear(); // 清空所有选项



// 或者移除指定索引的选项

comboBox->removeItem(1); // 移除第二个选项

7、其它用法

        QComboBox除了显示可见下拉列表外，每个item(列表项)还可以关联一个QVariant类型的变量，用于存储一些不可见数据。这对于在用户选择某个选项时需要关联一些附加信息或数据的情况非常有用。下面是一个简单的例子，演示了如何将 QVariant 类型的数据与 QComboBox 中的每个项关联起来。

class YourClass : public QObject {

    Q_OBJECT



public:

    YourClass(QWidget *parent = nullptr) : QObject(parent) {

        // 创建 QComboBox 对象

        QComboBox *comboBox = new QComboBox(parent);



        // 添加选项，并关联 QVariant 数据

        int option1Data = 42;

        comboBox->addItem("Option 1", QVariant(option1Data));



        QString option2Data = "Additional Info";

        comboBox->addItem("Option 2", QVariant(option2Data));



        // 连接选择变化的信号与槽

        connect(comboBox, SIGNAL(currentIndexChanged(int)), this, SLOT(onComboBoxIndexChanged(int)));

    }



private slots:

    // 处理选择变化的槽函数

    void onComboBoxIndexChanged(int index) {

        QComboBox *comboBox = qobject_cast(sender());

        if (comboBox) {

            // 获取当前选中项的文本和关联的 QVariant 数据

            QString selectedText = comboBox->currentText();

            QVariant selectedData = comboBox->itemData(index);



            // 根据数据类型处理

            if (selectedData.type() == QVariant::Int) {

                int intValue = selectedData.toInt();

                qDebug() << "Selected Text:" << selectedText << "Selected Data (int):" << intValue;

            } else if (selectedData.type() == QVariant::String) {

                QString stringValue = selectedData.toString();

                qDebug() << "Selected Text:" << selectedText << "Selected Data (string):" << stringValue;

            }

        }

    }

};

        ComboBox可以使用insert函数填充，例如insertItem()和insertItems()。可以使用setItemText()更改项目。可以使用removeItem()删除项目，使用clear()删除所有项目。

三、QComboBox中的信号

    当ComboBox的当前项目发生变化时，会发出三个信号：currentIndexChanged()、currentTextChanged()和activated()。

       无论更改是通过编程还是通过用户交互完成，currentIndexChanged()和currentTextChanged()始终会被发出，而activated()仅在由用户交互引起更改时发出。

        当用户在ComboBox弹出列表中突出显示项目时，将发出highlighted()信号。这三个信号都有两个版本，一个带有QString参数，另一个带有int参数。        

        如果用户选择或突出显示像素图像，则仅发出int信号。每当可编辑的ComboBox的文本更改时，都会发出editTextChanged()信号。

实例：

        当用户选择不同的选项时，你可能希望执行一些操作。为此，你可以连接 QComboBox 的 `currentIndexChanged` 信号到一个槽函数。

connect(comboBox, SIGNAL(currentIndexChanged(int)), this, SLOT(onComboBoxIndexChanged(int)));

然后在你的类中实现槽函数：

void YourClass::onComboBoxIndexChanged(int index) {

    // 处理选择变化，index 是当前选中项的索引

    // 也可以使用 currentText() 获取当前选中项的文本

    QString selectedText = comboBox->currentText();

}

四、QComboBox筛选和约束

        对于可编辑的QComboBox，可通过设置QCompleter达到下拉列表筛选显示的效果。

实例：

#include 

#include 

#include 

#include 

#include 



int main(int argc, char *argv[]) {

    QApplication app(argc, argv);


    // 创建主窗口

    QWidget mainWindow;

    mainWindow.setWindowTitle("QComboBox 自动完成示例");


    // 创建 QComboBox

    QComboBox comboBox(&mainWindow);

    comboBox.setEditable(true); // 允许编辑


    // 添加一些选项

    comboBox.addItem("Apple");

    comboBox.addItem("Banana");

    comboBox.addItem("Cherry");


    // 创建 QCompleter 并设置到 QComboBox

    QCompleter completer(QStringList() << "Apple" << "Banana" << "Cherry", &comboBox);

    comboBox.setCompleter(&completer);


    // 连接信号与槽以捕获选择变化

    QObject::connect(&comboBox, QOverload::of(&QComboBox::currentIndexChanged),

                     [](const QString &text) {

                         qDebug() << "当前选择：" << text;

                     });



    // 设置布局

    QVBoxLayout layout(&mainWindow);

    layout.addWidget(&comboBox);


    // 显示主窗口

    mainWindow.show();

    return app.exec();

}

        可以使用QValidator对可编辑的ComboBox的输入进行约束。

例如：只能输入1到64之间的整数

class IntegerValidator : public QValidator {

public:

    State validate(QString &input, int &pos) const override {

        Q_UNUSED(pos);

        if(input.isEmpty())

        {

            return QValidator::Acceptable;

        }

        bool isInt;

        int value = input.toInt(&isInt);

        if (!isInt) {

            return QValidator::Invalid;

        }

        if (value < 1 || value > 64) {

            return QValidator::Invalid;

        }



        return QValidator::Acceptable;

    }

};



    IntegerValidator* validator = new IntegerValidator;

    comboBox.setValidator(validator);

五、QComboBox ​​​​​​​式样

        QComboBox 的外观可以通过样式表（QSS）进行定制。以下是一些可能的样式设置示例：

/* 下拉框整体样式 */

QComboBox {

    background-color: #fff;

    color: #333;

    border: 1px solid #ccc;

    padding: 2px;

}



/* 下拉箭头样式 */

QComboBox::down-arrow {

    image: url(down-arrow.png);

}



/* 下拉框中的选项样式 */

QComboBox QAbstractItemView {

    background-color: #fff;

    color: #333;

    border: 1px solid #ccc;

}