qt:多元素类,容器类,布局类

发布于:2025-02-25 ⋅ 阅读:(21) ⋅ 点赞:(0)
1.列表

List Widget

属性 特点
currentRow 当前被选中的是第几行
count 一共有多少行
sortingEnabled 是否允许排序
isWrapping 是否允许换行
itemAlignment 元素的对齐方式
selectRectVisible 被选中的元素矩形是否可见
spacing 元素之间的间隔
方法 特点
addItem(const QString& label)
addItem(QListWidgetItem *item)
列表中添加元素
currentItem() 返回 QListWidgetItem* 表示当前选中的元素
setCurrentItem(QListWidgetItem* item) 设置选中哪个元素
setCurrentRow(int row) 设置选中第几行的元素
insertItem(const QString& label, int row)
insertItem(QListWidgetItem *item, int row)
在指定的位置插入元素
item(int row) 返回 QListWidgetItem* 表示第 row 行的元素
takeItem(int row) 删除指定行的元素, 返回 QListWidgetItem* 表示是哪个元素被删除了

信号 特点
currentItemChanged(QListWidgetItem* current, QListWidgetItem* old) 选中不同元素时会触发. 参数是当前选中的元素和之前选中的元素
currentRowChanged(int) 选中不同元素时会触发. 参数是当前选中元素的行数
itemClicked(QListWidgetItem* item) 点击某个元素时触发
itemDoubleClicked(QListWidgetItem* item) 双击某个元素时触发
itemEntered(QListWidgetItem* item) 鼠标进入元素时触发

在上述介绍中涉及到⼀个关键的类:QListWidgetItem,这个类表示 QListWidget 中的一个元素。核心方法如下,本质上就是⼀个 “文本+图标” 构成的

setFont: 设置字体
setIcon: 设置图标
setHidden: 设置隐藏
setSizeHint: 设置尺寸
setSelected: 设置是否选中
setText: 设置文本
setTextAlignment: 设置文本对齐方式
这些方法允许我们自定义 Q List Widget Item 的外观和行为。

通过结合使用 QListWidget 的属性、方法和信号,以及 QListWidgetItem 的方法,可以创建高度定制化的列表控件

编写一个程序,演示程序,实现程序记录和增删功能

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    connect(ui->pushButton,&QPushButton::clicked,this,&Widget::truebutton);

    connect(ui->pushButton_2,&QPushButton::clicked,this,&Widget::falsebutton);
    connect(ui->listWidget,&QListWidget::currentItemChanged,this,&Widget::print);
}

Widget::~Widget()
{
    delete ui;
}
void Widget::truebutton()
{
    if(!ui->lineEdit->text().isEmpty())
    {
        ui->listWidget->addItem(ui->lineEdit->text());
    }
}
void Widget::falsebutton()
{
    int row=ui->listWidget->currentRow();
        ui->listWidget->takeItem(row);

}
void Widget::print(QListWidgetItem*pre1,QListWidgetItem*now1)
{
    if(pre1)
    { if(!pre1->text().isEmpty())
    {
        ui->textEdit->append("先前选中"+pre1->text());
    }
}
    if(now1)
{
    if(!now1->text().isEmpty())
    {
        ui->textEdit->append("现在选中"+now1->text());
    }
    }
}

2.表格

TableWidget,表格中的每一格都是一个QTableWidge tItem对象

QTableWidget方法 特点
item(int row, int column) 根据行数列数获取指定的 QTableWidgetItem*
setItem(int row, int column, QTableWidgetItem*) 根据行数列数设置表格中的元素
currentItem() 返回被选中的元素 QTableWidgetItem*
currentRow() 返回被选中元素是第几行
currentColumn() 返回被选中元素是第几列
row(QTableWidgetItem*) 获取指定 item 是第几行
column(QTableWidgetItem*) 获取指定 item 是第几列
rowCount() 获取行数
columnCount() 获取列数
insertRow(int row) 在第 row 行处插入新行
insertColumn(int column) 在第 column 列插入新列
removeRow(int row) 删除第 row 行
removeColumn(int column) 删除第 column 列
setHorizontalHeaderItem(int column, QTableWidgetItem*) 设置指定列的表头
setVerticalHeaderItem(int row, QTableWidgetItem*) 设置指定行的表头
QTableWidget tltem信号 特点
cellClicked(int row, int column) 点击单元格时触发
cellDoubleClicked(int row, int column) 双击单元格时触发
cellEntered(int row, int column) 鼠标进入单元格时触发
currentCellChanged(int row, int column, int previousRow, int previousColumn) 选中不同单元格时触发
QTableWidget tltem方法 特点
row() 获取当前是第几行
column() 获取当前是第几列
setText(const QString&) 设置文本
setTextAlignment(int) 设置文本对齐
setIcon(const QIcon&) 设置图标
setSelected(bool) 设置被选中
setSizeHint(const QSize&) 设置尺寸
setFont(const QFont&) 设置字体

