QT的学习笔记4——QMainWindow、资源文件以及主要控件的介绍

1、QMainWindow

在mainwindow.cpp中添加以下代码：

首先添加包含的文件：

复制代码

#include "mainwindow.h"

复制代码

#include "ui_mainwindow.h"

复制代码

#include<QMenuBar>

复制代码

#include<QToolBar>

复制代码

#include<QDebug>

复制代码

#include<QPushButton>

之后在函数中添加以下代码：

复制代码

resize(600,400);//重置窗口大小

复制代码

    QMenuBar *bar=menuBar();//菜单栏创建

复制代码

    setMenuBar(bar);//将菜单栏放入窗口中，如果是空栏将什么都不显示

复制代码

    QMenu *fileMenu=bar->addMenu("文件");

复制代码

    QMenu *editMenu=bar->addMenu("编辑");

复制代码

    QAction *newAction=fileMenu->addAction("新建");//创建菜单项

复制代码

    fileMenu->addSeparator();//创建分割线

复制代码

    QAction *openAction=fileMenu->addAction("打开");

之后添加工具栏：

复制代码

 //创建工具栏，可以有多个

复制代码

    QToolBar *toolBar=new QToolBar(this);

复制代码

    addToolBar(Qt::LeftToolBarArea,toolBar);

复制代码

    toolBar->setAllowedAreas(Qt::LeftToolBarArea|Qt::RightToolBarArea);//只允许左右移动,如果放到上/下将不显示工具栏但会放到松开按键的地方

下图将工具栏放到了上面，但由于设置工具栏只能在左侧或右侧，因此放在上侧并未显示：

之后设置移动的总开关：

复制代码

toolBar->setMovable(false);//false工具栏完全不能动

复制代码

toolBar->addAction(newAction);//工具栏中和菜单中绑定的是同一菜单项

复制代码

    toolBar->addAction(openAction);

复制代码

 QPushButton * btn=new QPushButton("aa",this);//在工具栏中添加按钮

复制代码

    toolBar->addWidget(btn);

2、状态栏

头文件添加以下库：

复制代码

#include<QStatusBar>

复制代码

#include<QLabel>

之后在cpp中添加以下代码：

复制代码

QStatusBar * stBar=statusBar();

复制代码

    setStatusBar(stBar);//设置到窗口中

复制代码

    QLabel * label=new QLabel("提示信息",this);

复制代码

    stBar->addWidget(label);//放标签控件,默认左下角

复制代码

    QLabel * label2=new QLabel("右侧信息",this);

复制代码

    stBar->addPermanentWidget(label2);//放标签控件,放到右下角

结果如下：

之后头文件添加：

复制代码

#include<QDockWidget>

cpp中添加以下代码：

复制代码

//浮动窗口,只要是add开头的就可以有多个

复制代码

    QDockWidget * dockWidget=new QDockWidget("浮动窗口",this);

复制代码

    addDockWidget(Qt::BottomDockWidgetArea,dockWidget);

生成结果的浮动窗口可以四处移动（上下左右，外边都可以动）：

复制代码

dockWidget->setAllowedAreas(Qt::TopDockWidgetArea|Qt::BottomDockWidgetArea);//只能放置在上下和外边

复制代码

QTextEdit * edit=new QTextEdit(this);    
setCentralWidget(edit);//设置一个中心部件，只能设置一个，

浮动窗口上面的部分就是中心部件

3、资源文件（可以将本地的资源添加到项目中）

简单按键在之前就已经演示，下面这个是dock widget的控件：

直接通过右下角的勾来选择浮动窗口可移动的位置

添加资源文件：

复制代码

ui->actionnew->setIcon(QIcon("C:\\Users\\xzhao\\Desktop\\1.jpeg"));//使用的是本地资源

为了保证代码在别的电脑中运行后的结果不变，需要将用到的资源添加到项目中，只要下载这个项目，相关资源依然存在：

首先复制你准备好的资源文件

之后在要添加的当前项目中右键选择第二个：

将复制的资源文件粘贴在同一个文件夹下

之后右键项目文件，添加新文件：

选择QT的Resource文件：

之后给资源文件命名，什么都可以，这里命名为：res

生成资源文件：

如果打开页面后点击了别的代码文件，此时双击res.qrc是无法回到相应页面的，此时需要右键：

之后点击Add Prefix，即添加前缀（任意命名）：

