【QT】 QT中的列表框-横向列表框-树状列表框-表格列表框

QT中的列表框-横向列表框-树状列表框-表格列表框

1.横向列表框
- (1)主要方法
- (2)信号
- (3) 示例代码1:
- (4) 现象：
- (5) 示例代码2：加载目录项在横向列表框显示
- (6) 现象：
2.树状列表框 QTreeWidget
- (1)使用思路
- (2)信号
- (3)常用的接口函数
- (4) 示例代码：
- (5) 现象
3.表格列表框 QTableWidget
- (1)使用思路
- (2)常用的接口函数
- (3)示例代码
- (4)现象

在UI设计器种的列表框
在这里插入图片描述

1.横向列表框

QListWidget 表示横向列表框
QListWidgetItem 表示列表项
QModelIndex 表示列表项索引

(1)主要方法

第一个：往列表框中添加列表项
     void QListWidget::addItem(const QString &label)  
             参数: label --》要添加的列表项
     void QListWidget::addItem(QListWidgetItem *item)
             参数: item --》要添加的列表项
                   QListWidgetItem::QListWidgetItem(const QIcon &icon, const QString &text)
                          参数： icon --》要显示的图标
                                 text --》要添加的文本内容
                   QIcon::QIcon(const QString &fileName)
                          参数：fileName --》根据图标的路径名构造一个QIcon对象
第二个：返回列表项中的文本内容
     QString QListWidgetItem::text() const
第三个：查找列表项
     QList<QListWidgetItem *> QListWidget::findItems(const QString &text, Qt::MatchFlags flags) const
             返回值：QList容器，里面存放了所有匹配的列表项
               参数：text --》要查找的列表项
                         flags --》Qt::MatchContains  //搜索所有匹配的列表项
第四个：删除列表项
     QListWidgetItem *QListWidget::takeItem(int row)
               参数: row --》要删除的列表项的索引号，从0开始计算
第五个：通过列表项的文本内容得到索引号
   int QListWidget::row(const QListWidgetItem *item) const
       通过索引号得到列表项的文本内容  
	QListWidgetItem *QListWidget::item(int row) const

(2)信号

单击列表项
[signal] void QListWidget::itemClicked(QListWidgetItem *item)
              参数: item --》单击的列表项
                    通过text()方法可以获取列表项中的内容
                           QString QListWidgetItem::text() const
[signal] void QAbstractItemView::clicked(const QModelIndex &index)  
              参数: index --》单击的列表项索引
                    通过row()方法可以获取列表项的索引
双击列表项
[signal] void QAbstractItemView::doubleclicked(const QModelIndex &index)  
[signal] void QListWidget::itemDoubleClicked(QListWidgetItem *item)

(3) 示例代码1:

// widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QListWidgetItem>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void on_listWidget_itemClicked(QListWidgetItem *item);

    void on_listWidget_clicked(const QModelIndex &index);

private:
    Ui::Widget *ui;
};
#endif // WIDGET_H

// widget.cpp
#include "widget.h"
#include "ui_widget.h"
#include <QDebug>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    //往横向列表框中添加列表项
    ui->listWidget->addItem("王0");
    ui->listWidget->addItem("王1");
    ui->listWidget->addItem("王2");
    ui->listWidget->addItem("王3");
    ui->listWidget->addItem("王4");
    ui->listWidget->addItem("王5");
    ui->listWidget->addItem("王6");
    ui->listWidget->addItem("王7");
    ui->listWidget->addItem("王8");
    ui->listWidget->addItem("王9");

    //往横向列表框中添加列表项(带图标)QListWidgetItem(const QIcon &icon, const QString &text)
    QIcon icon1("C:/Users/xxx/Desktop/vm_shared/code/QT_proj/res/1.png");
    QListWidgetItem *item1=new QListWidgetItem(icon1,"王10");
    ui->listWidget->addItem(item1);
    
     //设置字体
     QFont myfont("楷体",20);
     ui->listWidget->setFont(myfont);

     //设置图标大小
     QSize size1(28,28);
     ui->listWidget->setIconSize(size1);

     //查找列表项
     QList<QListWidgetItem *> itemlist=ui->listWidget->findItems("王1",Qt::MatchContains); //查找所有的王1
     //QList<QListWidgetItem *> itemlist=ui->listWidget->findItems("王1",Qt::MatchStartsWith); //查找第一个符合要求的王1
     for(auto x:itemlist)
         qDebug()<<"找到了: "<<x->text();
}

Widget::~Widget()
{
    delete ui;
}

// 第一种:单击列表项
void Widget::on_listWidget_itemClicked(QListWidgetItem *item)
{
//    qDebug()<<"单击的是： "<<item->text();
//    item->setTextAlignment(Qt::AlignRight);

    //删除列表项
//    ui->listWidget->takeItem(ui->listWidget->row(item));
}

