QTCreator学习

发布于:2024-08-26 ⋅ 阅读:(92) ⋅ 点赞:(0)

1.新建程序

在这里插入图片描述
2. 设置项目名称

在这里插入图片描述3. Build System选择qmake,若选择cmake则只会产生CmakeLists文件,不会产生pro文件。这里选择qmake
在这里插入图片描述

4.Base class选择QDialog,表示该类继承于QDialog类,选择QWindow也可
在这里插入图片描述
5.套件选择MinGW 32bit,记得取消掉其他的。
在这里插入图片描述
6. ,如果不需要ui,纯程序那就取消勾选Generate Form,双击ui文件,拖动可添加工具。
7.点击左下方绿色运行按钮可运行。
在这里插入图片描述

7.QT控件

7.3 显示窗口部件

7.1.3 添加资源文件

  1. 右键项目->add new->QT::QT Resource File
    在这里插入图片描述
  2. 填上资源名称
    在这里插入图片描述
  3. 新建完成了资源文件后,默认会进入 res.qrc 文件编辑模式(如果关闭了,可以右键这个文
    件点击选择“Open in Editor”),点击 Add Prefix 添加前缀,添加前缀的目的是方便分类管理文
    件,比如我们现在第⑪处添加了前缀/。“/”一定需要写,否则会找不到路径,这有点像 Linux
    的根节点一样。
    在这里插入图片描述
  4. 添加了前缀后,我们添加资源图片,放在/images 前缀的下面。准备的图片在本项目路径 images 文件夹(images 文件夹先手动创建)下。如下图步骤,添加完成需要按“Ctrl + S”保存 res.qrc 才会看到左边的结果。添加完成如下图。
  5. 在这里插入图片描述

7.3.1QLabel

QLabel 提供了一种用于文本或图像显示的小部件,在前 7.2.11、7.2.12 等小节已经出现过Label 控件,只用了它显示文本,其实它还可以用于显示图像
使用:

  1. mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QLabel>

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();
private:
    /* 用一个 QLabel 对象用于显示字符串 */
        QLabel *labelString;

    /* 用一个 QLabel 对象用于显示图像 */
        QLabel *labelImage;
};
#endif // MAINWINDOW_H

  1. mainwindow.cpp
#include "mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    this->setGeometry(0,0,800,480);
    QPixmap pixmap(":/images/img1.jpg");

    labelImage = new QLabel(this);
    labelImage->setGeometry(180,150,452,132);
    labelImage->setPixmap(pixmap);
    labelImage->setScaledContents(true);

    labelString = new QLabel(this);
    labelString->setText("标签演示文本");
    labelString->setGeometry(300,300,100,20);
}

MainWindow::~MainWindow()
{
}

  1. main.cpp
#include "mainwindow.h"
#include <QApplication>
int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();
    return a.exec();
}
  1. 运行效果
    在这里插入图片描述

7.3.4 QProgressBar

QProgressBar 继承 QWidget。QProgressBar 小部件提供了一个水平或垂直的进度条。进度条用于向用户显示操作的进度,并向他们确认应用程序仍在运行。在新建例程中不要勾选“Generate form”,默认继承 QMainWindow 类即可。项目新建完成
如下图(已经添加了资源img1.jpg,添加资源参考7.1.3)
在这里插入图片描述
使用:

  1. mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QProgressBar>
#include <QTimer>


class MainWindow : public QMainWindow
{
    Q_OBJECT

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

private:
    /* 声明对象 */
    QProgressBar *progressBar;
    QTimer *timer;

    /* 用于设置当前 QProgressBar 的值 */
    int value;

    private slots:
    /* 槽函数 */
    void timerTimeOut();
};
#endif // MAINWINDOW_H

  1. mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QMainWindow>
#include <QFrame>
class MainWindow : public QMainWindow
{
    Q_OBJECT
public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();
private:
    /* 声明对象 */
    QFrame *hline;
    QFrame *vline;
};
#endif // MAINWINDOW_H
  1. mainwindow.cpp
