C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序

学习第一步:创建一个基于Qt Widget的Text Finder应用程序。

这个教程讲如何用Qt Creator创建一个小的Qt应用程序。最终展示效果如下:
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序

第一步:创建项目

选择 File > New File or Project > Application > Qt Widgets Application > Choose
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
选择项目路径,注意路径一定要是全英文的,不能有汉字,否则项目无法编译
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
Kit选择,直接Next,如果只有一个Kit,这一步软件会跳过
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
修改Class Name为TextFinder
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
点击Finsh,项目创建完毕
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
第二步:编写界面

在编辑模式,双击打开项目的textfinder.ui文件,拖动下面三个小部件到表单中

  • Label (QLabel)
  • Line Edit (QLineEdit)
  • Push Button (QPushButton)

C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序

  • 双击Label部件输入Keyword
  • 双击Push Button部件输入Find
  • 点击Find Button找到属性, 改变objectNamefindButton
    C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序

然后全选小部件,点击Lay out Horizontally
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
拖动一个Text Edit小部件到表单中,全选并点击Lay out Vertically
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
右键点击Find按钮打开一个context-menu,选择Go to Slot > clicked(),然后选择OK,一个私有sloton_findButton_clicked()已经添加到头文件中,一个私有函数TextFinder::on_findButton_clicked() 已经添加到源文件textfinder.cpp中。

第三步:完善头文件
在编辑模式双击打开textfinder.h头文件,在私有部分添加一个函数void loadTextFile(),如下:

  private:
      Ui::TextFinder *ui;
      void loadTextFile();

第四步:完善源文件
双击打开textfinder.cpp文件,在文件的最后添加如下的函数:

  void TextFinder::loadTextFile()
  {
      QFile inputFile(":/input.txt");
      inputFile.open(QIODevice::ReadOnly);

      QTextStream in(&inputFile);
      QString line = in.readAll();
      inputFile.close();

      ui->textEdit->setPlainText(line);
      QTextCursor cursor = ui->textEdit->textCursor();
      cursor.movePosition(QTextCursor::Start, QTextCursor::MoveAnchor, 1);
  }

在文件的最前面添加如下的代码:

#include <QFile>
#include <QTextStream>

在函数on_findButton_clicked()添加如下代码:

  void TextFinder::on_findButton_clicked()
  {
      QString searchString = ui->lineEdit->text();
      ui->textEdit->find(searchString, QTextDocument::FindWholeWords);
  }

最后,在如下的函数中还要添加一行代码loadTextFile(),整体如下:

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

第五步:创建源文件
首先在你的项目目录下面创建一个名叫input.txt的文件,接下来选择File > New File or Project > Qt > Qt Resource File > Choose
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
选择地址要在上面的项目文件夹目录下,Name输入textfinder
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
选择刚才创建的项目名称
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
选择Add > Add Prefix,在Prefix处用 “/” 替换默认的路径,然后选择添加文件,选择input.txt。
C++ GUI Qt编程之路------创建一个基于Qt Widget的Text Finder应用程序
接下来你就可以编译并且执行你的程序了。

注意:
如果你想把你编写的软件发布出来,在其他地方也能正常执行,你还需要将qt的一些文件路径加入环境变量中。我在我的环境变量中加入了如下两条(我的Qt是默认路径安装的):

C:\Qt\Qt5.12.1\Tools\QtCreator\bin
C:\Qt\Qt5.12.1\5.12.1\mingw73_64\bin

如果你的环境变量设置的和我的一样,那么你在编译的时候,构建套件(Kit)要选择Desktop Qt 5.12.1 64-bitrelease