写出演示程序,实现表格行列的增加和减少

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    ui->tableWidget->insertRow(0);
    ui->tableWidget->insertRow(1);
    ui->tableWidget->insertRow(2);
    ui->tableWidget->insertColumn(0);
    ui->tableWidget->insertColumn(1);
    ui->tableWidget->insertColumn(2);
    ui->lineEdit->setClearButtonEnabled(true);
    connect(ui->pushButton,&QPushButton::clicked,this,&Widget::addrow);
    connect(ui->pushButton_2,&QPushButton::clicked,this,&Widget::addcolumn);
    connect(ui->pushButton_3,&QPushButton::clicked,this,&Widget::deleterow);
    connect(ui->pushButton_4,&QPushButton::clicked,this,&Widget::deletecolumn);
    }
void Widget::addcolumn()
{
    int column=ui->tableWidget->columnCount();
    ui->tableWidget->insertColumn(column);
    if(!ui->lineEdit->text().isEmpty())
    {
        ui->tableWidget->setHorizontalHeaderItem(column,new QTableWidgetItem(ui->lineEdit->text()));
    }
    else
    {
        qDebug()<<"请输入列名";
    }

}
void Widget::addrow()
{
    int row1=ui->tableWidget->rowCount();
    ui->tableWidget->insertRow(row1);
}
Widget::~Widget()
{
    delete ui;
}
void Widget::deleterow()
{
    int row1=ui->tableWidget->currentRow();
    ui->tableWidget->removeRow(row1);
}
void Widget::deletecolumn()
{
    int column=ui->tableWidget->currentColumn();
    ui->tableWidget->removeColumn(column);
}

 

3.树形图

QTreeWidget 每个节点是 QTreeWidge tItem,注意该树形结构没有根节点的设置,是从根节点的孩子进行设置,这样可以设置多个顶层节点

QTreeWIdget方法 特点
clear() 清空所有子节点
addTopLevelItem(QTreeWidgetItem* item) 新增顶层节点
topLevelItem(int index) 获取指定下标的顶层节点
topLevelItemCount() 获取顶层节点个数
indexOfTopLevelItem(QTreeWidgetItem* item) 查询指定节点是顶层节点中的下标
takeTopLevelItem(int index) 删除指定的顶层节点,返回 QTreeWidgetItem* 表示被删除的元素
currentItem() 获取当前选中的节点,返回 QTreeWidgetItem*
setCurrentItem(QTreeWidgetItem* item) 选中指定节点
setExpanded(bool) 展开/关闭节点
setHeaderLabel(const QString& text) 设置 TreeWidget 的 header 名称
QTreeWidget信号

特点