#include "mainwindow.h"
MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    /* 设置主窗体位置与大小 */
    this->setGeometry(0, 0, 800, 480);

    progressBar = new QProgressBar(this);
    progressBar->setGeometry(300, 200, 200, 60);

    /*样式表设置,常用使用 setStyleSheet 来设置样式(实现界面美化的功能),* 具体可参考 styleSheet */
    progressBar->setStyleSheet (
        "QProgressBar{border:8px solid #FFFFFF;"
        "height:30;"
        "border-image:url(:/img1.jpg);" //背景图片
        "text-align:center;" // 文字居中
        "color:rgb(255,0,255);"
        "font:20px;" // 字体大小为 20px
        "border-radius:10px;}"
        "QProgressBar::chunk{"
        "border-radius:5px;" // 斑马线圆角
        "border:1px solid black;" // 黑边,默认无边
        "background-color:skyblue;"
        "width:10px;margin:1px;}" // 宽度和间距
        );

    /* 设置 progressBar 的范围值 */
    progressBar->setRange(0, 100);
    /* 初始化 value 为 0 */
    value = 0;
    /* 给 progressBar 设置当前值 */
    progressBar->setValue(value);
    /* 设置当前文本字符串的显示格式 */
    progressBar->setFormat("充电中%p%");

    /* 定时器实例化设置每 100ms 发送一个 timeout 信号 */
    timer = new QTimer(this);
    timer->start(100);

    /* 信号槽连接 */
    connect(timer, SIGNAL(timeout()),
            this, SLOT(timerTimeOut()));
}

MainWindow::~MainWindow()
{
}

void MainWindow::timerTimeOut()
{
    /* 定显示器时间到,value 值自加一 */
    value ++;
    progressBar->setValue(value);
    /* 若 value 值大于 100,令 value 再回到 0 */
    if(value>100)
    value = 0;
}

  1. main.cpp保持默认
  2. 运行:程序运行后,可以看到在定时器的作用下,电池一直在充电,充到 100%,又重新回到 0%重新充电。QProgressBar 一般用于表示进度,常用于如复制进度,打开、加载进度等
    在这里插入图片描述

7.3.5 QFrame

QFrame 继承 QWidget。QFrame 类是有框架的窗口部件的基类,它绘制框架并且调用一个虚函数 drawContents()来填充这个框架。这个函数是被子类重新实现的。这里至少还有两个有用的函数:drawFrame()和 frameChanged()。
QPopupMenu 使用这个来把菜单“升高”,高于周围屏幕。QProgressBar 有“凹陷”的外观。QLabel 有平坦的外观。这些有框架的窗口部件可以被改变。

QFrame::Shape 这个枚举类型定义了 QFrame 的框架所使用的外形。当前定义的效果有:
 NoFrame - QFrame 不画任何东西
 Box - QFrame 在它的内容周围画一个框
 Panel - QFrame 画一个平板使内容看起来凸起或者凹陷
 WinPanel - 像 Panel,但 QFrame 绘制三维效果的方式和 Microsoft Windows 95(及其它)的一样
 ToolBarPanel - QFrame 调用 QStyle::drawToolBarPanel()
 MenuBarPanel - QFrame 调用 QStyle::drawMenuBarPanel()
 HLine - QFrame 绘制一个水平线,但没有框任何东西(作为分隔是有用的)
 VLine - QFrame 绘制一个竖直线,但没有框任何东西(作为分隔是有用的)
 StyledPanel - QFrame 调用 QStyle::drawPanel()
 PopupPanel - QFrame 调用 QStyle::drawPopupPanel()
阴影风格有:
 Plain 使用调色板的前景颜色绘制(没有任何三维效果)。
 Raised 使用当前颜色组的亮和暗颜色绘制三维的凸起线。
 Sunken 使用当前颜色组的亮和暗颜色绘制三维的凹陷线。

  1. 使用:
    定义两个 QFrame 对象,实例化后设置成一条
    水平样式,一条垂直样式。实际上 Display Widgets 里的 Horizontal Line/Vertical Line 是 QFrame
    已经封装好的控件,也可以通过下面的例子来实现不同的效果
  2. mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QMainWindow>
#include <QFrame>
class MainWindow : public QMainWindow
{
    Q_OBJECT
public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();
private:
    /* 声明对象 */
    QFrame *hline;
    QFrame *vline;
};
#endif // MAINWINDOW_H
  1. mainwindows.cpp
