一步步创建Qt Widget项目+TextFinder案例(摘自笔者2015年将出的《QT5权威指南》,本文为试读篇)
创建一个基于应用的QtWidget应用程序
这个手册描述了怎样使用QtCreater创建个一个小的Qt应用程序,Text
Finder.它是Qt工具Text Finder例子的简写版本。这个应用程序的用户界面通过使用Qt
Designer来构造生成。逻辑上来说,这个应用程序是通过代码编辑器上编写C++代码实现的。
创建Text Finder项目案例:
1选择File(文件)>
New Fileor Project(新建文件或项目) > Application(应用程序)>
QtWidgets Application > Choose(选择)
接着打开了项目介绍和位置窗口
2在名称的文本框中,填写TextFinder
3在创建路径的文本框中,键入项目文件存储路径,例如:E:\Examples,接着点击”下一步”(在Windows和Linux平台)或者”继续”(在OS
X平台上)。
构建套件对话框打开了:
4为运行您的项目选择构建套件,接着点击”下一步”或者”继续”
注意:如果一个套件在”工具
> 选项 >编译和运行 >Kits”,这个对话框将会跳过。
接着”类信息”对话框打开了:
5在类名的文本框中,TextFinder作为类名。
6在基类列表里,选择QWidget作为基类类型。
注意:头文件,源文件和界面文件将根据类名自动匹配。
7点击Next和继续。
接着”项目管理”窗口被打开:
8检查项目设置,并且点击”完成”(在Windows和Linux平台)或者”继续”(在OS
X平台)
TextFinder项目包含以下文件:
|
textfinder.h |
截图: |
|
textfinder.cpp |
|
|
main.cpp |
|
|
textfinder.ui |
|
|
TextFinder.pro |
添加缺少部分:
开始设计用户界面,添加缺少的代码,实现查找功能。
设计用户界面:
1在Qt Creater中的Edit编辑模式里,双击textfind.ui文件,转到Qt设计界面。
2拖拽下面的部件到界面中:
|
Label(QLabel) |
|
|
Line Edit(QLineEdit) |
|
|
PushButton(QPushButton) |
注意:如果想快速定位这些部件,可以使用在工具栏上部的搜索窗口。
例如,查找Label部件,可以输入Label进行查找:
3双击Label部件,键入文本”keyword”
4双击Push Button部件,键入文本”Find”
5在属性面板,改变objectName为findButton
6
按Ctrl+A(或者Cmd+A)选中这些部件,点击”水平布局”(在Linux和Window平台上按Ctrl+H,在OS
X平台上按Ctrl +Shift + H)应用一个水平布局(QHBoxLayout)。
7拖拽一个Text Edit部件(QTextEdit)到界面上去。
8选中设计窗口空白区域,点击”垂直布局”(或按Ctrl
+ L)来应用一个水平布局(QVBoxLayout)。
应用水平和垂直布局确保在不同的屏幕上的自适应。
9当用户点击Find按钮的时候,将调用一个find方法,如果您想实现这个功能,您可以使用Qt中的信号(signals)和槽(slots)机制。当特定的事件发生时候一个信号(signal)将被发散(emitted),与此同时,一个槽函数(slot)将会被调用来响应这个特定的信号。在Qt
Widgets的Qt Designer中有一些预先定义好的信号(signals)和槽(slots)可以供您直接使用。接下来为find函数添加槽:
右击”Find”按钮打开一个右键菜单。
选择 “转到槽” >clicked(),接着选择.
一个私有类型的槽函数on_findButton_clicked()被添加到了头文件textfinder.h中去,一个私有的函数TextFinder::on_findButton_clicked()被添加到源文件textfinder.cpp源文件中。
截图如下:
头文件部分截图:
10按Ctrl+S(或Cmd
+ S)保存您的改变。
如果想了解更多关于通过QtDesigner来设计界面的信息,查看Qt
Designer手册(http://doc.qt.io/qt-5/qtdesigner-manual.html)
完善头文件:
在textfinder.h文件里面已经有了必要的头文件#include,一个构造函数,一个析构函数,和一个UI对象,你需要添加私有的函数loadTextFile(),读取并且显示文本的中的内容到QTextEdit中去。
1在项目面板中的编辑视图,双击textfinder.h文件,打开并且编辑它。
2添加私有函数到私有区域,在Ui::TextFinder指针后面,插入一下的代码片段
|
privateslots: voidon_findButton_clicked(); private: Ui::TextFinder*ui; voidloadTextFile(); |
完善源码文件:
现在头文件已经完成了,接下来转到源文件:textfinder.cpp.
1在项目面板中的编辑视图,双击源文件textfinder.cpp,开始编辑。
2在loadTextFile里面,加载一个文件使用QFile,读取文件内容使用QTextStream,显示文本内容到textEdit使用QTextEdit::setPlainText()函数,注意的是若想使用QFile和QTextStream,需要导入如下头文件:
|
#include <QFile> #include <QTextStream> |
3loadTextFile函数的内容如下:
|
voidTextFinder::loadTextFile() { //加载资源文件input.txt,关于资源文件的加载将下文讲述 QFileinputFile(":/input.txt"); inputFile.open(QIODevice::ReadOnly); QTextStreamin(&inputFile); QStringline=in.readAll(); inputFile.close(); ui->textEdit->setPlainText(line); QTextCursorcursor=ui->textEdit->textCursor(); cursor.movePosition(QTextCursor::Start,QTextCursor::MoveAnchor,1); } |
4在on_findButton_clicked()槽函数里,通过QTextEdit::find()方法可以查找在文本文件中的字符串。下面是代码片段:
|
voidTextFinder::on_findButton_clicked() { QStringsearchString=ui->lineEdit->text(); ui->textEdit->find(searchString,QTextDocument::FindWholeWords); } |
5
当这两个方法都完成之后,在构造方法里添加一行代码来调用loadTextFile(),代码片段如下:
|
TextFinder::TextFinder(QWidget*parent): QWidget(parent), ui(newUi::TextFinder) { ui->setupUi(this); //调用加载文件的方法 loadTextFile(); } |
on_findButton_clicked()槽函数将会被自动生成到ui_textfinder.h中下面的一行代码调用:
|
QMetaObject::connectSlotsByName(TextFinder); |
创建资源文件:
您需要一个资源文件(.qrc),这个资源文件嵌入了您输入的文本文件。这个文本文件可以是任意添加了一段文本的.txt文件。创建一个叫做input.txt的文件,并且将它存储在和源代码所在的同级目录里。
添加资源文件:
1选择File (文件)>
New File or Project(新建文件或项目) > Qt>Qt Resource File(Qt资源文件)>
Choose;
选择位置对话框如下:
2在名称文本框中,键入textfinder
3在路径文本框中,键入E:\Examples\TextFinder,点击”下一步”或者”继续”。项目管理对话框打开了:
4在”添加到项目”域,选择TextFinder.pro,点击完成。在代码编辑器中打开这个.qrc文件.
5右击textfinder.qrc,选择右键菜单中的addPrefix
6在Prefix文本域里面,用斜线(/)替换掉默认的prefix.
7右击textfinder.qrc,选择右键菜单中的”添加现有文件”。然后定位到input.txt文件所在的位置,添加进去。
编译和运行您的程序:
至此为止,您已经有了所有必要的文件,您可以点击按钮来编译和运行您的程序了。截图如下:
一步步创建Qt Widget项目+TextFinder案例(摘自笔者2015年将出的《QT5权威指南》,本文为试读篇)的更多相关文章
- 创建一个QT for Android的传感器应用应用程序(摘自笔者2015年将出的《QT5权威指南》,本文为试读篇)
这个手册描述了使用Qt Quick面访的方式在Android和ios设备上开发QtQuick应用程序的方法.我们使用Qt Creator实现一个QtQuick应用程序,这个应用程序基于加速器的值 ...
- Eclipse创建Maven Web项目 + 测试覆盖率 + 常见问题(2015.07.14——湛耀)
Eclipse创建Maven web项目: 到此,并没有创建好,接下来一步步解决问题: 问题:无法创建src/main/java目录 解决: 右键项目选择[properties] 点击[OK] 问题: ...
- Java开发环境的搭建以及使用eclipse从头一步步创建java项目
一.java 开发环境的搭建 这里主要说的是在windows 环境下怎么配置环境. 1.首先安装JDK java的sdk简称JDK ,去其官方网站下载最近的JDK即可..http://www.orac ...
- 创建Qt项目
创建Qt项目 1 创建Qt项目 2.1 使用向导创建 打开Qt Creator 界面选择 New Project或者选择菜单栏 [文件]-[新建文件或项目]菜单项 弹出New Project对 ...
- java第一天--Java开发环境的搭建以及使用eclipse从头一步步创建java项目
一.java 开发环境的搭建 这里主要说的是在windows 环境下怎么配置环境. 1.首先安装JDK java的sdk简称JDK ,去其官方网站下载最近的JDK即可..http://www.orac ...
- 搭建一套Java开发环境以及使用eclipse从头一步步创建java项目
一.java 开发环境的搭建 在windows 环境下怎么配置环境. 1.首先安装JDK java的sdk简称JDK ,去其官方网站下载JDK. https://www.oracle.com/tech ...
- Qt简单项目--加法计算器(详细代码注释)
Qt的简单案例--加法计算器(详细代码注释) 一.项目结构 二.项目代码 widget.h #ifndef WIDGET_H #define WIDGET_H //预编译指令, 为了避免头文件被重复包 ...
- QT5 QSS QML界面美化视频课程系列 QT原理 项目实战 C++1X STL
QT5 QSS QML界面美化视频课程系列 QT原理 项目实战 C++1X STL 课程1 C语言程序设计高级实用速成课程 基础+进阶+自学 课程2 C语言程序设计Windows GDI图形绘 ...
- 使用Jquery+EasyUI 进行框架项目开发案例讲解之四 组织机构管理源码分享
http://www.cnblogs.com/huyong/p/3404647.html 在上三篇文章 <使用Jquery+EasyUI进行框架项目开发案例讲解之一---员工管理源码分享> ...
随机推荐
- 2014-10-30NOIP复习题1
Problem 1 Graph (graph.cpp/c/pas) [题目描述] 给出 N 个点,M 条边的有向图,对于每个点 v,求 A(v) 表示从点 v 出发,能到达的编号最大的点. [输入格式 ...
- WebStorm配置node.js调试
最近因为工作关系,一直在做node.js的开发,学习了koa框架,orm框架sequelize,以及swagger文档的配置.但是,最近因为swagger文档使用了es6的修饰器那么个东西(在java ...
- Windows系统提供什么样的接口,Unix、Linux系统的用户接口是什么?
Windows:图形化用户界面 Unix.Linux:独立的环境.
- 镜像文件、光盘、iso文件、启动盘
刚入大学,有一门计算机硬件维修课程,韩国彬老师(学生们公认的好老师).当时韩老师教给了我们好多实用的好东西,例如装系统,做镜像文件,装虚拟机,ghost版本系统,计算机组装等等.由于高中刚刚过度到大学 ...
- 《Java技术》第三次作业--面向对象——继承、抽象类、接口
1.阅读下面程序,分析是否能编译通过?如果不能,说明原因.应该如何修改?程序的运行结果是什么?为什么子类的构造方法在运行之前,必须调用父 类的构造方法?能不能反过来? class Grandparen ...
- jquery选择器选取class
- 简易js进度条
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- openlayers3设置zoom不变
设置maxZoom和minZoom一致,并去掉resolutions
- 关于一些基础的Java问题的解答(五)
21. 实现多线程的两种方法:Thread与Runable 在Java中实现多线程编程有以下几个方法: 1.继承Thread类,重写run方法 public class Test { public s ...
- vue移动端组件库vux使用小记
1.首先安装vux:npm install vux 2.安装vux-loader:npm install vux-loader 3.确认是否已安装less-loader:npm install ...