currentItemChanged(QTreeWidgetItem* current, QTreeWidgetItem* old) 切换选中元素时触发
itemClicked(QTreeWidgetItem* item, int col) 点击元素时触发
itemDoubleClicked(QTreeWidgetItem* item, int col) 双击元素时触发
itemEntered(QTreeWidgetItem* item, int col) 鼠标进入时触发
itemExpanded(QTreeWidgetItem* item) 元素被展开时触发
itemCollapsed(QTreeWidgetItem* item) 元素被折叠时触发
QTreeWidget tltem属性 特点
text 持有的文本
textAlignment 文本对齐方式
icon 持有的图标
font 文本字体
hidden 是否隐藏
disabled 是否禁用
expanded 是否展开
sizeHint 尺寸大小
selected 是否选中
QTreeWidget tltem信号 特点
addChild(QTreeWidgetItem* child) 新增子节点
childCount() 子节点的个数
child(int index) 获取指定下标的子节点,返回 QTreeWidgetItem*
takeChild(int index) 删除对应下标的子节点
removeChild(QTreeWidgetItem* child) 删除对应的子节点
parent() 获取该元素的父节点

 创建一棵演示树

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QTreeWidgetItem *top1=new QTreeWidgetItem();
    top1->setText(0,"狗");
    QTreeWidgetItem*top2=new QTreeWidgetItem();
    top2->setText(0,"猫");
    ui->treeWidget->addTopLevelItem(top1);
    ui->treeWidget->addTopLevelItem(top2);
    QTreeWidgetItem *child11=new QTreeWidgetItem();
    child11->setText(0,"瘦猫");
    QTreeWidgetItem*child12=new QTreeWidgetItem();
    child12->setText(0,"胖猫");
    top2->addChild(child11);
    top2->addChild(child12);
    connect(ui->pushButton,&QPushButton::clicked,this,&Widget::inserttop);
    connect(ui->pushButton_2,&QPushButton::clicked,this,&Widget::insertthis);
    connect(ui->pushButton_3,&QPushButton::clicked,this,&Widget::deletethis);
}
void Widget::inserttop()
{
    QTreeWidgetItem*i1=new QTreeWidgetItem();
    if(!ui->lineEdit->text().isEmpty())
    i1->setText(0,ui->lineEdit->text());
    ui->treeWidget->addTopLevelItem(i1);

}
void Widget::insertthis()
{
    QTreeWidgetItem*i1=new QTreeWidgetItem();
    if(!ui->lineEdit->text().isEmpty())
        i1->setText(0,ui->lineEdit->text());
    QTreeWidgetItem*nowthis=ui->treeWidget->currentItem();
    nowthis->addChild(i1);
}
void Widget::deletethis()
{
     QTreeWidgetItem*nowthis=ui->treeWidget->currentItem();
    if(!nowthis)
     {
         return;
    }
    QTreeWidgetItem*parent=nowthis->parent();
    if(!parent)
    {
        int ed=ui->treeWidget->indexOfTopLevelItem(nowthis);
        ui->treeWidget->takeTopLevelItem(ed);
    }
    else
    {
        parent->removeChild(nowthis);
    }
}
Widget::~Widget()
{
    delete ui;
}

4.分组框

QGroupBox

属性 特点
title 分组框的标题
alignment 分组框内部内容的对齐方式
flat 是否是 “扁平” 模式;设置为 true时,分组框将不显示边框,呈现扁平化外观
checkable 是否可选择;设为 true,则在 title前方会多出一个可勾选的部分
checked 描述分组框的选择状态(前提是 checkable为 true

用的很少,不做过多演示

5.标签页

QTableWidget 

属性 特点
tabPosition 标签页所在的位置:
- North 上方
- South 下方
- West 左侧
- East 右侧
currentIndex 当前选中了第几个标签页(从0开始计算)
currentTabText 当前选中的标签页的文本
currentTabName 当前选中的标签页的名字
currentTabIcon 当前选中的标签页的图标
currentTabToolTip 当前选中的标签页的提示信息
tabsClosable 标签页是否可以关闭
movable 标签页是否可以移动
信号 属性
currentChanged(int) 在标签页发生切换时触发,参数为被点击的选项卡编号。
tabBarClicked(int) 在点击选项卡的标签条的时候触发,参数为被点击的选项卡编号。
tabBarDoubleClicked(int) 在双击选项卡的标签条的时候触发,参数为被点击的选项卡编号。
tabCloseRequested(int) 在标签页关闭请求时触发,参数为被请求关闭的选项卡编号。

编写按钮实现标签页的增减

#include "widget.h"
#include "ui_widget.h"

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QLabel*l1=new QLabel(ui->tab);
    l1->setText("标签页1");
    l1->resize(100,50);
    QLabel*l2=new QLabel(ui->tab_2);
    l2->setText("标签页2");
    l2->resize(100,50);
    connect(ui->pushButton,&QPushButton::clicked,this,&Widget::addtab);
    connect(ui->pushButton_2,&QPushButton::clicked,this,&Widget::losetab);
}