#include "mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    /* 设置主窗体的显示位置与大小 */
    this->setGeometry(0, 0, 800, 480);

    /* 实例化 */
    hline = new QFrame(this);
    /* 确定起始点,设置长和宽,绘制距形 */
    hline->setGeometry(QRect(200, 100, 400, 40));

    /* 设置框架样式为 Hline,水平,可设置为其他样式例如 Box, 由于是样式选择 HLine,所以只显示一条水平直线 */
    hline->setFrameShape(QFrame::HLine);
    /* 绘制阴影 */
    hline->setFrameShadow(QFrame::Sunken);

    /* 实例化 */
    vline = new QFrame(this);
    /* 确定起始点,设置长和宽,绘制距形 */
    vline->setGeometry(QRect(300, 100, 2, 200));

    /* 设置框架样式为 Vline,垂直,可设置为其他样式例如 Box,由于是样式选择 Vline,所以只显示一条垂直直线 */
    vline->setFrameShape(QFrame::VLine);
    /* 绘制阴影 */
    vline->setFrameShadow(QFrame::Sunken);
}
MainWindow::~MainWindow()
{
}
  1. main.cpp保持默认,程序编译运行的结果如下。在窗口中央出现一条垂直的直线和一条水平的直线。可以用
    QFrame 来绘制一些比较好看的边框等,用作美化界面。QFrame 类是所有框架的窗口部件的基
    类,所以像 QLabel 这种见的控件也可以设置成独特的边框样式。
    在这里插入图片描述

7.4 显示窗口部件之浏览器

7.4.1QTextBrower

QTextBrowser 继承 QTextEdit,QTextBrowser 类提供了一个具有超文本导航的文本浏览器。
该类扩展了 QTextEdit(在只读模式下),添加了一些导航功能,以便用户可以跟踪超文本文档中
的链接。
本例设计一个文本浏览器程序,可以打开并显示 txt、html 等文件。本小节还用到 QAction,菜单栏,学习文件的打开以及处理等。本例设计一个文本浏览器程序,可以打开并显示 txt、html 等文件。本小节还用到 QAction,菜单栏,学习文件的打开以及处理等。生成项目时勾选 mainwindow.ui,因为我们要在工具栏里添加按钮来打开文件等操作。

  1. mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QMainWindow>
#include <QTextBrowser>
QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE
class MainWindow : public QMainWindow
{
    Q_OBJECT
public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();
private:
    Ui::MainWindow *ui;
    /* 声明对象 */
    QTextBrowser *textBrowser;
    QAction *openAction;
private slots:
    /* 槽函数 */
    void openActionTriggered();
};
#endif // MAINWINDOW_H
  1. mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"

/* 窗口对话框与文本流 */
#include <QFileDialog>
#include <QTextStream>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    /* 设置主窗体位置与大小 */
    this->setGeometry(0, 0, 800, 480);

    /* 将窗口标题设置为文本浏览器 */
    this->setWindowTitle("文本浏览器");

    /* 实例化 */
    textBrowser = new QTextBrowser(this);
    /* 将文本浏览器窗口居中 */
    this->setCentralWidget(textBrowser);

    /* 实例化 */
    openAction = new QAction("打开",this);
    /* ui 窗口自带有 menubar(菜单栏)、mainToolbar(工具栏)与
    * statusbar(状态栏)
    * menuBar 是 ui 生成工程就有的,所以可以在 menubar 里添加
    * 我们的 QActiont 等,如果不需要 menubar,可以在 ui 设计
    * 窗口里,在右则对象里把 menubar 删除,再自己重新定义自己的
    * 菜单栏
    */
    /* 将动作添加到菜单栏 */
    ui->menubar->addAction(openAction);

    /* 信号槽连接 */
    connect(openAction, SIGNAL(triggered()),
        this, SLOT(openActionTriggered()));
}

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

void MainWindow::openActionTriggered()
{
    /* 调用系统打开文件窗口,过滤文件名 */
    QString fileName = QFileDialog::getOpenFileName(
    this,tr("打开文件"),"",
    tr("Files(*.txt *.cpp *.h *.html *.htm)")
    );
    QFile myFile(fileName);
    /* 以只读、文本方式打开,若打开失败,则返回 */
    if(!myFile.open(QIODevice::ReadOnly | QIODevice::Text))
    return;

    /* 用 QTextStream 对象接收 */
    QTextStream in (&myFile);

    /* 读取全部数据 */
    QString myText = in.readAll();

    /* 判断打开文件的后缀,如果是 html 格式的则设置文本浏览器为 html 格式 */
    if(fileName.endsWith("html") || fileName.endsWith("htm")){
    textBrowser->setHtml(myText);
    } else {
    textBrowser->setPlainText(myText);
    }

    /* ui 窗口自带有 statusbar(状态栏),设置打开的文件名 */
    ui->statusbar->showMessage("文件名:" + fileName);
}

  1. main.cpp保持默认,运行,在菜单栏点击打开后,选择任意一个可打开的文件,本次打开的是该工程中的 mainwindow.h 文件,结果如下图。根据上面的例子可自行拓展打造自己的文本浏览器,例如在菜单栏上加上关闭动作等,在工具栏还可以添加字体颜色,与及背景颜色,以及字体的放大与缩小等,可自行拓展。