// 第二种:单击列表项
void Widget::on_listWidget_clicked(const QModelIndex &index)
{
    qDebug()<<"单击的列表项索引号(行号): "<<index.row();
}

(4) 现象：

在这里插入图片描述

(5) 示例代码2：加载目录项在横向列表框显示

// widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QListWidgetItem>
#include <QDebug>
#include <QFileInfo>
#include <QFileDialog>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void on_pushButton_clicked();

    void on_listWidget_clicked(const QModelIndex &index);

private:
    Ui::Widget *ui;
};
#endif // WIDGET_H

// widget.cpp
#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
}

Widget::~Widget()
{
    delete ui;
}

//单击列表项
void Widget::on_listWidget_clicked(const QModelIndex &index)
{
    qDebug()<<"单击的列表项索引号(行号): "<<index.row();
}

//加载目录
void Widget::on_pushButton_clicked()
{
    // 弹出目录对话框 获取打开的目录路径
    QString dirpath=QFileDialog::getExistingDirectory(this);
    qDebug()<< "dirpath:" << dirpath;

    //创建目录对象
    QDir mydir(dirpath);

    //遍历目录
    QStringList filelist=mydir.entryList();

    //遍历列表项
    for(int i=0; i<filelist.size(); i++)
    {
        if(filelist.at(i)=="." || filelist.at(i)=="..")
            continue;
        //拼接得到绝对路径
        QString allpath=QString("%1/%2").arg(dirpath).arg(filelist.at(i));
        //判断文件类型
        QFileInfo info(allpath);
        if(info.isDir()) //是目录
        {
            QIcon icon1("C:/Users/xxx/Desktop/vm_shared/code/QT_proj/res/文件夹.png");
            QListWidgetItem *item1=new QListWidgetItem(icon1,allpath);
            ui->listWidget->addItem(item1);
            //设置图标大小
            QSize size1(28,28);
            ui->listWidget->setIconSize(size1);
        }
        else
        {
            QIcon icon1("C:/Users/xxx/Desktop/vm_shared/code/QT_proj/res/文件.png");
            QListWidgetItem *item1=new QListWidgetItem(icon1,allpath);
            ui->listWidget->addItem(item1);
            //设置图标大小
            QSize size1(28,28);
            ui->listWidget->setIconSize(size1);
        }
    }
    //设置字体
    QFont myfont("楷体",24);
    ui->listWidget->setFont(myfont);
}

(6) 现象：

选择【加载目录】–>确定后将所选择的目录显示在横向列表框种
在这里插入图片描述

2.树状列表框 QTreeWidget

(1)使用思路

第一步：设置水平头 --》树状列表框的树根
void QTreeWidget::setHeaderLabel(const QString &label)
参数:label --》要添加的水平头
第二步：添加顶层节点
void QTreeWidget::addTopLevelItem(QTreeWidgetItem *item)
参数:item --》要添加的顶层节点
QTreeWidgetItem(const QStringList &strings)
参数:strings --》要添加的字符串
第三步：添加子节点
void QTreeWidgetItem::addChild(QTreeWidgetItem *child)
参数:child --》要添加的子节点

(2)信号

跟横向列表框类似，请参见横向列表框信号的介绍

(3)常用的接口函数

第一个：根据列号得到对应列表项文本内容
	QString QTreeWidgetItem::text(int column) const
第二个：查找列表项
	QList<QTreeWidgetItem *> QTreeWidget::findItems(const QString &text,Qt::MatchFlags flags)
		参数：text --》要查找的列表项
		flags --》打算如何查找
第三个：删除列表项
//删除子节点
void QTreeWidgetItem::removeChild(QTreeWidgetItem *child)
	参数：child --》要删除的子节点
QTreeWidgetItem *QTreeWidgetItem::takeChild(int index)
	参数：index --》要删除的子节点索引号，从0开始
//删除顶层节点
ui->treeWidget->takeTopLevelItem(0);  //参数是顶层节点的索引
	参数：index --》索引号从0开始
	第一个顶层节点  0
	第二个顶层节点  1

(4) 示例代码：

// widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QTreeWidgetItem>
#include <QDebug>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void on_treeWidget_itemClicked(QTreeWidgetItem *item, int column);

private:
    Ui::Widget *ui;
};
#endif // WIDGET_H

