窗口——QT

原创已于 2022-04-20 09:06:02 修改 · 717 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

于 2022-04-04 16:00:01 首次发布

本文详细介绍了Qt界面开发中的各种控件如LineEdit、GroupBox、RadioButton、CheckBox、ListWidget、TreeWidget、TableWidget等的使用方法，以及如何进行水平布局、垂直分组和数据交互。涵盖了从基础控件到复杂表格的全方位指导。

lable：字符标签，可自定义文字
也可以显示图片或动图
line edit：单行的输入标签，运行后可输入文字
horizontal layout：水平对齐，可将想要水平对齐的控件放入里面就会对齐
widget：相当一一个文本框一样的东西，可以把控件放到里面，然后这这个widget框整体进行水平布局等操作
- 这指文本框的大小：sizePolicy默认为perferred,变小可设置为fixed
Tool Button：可以添加图片，按钮大小根据图片大小按比例缩放
- 插入图片：icon
- toolbuttonstyle：ToolButtonTextBesidelcon让图片和文字一起左右显示
- autoRaise：让按钮的边框透明隐藏
radio Button：单选按钮
按钮的objectName为MButton

// 设置单选按钮的默认值
ui->MButton->setChecked(true);

选中后打印信息

// 选中后打印信息
connect(ui->wbutton,&QRadioButton::clicked,[=](){
    qDebug() <<"选中女";
});

在这里插入图片描述 + Group Box：分组，可以把想放到一个组里的按钮放在这个框里

ckeck box：多选按钮

在这里插入图片描述

    // 多选按钮 选中后打印信息，2是选中，0是未选中
    connect(ui->abox,&QCheckBox::stateChanged,[=](int state)
    {
        qDebug() <<state;
    });

当你重复的选中和退选的时候，选中后控制台输出2，退选控制台输出0
在这里插入图片描述

list widget：列个表框，可以一行一行的显示文字
需要添加#include <QListWidgetItem>头文件

    // 利用listwidget写文本
    QListWidgetItem * item = new QListWidgetItem("不仅狂澜走沧海");
    QListWidgetItem * item2 = new QListWidgetItem("一拳天与压潮头");
    // 将一行诗放到listWidget中
    // listWidget为控件名
    ui->listWidget->addItem(item);
    ui->listWidget->addItem(item2);

在这里插入图片描述
可以将文字水平居中

    // 利用listwidget写文本
    QListWidgetItem * item = new QListWidgetItem("不仅狂澜走沧海");
    QListWidgetItem * item2 = new QListWidgetItem("一拳天与压潮头");

    ui->listWidget->addItem(item);
    ui->listWidget->addItem(item2);
    // 将一行诗放到listWidget中
    item->setTextAlignment(Qt::AlignHCenter);

在这里插入图片描述第二种方法

    QStringList list;
    list << "横空出世" << "莽昆仑" << "阅尽人间春色";
    ui->listWidget->addItems(list);

在这里插入图片描述

tree widget

    // treewidget控件

    // 设置头栏
    ui->treeWidget->setHeaderLabels(QStringList()<<"科目" <<"成绩");

在这里插入图片描述

    // 设置头栏
    ui->treeWidget->setHeaderLabels(QStringList()<<"科目" <<"成绩");
    
    QTreeWidgetItem * lit = new QTreeWidgetItem(QStringList()<<"奔波霸");
    QTreeWidgetItem * lit2 = new QTreeWidgetItem(QStringList()<<"霸波奔");
    // 添加到顶层节点
    ui->treeWidget->addTopLevelItem(lit);
    ui->treeWidget->addTopLevelItem(lit2);