Widget::~Widget()
{
    delete ui;
}
void Widget::addtab()
{
    int cnt=ui->tabWidget->count();
    QWidget*w=new QWidget();
    ui->tabWidget->addTab(w,QString("Tab")+QString::number(cnt+1));
    QLabel*l=new QLabel(w);
    l->setText("标签页"+QString::number(cnt+1));
    l->resize(100,50);
    ui->tabWidget->setCurrentIndex(cnt);
}
void Widget::losetab()
{
    int cnt=ui->tabWidget->currentIndex();
    ui->tabWidget->removeTab(cnt);
}

6.垂直布局

QVBoxLayout

属性 说明
layoutLeftMargin 左侧边距,设置或获取布局内容与容器左边界的距离
layoutRightMargin 右侧边距,设置或获取布局内容与容器右边界的距离
layoutTopMargin 上方边距,设置或获取布局内容与容器上边界的距离
layoutBottomMargin 下方边距,设置或获取布局内容与容器下边界的距离
layoutSpacing 相邻元素之间的间距,设置或获取布局中各元素之间的默认间隔

 qt creater中使用垂直布局

#include "widget.h"
#include "ui_widget.h"
#include<QPushButton>
#include<QVBoxLayout>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton*q1=new QPushButton("q1");
    QPushButton*q2=new QPushButton("q2");
    QPushButton*q3=new QPushButton("q3");
    QVBoxLayout*lay=new QVBoxLayout();
    lay->addWidget(q1);
    lay->addWidget(q2);
    lay->addWidget(q3);
    this->setLayout(lay);
}

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

qt designer中,可以设置多个布局管理器,但是不会起作用,原因是一个Widget只能有一个布局管理器,多余的是新建一个Widget对象,所以不会有效

 7.水平布局

QHBoxLayout,属性和垂直布局一样,一般使用也完全相同,现在演示嵌套情况

#include "widget.h"
#include "ui_widget.h"
#include<QPushButton>
#include<QVBoxLayout>
#include<QHBoxLayout>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton*q1=new QPushButton("q1");
    QPushButton*q2=new QPushButton("q2");
    QPushButton*q3=new QPushButton("q3");
    QVBoxLayout*vb=new QVBoxLayout();
    this->setLayout(vb);
    vb->addWidget(q1);
    vb->addWidget(q2);
    vb->addWidget(q3);
    QPushButton*q4=new QPushButton("q4");
    QPushButton*q5=new QPushButton("q5");
    QPushButton*q6=new QPushButton("q6");
    QHBoxLayout*hb=new QHBoxLayout();
    hb->addWidget(q4);
    hb->addWidget(q5);
    hb->addWidget(q6);
    vb->addLayout(hb);
}

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

8.网格布局

QGridLayout

属性 特点
layoutLeftMargin 左侧边距
layoutRightMargin 右侧边距
layoutTopMargin 上方边距
layoutBottomMargin 下方边距
layoutHorizontalSpacing 相邻元素之间水平方向的间距
layoutVerticalSpacing 相邻元素之间垂直方向的间距
layoutRowStretch 行方向的拉伸系数
layoutColumnStretch 列方向的拉伸系数
#include "widget.h"
#include "ui_widget.h"
#include<QPushButton>
#include<QGridLayout>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton*q1=new QPushButton("q1");
    QPushButton*q2=new QPushButton("q2");
    QPushButton*q3=new QPushButton("q3");
    QPushButton*q4=new QPushButton("q4");
    QGridLayout*lay=new QGridLayout();
    lay->addWidget(q1,0,0);
    lay->addWidget(q2,0,1);
    lay->addWidget(q3,1,0);
    lay->addWidget(q4,1,1);
    this->setLayout(lay);
}


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

注意,0,1代表是第几行第几列

设置列宽度(0则是不参与拉伸),按钮高度固定,所以列高度设置不明显

 