// widget.cpp
#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    // 设置水平头
    ui->treeWidget->setHeaderLabel("QQ好友");

    // 设置顶层节点--》分组的标题
    // 写法1:传统的写法
    // QStringList list1;
    // list1.append("幼儿园同学");

    // 写法2:简洁的写法
    // QStringList list1;
    // list1<<"幼儿园同学"; //operator<<

    // 写法3:C++的匿名对象--》没有名字的对象(传递实参的时候用到匿名对象)
    QTreeWidgetItem *item1=new QTreeWidgetItem(QStringList()<<"幼儿园同学");
    ui->treeWidget->addTopLevelItem(item1);

    QTreeWidgetItem *item2=new QTreeWidgetItem(QStringList()<<"小学同学");
    ui->treeWidget->addTopLevelItem(item2);

    QTreeWidgetItem *item3=new QTreeWidgetItem(QStringList()<<"中学同学");
    ui->treeWidget->addTopLevelItem(item3);

    //添加子节点
    QTreeWidgetItem *item10=new QTreeWidgetItem(QStringList()<<"张1");
    QTreeWidgetItem *item11=new QTreeWidgetItem(QStringList()<<"张2");
    QTreeWidgetItem *item12=new QTreeWidgetItem(QStringList()<<"张3");
    //给子节点设置图标
    item10->setIcon(0,QIcon("C:/Users/xxx/Desktop/vm_shared/code/QT_proj/res/头像1.png"));
    item11->setIcon(0,QIcon("C:/Users/xxx/Desktop/vm_shared/code/QT_proj/res/头像2.png"));
    item12->setIcon(0,QIcon("C:/Users/xxx/Desktop/vm_shared/code/QT_proj/res/头像3.png"));
    item1->addChild(item10);
    item1->addChild(item11);
    item1->addChild(item12);
}

Widget::~Widget()
{
    delete ui;
}

void Widget::on_treeWidget_itemClicked(QTreeWidgetItem *item, int column)
{
    qDebug()<<"单击的列表项是："<<item->text(column);
    //无非就两种情况：一种item是顶层节点
    //              二种item是个子节点
    //删除幼儿园同学这个顶层节点对应的子节点
    /*
        QTreeWidgetItem *QTreeWidgetItem::parent() const
        QTreeWidgetItem *QTreeWidgetItem::child(int index) const
    */
    // 若无父节点的话那么当前节点就是顶层节点
    if(item->parent()==nullptr)
    {
        //item->removeChild(item->child(2)); //把第三项删除
//        ui->treeWidget->takeTopLevelItem(0); //索引是0的顶层节点是幼儿园同学
        qDebug()<<"单击的是顶层节点";
    }
    else
        // 子节点对应的顶层节点->removeChild(子节点);
        qDebug()<<"单击的是顶层节点下面的某个子节点";
}

(5) 现象

在这里插入图片描述

3.表格列表框 QTableWidget

(1)使用思路

第一步：设置表格的列数
     void QTableWidget::setColumnCount(int columns)
           参数：columns --》表格的列数
     比如：做一个学生表格  姓名  班级  成绩 --》三个字段
第二步：设置水平头 --》每一列字段的名字
     void QTableWidget::setHorizontalHeaderLabels(const QStringList &labels)
               参数：labels --》要设置的水平内容
第三步：设置表格的行数
     void QTableWidget::setRowCount(int rows)
               参数：rows --》表格的行数
第四步：设置正文内容
     void QTableWidget::setItem(int row, int column, QTableWidgetItem *item)
               参数：row --》行号，从0开始
                     column --》列号，从0开始
                     item --》要添加的正文内容
                        QTableWidgetItem::QTableWidgetItem(const QString &text)

(2)常用的接口函数

QTableWidgetItem *QTableWidget::takeItem(int row, int column) //删除文字内容

(3)示例代码

// widget.h
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QDebug>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void on_tableWidget_cellClicked(int row, int column);

private:
    Ui::Widget *ui;
};
#endif // WIDGET_H

// widget.cpp
#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    //设置表格列数
    ui->tableWidget->setColumnCount(4);

    //设置表格的字段名(水平头)
    ui->tableWidget->setHorizontalHeaderLabels(QStringList()<<"姓名"<<"年龄"<<"成绩"<<"家庭住址");

    //设置表格的行数
    ui->tableWidget->setRowCount(20);

    //往表格中添加正文内容
    ui->tableWidget->setItem(0,0,new QTableWidgetItem("张三"));
    ui->tableWidget->setItem(0,1,new QTableWidgetItem("21"));
    ui->tableWidget->setItem(0,2,new QTableWidgetItem("99.5"));
    ui->tableWidget->setItem(0,3,new QTableWidgetItem("广州"));

    ui->tableWidget->setItem(1,0,new QTableWidgetItem("李四"));
    ui->tableWidget->setItem(1,1,new QTableWidgetItem("19"));
    ui->tableWidget->setItem(1,2,new QTableWidgetItem("95.5"));
    ui->tableWidget->setItem(1,3,new QTableWidgetItem("深圳"));
}

Widget::~Widget()
{
    delete ui;
}

void Widget::on_tableWidget_cellClicked(int row, int column)
{
    qDebug()<<"单击的列表项行和列分别是: "<<row<<"  "<<column;
    //删除列表项
    ui->tableWidget->takeItem(row,column);
}