在这里插入图片描述

    // 设置头栏
    ui->treeWidget->setHeaderLabels(QStringList()<<"科目" <<"成绩");

    QTreeWidgetItem * lit = new QTreeWidgetItem(QStringList()<<"奔波霸");
    QTreeWidgetItem * lit2 = new QTreeWidgetItem(QStringList()<<"霸波奔");
    // 添加到顶层节点
    ui->treeWidget->addTopLevelItem(lit);
    ui->treeWidget->addTopLevelItem(lit2);

    // 追加子节点
    // 创建子节点
    QStringList heh;
    heh <<"数学"<<"89";
    QTreeWidgetItem * aa = new QTreeWidgetItem(heh);
    lit->addChild(aa);

    // 建立第二个子节点
    QStringList heh2;
    heh2 <<"数学"<<"77";
    QTreeWidgetItem * bb = new QTreeWidgetItem(heh2);
    lit2->addChild(bb);

在这里插入图片描述

table widget 表格控件

    // tablewidget控件
    // 要先设置列数
    ui->table->setColumnCount(3); // 设置3列
    // 设置每列的水平表头
    ui->table->setHorizontalHeaderLabels(QStringList()<<"姓名"<<"性别"<<"年龄");

在这里插入图片描述

    // tablewidget控件
    // 要先设置列数
    ui->table->setColumnCount(3); // 设置3列
    // 设置每列的水平表头
    ui->table->setHorizontalHeaderLabels(QStringList()<<"姓名"<<"性别"<<"年龄");

    // 设置行数
    ui->table->setRowCount(2);
    //设置正文
    //(0,0)的位置设置成奔波霸
    ui->table->setItem(0,0,new QTableWidgetItem("奔波霸"));

在这里插入图片描述

 //用循环的方式添加数据
    QStringList name;
    name <<"奔波霸" <<"霸波奔";

    QList<QString> gander;
    gander << "男"<< "男";

    for(int i=0;i<2;i++)
    {
        int col = 0;
        ui->table->setItem(i,col++,new QTableWidgetItem(name[i]));
        ui->table->setItem(i,col++,new QTableWidgetItem(gander.at(i)));
        // int 转 QString
        ui->table->setItem(i,col++,new QTableWidgetItem(QString::number(i+18)));

在这里插入图片描述

tool box：
tab widget：
stacked widget：可以放多个窗口，通过左右小箭头调节

在这里插入图片描述
在实际运行过程中并没有这箭头，需要自己在添加按钮，通过槽函数连接


    //可以设置默认的初始页面
    ui->stackedWidget->setCurrentIndex(1);

    //通过按钮控制Stacked Widget的页面
    
    // 第一页的名为page1
    // stackedWidget的第一页的编号为0
    connect(ui->page1,&QPushButton::clicked,[=](){
        ui->stackedWidget->setCurrentIndex(0);
    });
    
    // 第二页的名为page2
    // stackedWidget的第二页的编号为1
    connect(ui->page2,&QPushButton::clicked,[=](){
        ui->stackedWidget->setCurrentIndex(1);
    });
    
    // 第三页的名为page3
    // stackedWidget的第三页的编号为2
    connect(ui->page3,&QPushButton::clicked,[=](){
        ui->stackedWidget->setCurrentIndex(2);
    });

在这里插入图片描述

comboBox：下拉框

需要添加头文件：#include <QComboBox>

    // 下拉框

    // 添加下拉框选项
    ui->comboBox->addItem("自行车");
    ui->comboBox->addItem("摩托车");
    ui->comboBox->addItem("拖拉机");
    
    // 点击按钮选中拖拉机
    connect(ui->tuolaji,&QPushButton::clicked,[=](){
        ui->comboBox->setCurrentIndex(2);
    });
    // 按照0,1,2排序

在这里插入图片描述

spin box
horizontal slider
将两者两者联系在一起让滑竿和数字同步

    //数字控件名为spinset,拉框控件名为hget
    
    //数字增加，框跟着动,但是左边的划框移动不会带动数字增加
    void(QSpinBox:: * spinset)(int) = &QSpinBox::valueChanged;
    connect(ui->spinset, spinset ,ui->hget,&QSlider::setValue);

    // 划框滑动带动数组增加
    connect(ui->hget,&QSlider::valueChanged,ui->spinset,&QSpinBox::setValue);