在这里插入图片描述

7.4.2 QGraphicsView

QGraphicsView 继承 QAbstractScrollArea。QGraphicsView 是图形视图框架的一部分,它提
供了基于图元的模型/视图编程。QGraphicsView 在可滚动视图中可视化 QGraphicsScene 的内容。
要可视化场景,首先构造一个 QGraphicsView 对象,将要可视化的场景的地址传递给 QGraphicsView 的构造函数。或者,可以调用 setScene()在稍后设置场景。
本例设计一个图像浏览器程序,在上一节一的基础上,将它改变为图像浏览器。在新建例程默认继承 QMainWindow 类即可。勾选 mainwindow.ui,因为我们要在工具栏里添加按钮来打开文件等操作。

  1. mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QGraphicsView>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

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

private:
    Ui::MainWindow *ui;
    /* 声明对象 */
    QGraphicsView *graphicsView;
    QGraphicsScene *graphicsScene;
    QAction *openAction;
    private slots:
    /* 槽函数 */
    void openActionTriggered();
};
#endif // MAINWINDOW_H
  1. mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QFileDialog>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    this->setGeometry(0, 0, 800, 480);
    /* 将窗口标题设置为图像浏览器 */
    this->setWindowTitle("图像浏览器");

    /* 实例化图形视图对象 */
    graphicsView = new QGraphicsView(this);
    /* 将图像浏览器窗口居中 */
    this->setCentralWidget(graphicsView);

    /* 实例化场景对象 */
    graphicsScene = new QGraphicsScene(this);

    /* 在 QGraphicsView 设置场景 */
    graphicsView->setScene(graphicsScene);

    /* 将动作添加到菜单栏 */
    openAction = new QAction("打开",this);
    ui->menubar->addAction(openAction);

    /* 信号槽连接 */
    connect(openAction, SIGNAL(triggered()),
        this, SLOT(openActionTriggered()));
}

MainWindow::~MainWindow()
{
    delete ui;
}
void MainWindow::openActionTriggered()
{
    /*调用系统打开文件窗口,设置窗口标题为“打开文件”,过滤文件名*/
    QString fileName = QFileDialog::getOpenFileName(
        this,tr("打开文件"), "",
        tr("Files(*.png *.jpg *.bmp)")
        );
    /* 定义 QPixmap 对象,指向 fileName */
    QPixmap image(fileName);
    /* 将 image 用 scaled 来重新设置长宽为 graphicsView 的长宽,
     * 保持纵横比等
    */

    /* 假若用户没选择文件,则返回 */
    if(image.isNull())
        return;
    image = image.scaled(graphicsView->width(),
        graphicsView->height(),

        Qt::KeepAspectRatio,
        Qt::FastTransformation
        );
    /* 在添加场景内容前,先清除之前的场景内容 */
    graphicsScene->clear();
    /* 添加场景内容 image */
    graphicsScene->addPixmap(image);
    /* ui 窗口自带有 statusBar(状态栏),设置打开的文件名 */
    ui->statusbar->showMessage("文件名:" + fileName);
}

  1. 运行:运行的结果如下。菜单栏点击打开后,系统默认是打开的最近打开的位置,选择
    任意一个可打开的图片
    在这里插入图片描述

7.5 布局管理