前缀添加之后，点击Add Files,即添加文件：

将要添加的文件夹打开并全部选中所有资源：

之后选择编译当前项目，此时资源文件中存在以下图片：

之后在cpp文件中添加，切记 "：" +前缀名+文件名，3个缺一不可！：

复制代码

//添加资源到项目中,QT资源：":+前缀名+文件名"

复制代码

    ui->actionnew->setIcon(QIcon(":/who/image/1.jpeg"));

4、对话框

对话框主要分为两类：

一类是模态对话框：在创建出新的窗口之后不能对其他窗口进行操作

当打开插件框之后，无法在没有关闭的情况下在代码编辑框中输入代码

一种是非模态对话框：可以对其他窗口进行操作

虽然打开了新窗口，但是并不影响编辑框中输入代码

之后新创建一个mainwindow项目，首先在Ui中添加和上面一样的按钮，之后在cpp文件中添加以下代码：

复制代码

 //点击新建按钮，弹出一个对话框

复制代码

    connect(ui->actionnew,&QAction::triggered,[=](){

复制代码

        //模态创建    阻塞

复制代码

        QDialog dlg(this);

复制代码

        dlg.resize(200,100);

复制代码

        dlg.exec();//阻塞，从而显示弹出的对话框

复制代码

        qDebug()<<"模态对话框弹出";

运行之后，点击新建会弹出一个对话框：

如果没有把小的对话框叉掉，将一直无法对大的对话框操作

关闭小对话框之后得到输出日志：

之后是非模态对话框，需要使用new一个对象：

复制代码

QDialog *dlg2=new QDialog(this);

复制代码

        dlg2->resize(400,200);

复制代码

        dlg2->show();

复制代码

        dlg2->setAttribute(Qt::WA_DeleteOnClose);//关闭就释放new的对象

复制代码

        qDebug()<<"非模态对话框弹出";

消息对话框

已经定义的消息如下所示：

复制代码

//消息对话框        
QMessageBox::critical(this,"critical","错误");

点击新建弹出对话框

点击新建弹出信息对话框：

复制代码

QMessageBox::information(this,"info","信息");

复制代码

QMessageBox::question(this,"ques","提问");//提问对话框

这个对话框的回答可以更改，增加一个选项参数，如下所示：

复制代码

QMessageBox::question(this,"ques","提问",QMessageBox::Save|QMessageBox::Cancel);//提问对话框

除了可以更改选项外，还可以更改默认项，再增加一个参数：

复制代码

QMessageBox::question(this,"ques","提问",QMessageBox::Save|QMessageBox::Cancel,QMessageBox::Cancel);

如果想知道选择的是Save还是Cancel，可以使用if语句

复制代码

  if(QMessageBox::Save==QMessageBox::question(this,"ques","提问",QMessageBox::Save|QMessageBox::Cancel,QMessageBox::Cancel))

复制代码

            qDebug()<<"选择的是保存";

复制代码

            }//提问对话框

复制代码

        else

复制代码

            qDebug()<<"选择的是删除";

复制代码

点击Sava弹出"选择的是保存"，点击Cancel弹出"选择的是删除"，点击选项之后弹窗自动退出

复制代码

QMessageBox::warning(this,"warning","警告");//警告对话框

标准对话框：

复制代码

 QFileDialog::getOpenFileName(this,"打开文件","C:\\Users\\xzhao\\Desktop","(*.txt)");//打开文件对话框,最后一个参数加上之后可以过滤需要的文件

点击新建之后，结果如下：

5、在Ui设计登录界面

使用label对用户名/密码等性质类词语进行放置

使用Line edit可以输入信息

使用Push button添加按钮

之后使用Widget分别先对每一行进行水平对齐（将需要水平对齐的东西放到框内，之后点击进行水平对齐），分别弄好之后，选择整个框选择垂直布局即可

为了保证按钮的距离不随窗口的大小变化，选择弹簧：

之后为保证中间的弹簧也不动，即两个按钮之间的距离保持不变，选择右下角的sizeType的Fixed，之后设置宽度和高度值即可：

最终生成的界面如下所示：

之后可以选中大框然后更改窗口名字：

选择框之后右下角选择echoMode中的密码模式即可：

输入的密码将不会显示：

6、控件

做单选按钮时，先选择Radio Button：

之后将同样性质的button放在一个Box中，放置出现多种属性在编译后只能选择其中一个的问题：

以下就是没有将同性质的按钮放在一起时导致4个按钮只能选择其中一个：

选择将同性质的放在一个Box之后，再进行一个对齐操作，单选必须选择同一性质中的其中一个：

可以对按钮名称进行更改，如下所示将男的按钮名称进行重命名（重新编译之后新命名才能在代码那里显示）：

之后在cpp文件中添加一句：

复制代码

  //设置单选按钮  男默认选中

复制代码

    ui->rBtnMan->setChecked(true);

之后运行代码，对话框默认男被选：

之后实现在点击女按键时可以弹出一句日志：

复制代码

//选中女就弹出消息

复制代码

    connect(ui->rBtnWomen,&QRadioButton::clicked,[=](){

复制代码

        qDebug()<<"选中了女";

复制代码

});

记得在头文件要包含#include<QDebug>

多选使用button中的以下按钮实现：

同样放在box中：

之后还可以输出当前的状态值：

同样先对第四个按钮进行重命名，编译，之后去cpp文件中添加该按钮的代码：

复制代码

//对多选框进行勾选看状态值

复制代码

    connect(ui->place,&QCheckBox::stateChanged,[=](int state){

复制代码

        qDebug()<<state;

复制代码

});

发现state勾选后返回2，不勾选为1

当把这个按钮的下面的半勾选状态勾选上时

state将出现2（勾选）、1（半勾选）、0（不勾选），三种状态

7、QListWidget控件（列表容器）

这个控件可以显示文本

在cpp中添加以下代码：

//利用listWidget写诗

QListWidgetItem *item=new QListWidgetItem("锄禾日当午");

ui->listWidget->addItem(item);//将一行诗放到listWidget控件中

item->setTextAlignment(Qt::AlignHCenter);//居中上述语句

之后运行可得：

为了能输出所有语句，可以选择QStringList进行：

复制代码

  //可以将所有诗句都展示出来，但是如果需要居中需要使用上面的方法进行居中

复制代码

    QStringList list;

复制代码

    list<<"锄禾日当午"<<"汗滴禾下土"<<"谁知盘中餐"<<"粒粒皆辛苦";

复制代码

    ui->listWidget->addItems(list);

8、Tree Widget(树控件)

新建一个项目，然后将这个拖到ui中，之后选中大widget选择垂直居中：

之后去cpp文件中对这个控件进行操作：

复制代码

//对树控件设置表头

复制代码

    ui->treeWidget->setHeaderLabels(QStringList()<<"英雄"<<"英雄介绍");

添加表的表头：

cpp 复制代码

//加载顶层节点

    QTreeWidgetItem *liItem=new QTreeWidgetItem(QStringList()<<"力量");
    ui->treeWidget->addTopLevelItem(liItem);
    QTreeWidgetItem *minItem=new QTreeWidgetItem(QStringList()<<"敏捷");
    ui->treeWidget->addTopLevelItem(minItem);
    QTreeWidgetItem *zhiItem=new QTreeWidgetItem(QStringList()<<"智力");
    ui->treeWidget->addTopLevelItem(zhiItem);

之后继续添加子节点：

cpp 复制代码

//追加子节点
    QStringList hero1;
    hero1 << "刚被猪" << "前排坦克，能在吸收伤害的同时造成可观的范围输出";
    QTreeWidgetItem *li=new QTreeWidgetItem(hero1);
    liItem->addChild(li);

    QStringList hero2;
    hero2 << "船长" << "前排坦克，能内能输出能控场的全能英雄";
    QTreeWidgetItem *lii=new QTreeWidgetItem(hero2);
    liItem->addChild(lii);

    QStringList hero3;
    hero3 << "月骑" << "中排物理输出，可以使用分裂利刃攻击多个目标";
    QTreeWidgetItem *min=new QTreeWidgetItem(hero3);
    minItem->addChild(min);

    QStringList hero4;
    hero4 << "小鱼人" << "前排战士，擅长偷取敌人的属性来增强自身战力";
    QTreeWidgetItem *minn=new QTreeWidgetItem(hero4);
    minItem->addChild(minn);

    QStringList hero5;
    hero5 << "死灵法师" << "前排法师坦克，魔法抗性较高，拥有治疗技能";
    QTreeWidgetItem *zhi=new QTreeWidgetItem(hero5);
    zhiItem->addChild(zhi);

    QStringList hero6;
    hero6 << "巫医" << "后排辅助法师，可以使用奇特的巫术诅咒敌人与治疗队友";
    QTreeWidgetItem *zhii=new QTreeWidgetItem(hero6);
    zhiItem->addChild(zhii);

9、tablewidget

选择Table Widget

之后将选择的框放到界面中，并点击界面选择垂直布局

之后到cpp页面添加代码：

复制代码

 //设置列数

复制代码

    ui->tableWidget->setColumnCount(3);

复制代码

 //设置水平表头

复制代码

    ui->tableWidget->setHorizontalHeaderLabels(QStringList()<<"姓名"<<"性别"<<"年龄");

复制代码

   //设置行数

复制代码

    ui->tableWidget->setRowCount(5);

之后添加正文：

cpp 复制代码

//设置正文
    QStringList nameList;
    nameList<<"张三"<<"李四"<<"王五"<<"赵六"<<"马七";

    QList<QString> sexList;
    sexList<<"男"<<"男"<<"女"<<"男"<<"男";

    for(int i=0;i<5;i++){
        int col=0;
        ui->tableWidget->setItem(i,col++,new QTableWidgetItem(nameList[i]));
        ui->tableWidget->setItem(i,col++,new QTableWidgetItem(sexList[i]));
        ui->tableWidget->setItem(i,col++,new QTableWidgetItem(QString::number(i+18)));

结果如下：

10、其他常用控件项

实现滚动的效果：

实现想QQ那样的聊天界面：

可以对页面名称进行更改，如下所示：

使用右下角的currentltemText中进行更改：

默认是有两页，也可以添加，选中对象，点击右键，点击插入页3即可：

之后可以在每一页添加按钮：

单击每一页按钮名称不一致：

网页控件：

选中其中一个属性之后更改名字：

栈控件，将刚刚添加的3个控件分别放到这个控件中，同样需要右键新增加一页：

由于运行之后并不能存在箭头切换页面，因此需要添加按钮以及连接来实现页面的转换：

根据不同的栈控件中对应的页面索引值确定点击某按钮后要眺至某页：

一定要对应好按钮以及页面的名称！！！

cpp 复制代码

//栈控件的使用

    //scrollarea按钮
    connect(ui->btn_scrollArea,&QPushButton::clicked,[=](){//给按钮添加关联
        ui->stackedWidget->setCurrentIndex(0);//根据索引值设置栈控件的页面值，点击该按钮将跳至某一页
    });

    //toolbox按钮
    connect(ui->btn_toolBox,&QPushButton::clicked,[=](){
        ui->stackedWidget->setCurrentIndex(1);
    });

    //tabwidget按钮
    connect(ui->btn_tabWidget,&QPushButton::clicked,[=](){
        ui->stackedWidget->setCurrentIndex(2);
    });

之后点击按钮就可以实现不同页面的切换，譬如软件的切换：

、

点击不同的功能页面展示也不同：

下拉框控件：

首先确定该空间的名称，之后可以在cpp文件中添加下拉内容：

cpp 复制代码

//下拉框控件
    ui->comboBox->addItem("早上");
    ui->comboBox->addItem("下午");
    ui->comboBox->addItem("晚上");

之后可以新增按钮使其实现在点击按钮之后下拉框显示相应内容：

所有的新增控件都要在编译一次之后才能在cpp中显示！！！

cpp 复制代码

    //点击"选中中午"按钮之后，下拉框显示中午，不需要点击下拉框内容后才显示
    connect(ui->btn_lunch,&QPushButton::clicked,[=](){
//        ui->comboBox->setCurrentText("中午");以下两种方式均可实现
        ui->comboBox->setCurrentIndex(1);

以下是默认状态的结果：

点击按钮之后，下拉框默认值发生改变：

使用label显示图片：

首先选择Label放置在widget中，之后记住控件的名字，在cpp输入以下代码：

复制代码

ui->pci_label->setPixmap(QPixmap(":/pic/image/1.png"));

由于图片太大导致显示不全，此时勾选label的右下角的位置：

勾选之后再次运行，成功显示完整图片：

除了可以添加静态图外，还可以添加动图：

继续在ui添加label，之后修改名字为mov_label,之后在cpp中添加代码：

cpp 复制代码

 //在label中添加动图
    QMovie *movie=new QMovie(":/pic/image/5.gif");
    ui->mov_label->setMovie(movie);
    movie->start();

一定要添加start的函数，否则动图不能显示：