#include "widget.h"
#include "ui_widget.h"
#include<QPushButton>
#include<QGridLayout>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton*q1=new QPushButton("q1");
    QPushButton*q2=new QPushButton("q2");
    QPushButton*q3=new QPushButton("q3");
    QPushButton*q4=new QPushButton("q4");
    QPushButton*q5=new QPushButton("q5");
    QPushButton*q6=new QPushButton("q6");
    QGridLayout*lay=new QGridLayout();
    lay->addWidget(q1,0,0);
    lay->addWidget(q2,0,1);
    lay->addWidget(q3,1,0);
    lay->addWidget(q4,1,1);
     lay->addWidget(q5,0,2);
     lay->addWidget(q6,1,2);
     lay->setColumnMinimumWidth(0,200);
     lay->setColumnMinimumWidth(1,100);
    lay->setColumnMinimumWidth(2,400);

    this->setLayout(lay);
   
}


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

设置垂直拉伸 

QSizePolicy::Ignored:忽略控件的尺寸,不对布局产生影响。
QSizePolicy::Minimum:控件的最小尺寸为固定值,布局时不会超过该值。
QSizePolicy::Maximum:控件的最大尺寸为固定值,布局时不会小于该值。
QSizePolicy::Preferred:控件的理想尺寸为固定值,布局时会尽量接近该值。
QSizePolicy::Expanding:控件的尺寸可以根据空间调整,尽可能占据更多空间。
QSizePolicy::Shrinking:控件的尺寸可以根据空间调整,尽可能缩小以适应空间。

再演示一下用比例设置列间距

#include "widget.h"
#include "ui_widget.h"
#include<QPushButton>
#include<QGridLayout>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton*q1=new QPushButton("q1");
    QPushButton*q2=new QPushButton("q2");
    QPushButton*q3=new QPushButton("q3");
    QPushButton*q4=new QPushButton("q4");
    QPushButton*q5=new QPushButton("q5");
    QPushButton*q6=new QPushButton("q6");
    q1->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    q2->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    q3->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    q4->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    q5->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    q6->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
    QGridLayout*lay=new QGridLayout();
    lay->addWidget(q1,0,0);
    lay->addWidget(q2,0,1);
    lay->addWidget(q3,1,0);
    lay->addWidget(q4,1,1);
     lay->addWidget(q5,0,2);
     lay->addWidget(q6,1,2);
     lay->setRowStretch(0,1);
     lay->setRowStretch(1,6);
    lay->setRowStretch(2,3);

    this->setLayout(lay);

}


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

网格也能嵌套 

9.表单布局
#include "widget.h"
#include "ui_widget.h"
#include<QFormLayout>
#include<QLabel>
#include<QLineEdit>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QFormLayout*lay=new QFormLayout();
    this->setLayout(lay);
    QLabel*l1=new QLabel("账号");
    QLabel*l2=new QLabel("密码");
    QLineEdit *e1=new QLineEdit();
    QLineEdit* e2=new QLineEdit();
    lay->addRow(l1,e1);
    lay->addRow(l2,e2);

}

Widget::~Widget()
{
    delete ui;
}
 10.space
属性 特点
width 宽度
height 高度
hData

水平方向的 sizePolicy

- QSizePolicy::Ignored: 忽略控件的尺寸,不对布局产生影响。
- QSizePolicy::Minimum: 控件的最小尺寸为固定值,布局时不会超过该值。
QSizePolicy::Maximum: 控件的最大尺寸为固定值,布局时不会小于该值。
QSizePolicy::Preferred: 控件的理想尺寸为固定值,布局时会尽量接近该值。
QSizePolicy::Expanding: 控件的尺寸可以根据空间调整,尽可能占据更多空间。
QSizePolicy::Shrinking: 控件的尺寸可以根据空间调整,尽可能缩小以适应空间。

vData 垂直方向的 sizePolicy 选项同上。

演示

#include "widget.h"
#include "ui_widget.h"
#include<QPushButton>
#include<QSpacerItem>
#include<QHBoxLayout>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton*q1=new QPushButton();
    QPushButton*q2=new QPushButton();
    QSpacerItem*sp=new QSpacerItem(200,20);
    QHBoxLayout *l=new  QHBoxLayout();
    this->setLayout(l);
    l->addWidget(q1);
    l->addSpacerItem(sp);
    l->addWidget(q2);
}

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