Qt 提供了非常丰富的布局类,基本布局管理类包括:QBoxLayout、QGridLayout、QFormLayout 和 QStackedLayout。这些类都从 QLayout 继承而来,它们都来源于 QObject(而不是 QWidget)。创建更加复杂的布局,可以让它们彼此嵌套完成。
其中 QBoxLayout 提供了水平和垂直的布局管理;QFormLayout 提供了将输入部件和标签成组排列的布局管理;QGridLayout 提供了网格形式的布局管理;QStackedLayout 提供了一组布局后的部件,可以对它们进行分布显示。它们的继承关系如下图:
在这里插入图片描述
下面将学习 Layouts 组里面的 4 种布局,如下图。
在这里插入图片描述各个控件的名称依次解释如下。
(1) Vertiacl Layout:垂直布局
(2) Horizontal Layout:水平布局
(3) Grid Layout:网格布局
(4) Form Layout:表单布局
QBoxLayout 继承 QLayout。QBoxLayout 类提供水平或垂直地排列子部件。QBoxLayout 获取从它的父布局或从 parentWidget()中所获得的空间,将其分成一列框,并使每个托管小部件填充一个框。
QGridLayout继承QLayout。QGridLayout获取可用的空间(通过其父布局或parentWidget())),将其分为行和列,并将其管理的每个小部件放入正确的单元格中。由于网格布局管理器中的组件也是会随着窗口拉伸而发生变化的,所以也是需要设置组件之间的比例系数的,与 QBoxLayout 不同的是网格布局管理器还需要分别设置行和列的比例系数。
QFormLayout 继承 QLayout。QFormLayout 类管理输入小部件及其关联标签的表单。QFormLayout 是一个方便的布局类,它以两列的形式布局其子类。左列由标签组成,右列由“字段”小部件(QLineEdit(行编辑器)、QSpinBox(旋转框等))组成。通常使用 setRowWrapPolicy(RowWrapPolicy policy)接口函数设置布局的换行策略进行布局等。

7.5.1 QBoxLayout

QBoxLayout 继承 QLayout。QBoxLayout 类提供水平或垂直地排列子部件。QBoxLayout 获
取从它的父布局或从 parentWidget()中所获得的空间,将其分成一列框,并使每个托管小部件填
充一个框。
使用几个按钮,将他们设置为垂直排布和水平排布,以及设置它们的一些属性。在新建例程中不要勾选“Generate form”.

  1. mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QHBoxLayout>
#include <QVBoxLayout>
#include <QPushButton>

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();
private:
    /* 声明按钮对象数组 */
    QPushButton *pushButton[6];

    /* 定义两个 widget,用于容纳排布按钮 */
    QWidget *hWidget;
    QWidget *vWidget;

    /* QHBoxLayout 与 QVBoxLayout 对象 */
    QHBoxLayout *hLayout;
    QVBoxLayout *vLayout;

};
#endif // MAINWINDOW_H

  1. mainwindow.cpp
#include "mainwindow.h"
#include <QList>
MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    /* 设置主窗口的位置与大小 */
    this->setGeometry(0, 0, 800, 480);

    /* 实例化与设置位置大小 */
    hWidget = new QWidget(this);
    hWidget->setGeometry(0, 0, 800, 240);

    vWidget = new QWidget(this);
    vWidget->setGeometry(0, 240, 800, 240);

    hLayout = new QHBoxLayout();
    vLayout = new QVBoxLayout();

    /* QList<T>是 Qt 的一种泛型容器类。* 它以链表方式存储一组值,* 并能对这组数据进行快速索引*/
     QList <QString>list;
    /* 将字符串值插入 list */
    list<<"one"<<"two"<<"three"<<"four"<<"five"<<"six";

    /* 用一个循环实例化 6 个按钮 */
    for(int i = 0; i < 6; i++){
        pushButton[i] = new QPushButton();
        pushButton[i]->setText(list[i]);
        if(i < 3) {
            /* 将按钮添加至 hLayout 中 */
                hLayout->addWidget(pushButton[i]);
        }
        else {
            /* 将按钮添加至 vLayout 中 */

             vLayout->addWidget(pushButton[i]);
        }
    }
        /* 设置间隔为 50 */
    hLayout->setSpacing(50);

    /* hWidget 与 vWidget 的布局设置为 hLayout/vLayout */
    hWidget->setLayout(hLayout);
    vWidget->setLayout(vLayout);
}

MainWindow::~MainWindow()
{
}


  1. 运行,可以看到在 hWidget 中添加了 3 个水平排布的按钮,在 vWidget
    中添加了 3 个垂直排布的按钮。
    在这里插入图片描述

问题

  1. QTCreator中新
  2. 加了ui文件,但是构建时候没有自动生成h头文件
    解决:在ui所在文件夹,命令行:uic -o XXX.h XXX.ui生成