JustTest

可以借助这个,熟悉Qt的操作

参考资料

豆子博客

https://blog.51cto.com/devbean

Qt开源社区

http://www.qter.org/

新建项目

新建Qt Widgets Application应用,项目名称为myMainWindow,基类选择QMainWindow,类名为MainWindow。(实际上就是一直点确定)

img

新建完项目后,检查一下自己的配置

img

如果这里显示如上,就点进去

img

然后都选上吧

img

可能会出现这种情况

img

稍等一下就行

初试UI

创建完项目后,打开mainwindow.ui文件进入设计模式。在这里可以看到界面左上角的“在这里输入”,我们可以在这里添加菜单。双击“在这里输入”,将其更改为“文件(&F)”,然后按下回车键,效果如下图所示。这里的&F表明将菜单的快捷键设置为了Alt+ F,可以看到,实际的显示效果中&符号是隐藏的。

img

同样的方法,我们在文件菜单中添加“新建(&N)”子菜单,效果如下图所示。菜单后面的那个加号图标是用来创建下一级菜单的。

img

添加图标

没有图标,就没有灵魂

认识Action

Qt中的一个菜单被看做是一个Action,我们在下面的Action编辑器中可以看到刚才添加的“新建”菜单。

img

双击该条目,会弹出编辑动作对话框。

在编辑动作对话框中的图标后面的 img 黑色箭头下拉框可以选择资源。

添加资源文件

我们向项目中添加新文件

img

鼠标右键它就行

模板选择Qt Resource File,如下图所示,名称设置为myResources

img

创建完文件后会自动打开该资源文件,这里需要先在下面添加前缀,就是点击添加按钮,然后选择前缀,默认的前缀是/new/prefix1,这个可以随意修改(不要出现中文字符),我修改的是/MyIcon。

img

然后再按下添加按钮来添加文件,这里先将所有要用到的图片放到项目目录中。

img

比如我们这里在项目目录中新建了一个Icon文件夹,然后将需要的图标文件粘贴进去。

搞完这个文件夹以后,点添加,然后点文件,找到路径后全选确定就行,添加完文件后,如下图所示。

img

当添加完资源后,一定要按下Ctrl + S来保存资源文件,不然在后面可能无法显示已经添加的资源。

以上图片资源我都放在群里了。

使用资源文件

我们重新到设计模式打开新建菜单的编辑动作对话框,然后添加图标。

img

我们点击这里需要的新建图标filenew.png,按下确定即可。

现在按下Ctrl + R键运行程序,看看效果。

没有好康的,就没有灵魂

完善UI

菜单以及文本编译部分

最终效果

img img img

布局管理器

拖入一个文本编辑器Text Edit部件。如下图所示。

img

然后我们在界面上点击鼠标右键,选择布局→栅格布局(或者使用快捷键Ctrl+G)。

这时整个文本编辑器部件就会填充中央区域。

现在运行程序,可以发现,无论怎样拉伸窗口,文本编辑器总是填充整个中央区域。

实现功能

从这里开始,会有一点代码部分

中文字符

先在main.cpp文件中添加代码来保证代码中可以使用中文字符。

首先添加#include <QTextCodec>头文件包含,然后在主函数中添加如下代码:

1
QTextCodec::setCodecForLocale(QTextCodec::codecForName("UTF8"));

基础功能实现

mainwindow.h文件中添加public函数声明:

1
2
3
4
5
void newFile();   // 新建操作
bool maybeSave(); // 判断是否需要保存
bool save(); // 保存操作
bool saveAs(); // 另存为操作
bool saveFile(const QString &fileName); // 保存文件

这里的几个函数就是用来完成功能逻辑的,下面我们会添加它们的定义来实现相应的功能。因为这几个功能联系紧密,所以这几个函数会相互调用。

然后添加private变量定义:

1
2
3
4
// 为真表示文件没有保存过,为假表示文件已经被保存过了
bool isUntitled;
// 保存当前文件的路径
QString curFile;

这里的isUntitled是一个标志,用来判断文档是否被保存过。而curFile用来保存当前打开的文件的路径。

下面到mainwindow.cpp文件,先添加头文件:

1
2
3
4
#include <QMessageBox>
#include <QPushButton>
#include <QFileDialog>
#include <QTextStream>

下面添加那几个函数的定义。

新建操作:

1
2
3
4
5
6
7
8
9
10
void MainWindow::newFile()
{
if (maybeSave()) {
isUntitled = true;
curFile = tr("未命名.txt");
setWindowTitle(curFile);
ui->textEdit->clear();
ui->textEdit->setVisible(true);
}
}

这里先使用maybeSave()来判断文档是否需要保存,如果已经保存完了,则新建文档,并进行初始化。下面是maybeSave()函数的定义:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
bool MainWindow::maybeSave()
{
// 如果文档被更改了
if (ui->textEdit->document()->isModified()) {
// 自定义一个警告对话框
QMessageBox box;
box.setWindowTitle(tr("警告"));
box.setIcon(QMessageBox::Warning);
box.setText(curFile + tr(" 尚未保存,是否保存?"));
QPushButton *yesBtn = box.addButton(tr("是(&Y)"),
QMessageBox::YesRole);
box.addButton(tr("否(&N)"), QMessageBox::NoRole);
QPushButton *cancelBut = box.addButton(tr("取消"),
QMessageBox::RejectRole);
box.exec();
if (box.clickedButton() == yesBtn)
return save();
else if (box.clickedButton() == cancelBut)
return false;
}
// 如果文档没有被更改,则直接返回true
return true;
}

这里先使用了isModified()来判断文档是否被更改了,如果被更改了,则弹出对话框让用户选择是否进行保存,或者取消操作。如果取消操作,那么就返回false,什么都不执行。下面是save()函数的定义:

1
2
3
4
5
6
7
8
bool MainWindow::save()
{
if (isUntitled) {
return saveAs();
} else {
return saveFile(curFile);
}
}

这里如果文档以前没有保存过,那么执行另存为操作saveAs(),如果已经保存过,那么调用saveFile()执行文件保存操作。下面是saveAs()函数的定义:

1
2
3
4
5
6
7
bool MainWindow::saveAs()
{
QString fileName = QFileDialog::getSaveFileName(this,
tr("另存为"),curFile);
if (fileName.isEmpty()) return false;
return saveFile(fileName);
}

这里使用QFileDialog来实现了一个另存为对话框,并且获取了文件的路径,然后使用文件路径来保存文件。下面是saveFile()函数的定义:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
bool MainWindow::saveFile(const QString &fileName)
{
QFile file(fileName);

if (!file.open(QFile::WriteOnly | QFile::Text)) {

// %1和%2分别对应后面arg两个参数,/n起换行的作用
QMessageBox::warning(this, tr("多文档编辑器"),
tr("无法写入文件 %1:/n %2")
.arg(fileName).arg(file.errorString()));
return false;
}
QTextStream out(&file);
// 鼠标指针变为等待状态
QApplication::setOverrideCursor(Qt::WaitCursor);
out << ui->textEdit->toPlainText();
// 鼠标指针恢复原来的状态
QApplication::restoreOverrideCursor();
isUntitled = false;
// 获得文件的标准路径
curFile = QFileInfo(fileName).canonicalFilePath();
setWindowTitle(curFile);
return true;
}

如果不明白,就把鼠标放到不懂的上面然后按F1

双击mainwindow.ui文件,在图形界面窗口下面的Action编辑器里

img

我们鼠标右击“新建”菜单一条,选择“转到槽”,然后选择triggered(),另外两个同理。最终代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
void MainWindow::on_action_N_triggered()
{
newFile();
}

void MainWindow::on_action_S_triggered()
{
save();
}

void MainWindow::on_action_A_triggered()
{
saveAs();
}

现在运行程序,已经能够实现新建文件,保存文件,文件另存为的功能了。

实现其他功能

先到mainwindow.h文件中添加public函数声明:

1
bool loadFile(const QString &fileName); // 加载文件

然后到mainwindow.cpp文件中添加该函数的定义:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
bool MainWindow::loadFile(const QString &fileName)
{
QFile file(fileName);
// 新建QFile对象
if (!file.open(QFile::ReadOnly | QFile::Text)) {
QMessageBox::warning(this, tr("多文档编辑器"),tr("无法读取文件 %1:\n%2.").arg(fileName).arg(file.errorString()));
return false;
// 只读方式打开文件,出错则提示,并返回false
}
QTextStream in(&file);
// 新建文本流对象
QApplication::setOverrideCursor(Qt::WaitCursor);
// 读取文件的全部文本内容,并添加到编辑器中
ui->textEdit->setPlainText(in.readAll());
QApplication::restoreOverrideCursor();

// 设置当前文件
curFile = QFileInfo(fileName).canonicalFilePath();
setWindowTitle(curFile);
return true;
}

分别进入其他几个动作的触发信号的槽,更改如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
void MainWindow::on_action_O_triggered()
{
if (maybeSave()) {
QString fileName = QFileDialog::getOpenFileName(this);
if (!fileName.isEmpty()) {
// 如果文件名不为空,则加载文件
loadFile(fileName);
ui->textEdit->setVisible(true);
}
}
}

void MainWindow::on_action_C_triggered()
{
if (maybeSave()) {
ui->textEdit->setVisible(false);
}
}

void MainWindow::on_action_X_triggered()
{
// 先执行关闭操作,再退出程序
// qApp是指向应用程序的全局指针
on_action_C_triggered();
qApp->quit();
}

void MainWindow::on_action_Z_triggered()
{
ui->textEdit->undo();
}

void MainWindow::on_action_X_3_triggered()
{
ui->textEdit->cut();
}

void MainWindow::on_action_C_2_triggered()
{
ui->textEdit->copy();
}

void MainWindow::on_action_V_triggered()
{
ui->textEdit->paste();
}

这里可以看到,复制、粘贴等常用功能是QTextEdit已经实现的,我们只需要调用相应的函数。虽然实现了退出功能,但是,有时候会使用窗口标题栏的关闭按钮来关闭程序,这里我们需要使用关闭事件处理函数来实现相应的功能。

下面到mainwindow.h文件中,先添加头文件包含#include<QCloseEvent>,然后添加函数声明:

1
2
protected:
void closeEvent(QCloseEvent *event); // 关闭事件

然后到mainwindow.cpp文件中添加该函数的定义:

1
2
3
4
5
6
7
8
9
void MainWindow::closeEvent(QCloseEvent *event)
{
// 如果maybeSave()函数返回true,则关闭程序
if (maybeSave()) {
event->accept();
} else { // 否则忽略该事件
event->ignore();
}
}

查找功能

函数声明

首先到mainwindow.h文件中添加类的前置声明:

1
2
class QLineEdit;
class QDialog;

前置声明所在的位置跟头文件包含的位置相同。

然后在private中添加对象定义:

1
2
QLineEdit *findLineEdit;
QDialog *findDlg;

添加一个私有槽声明:

1
2
private slots:
void showFindText();

槽可以看做是一个函数,只不过可以和信号进行关联。

下面到mainwindow.cpp文件中,因为前面在头文件中使用了类的前置声明,所以这里需要先添加头文件包含:

1
2
#include <QLineEdit>
#include <QDialog>

然后在构造函数中进行初始化操作,即添加如下代码:

1
2
3
4
5
6
7
8
findDlg = new QDialog(this);
findDlg->setWindowTitle(tr("查找"));
findLineEdit = new QLineEdit(findDlg);
QPushButton *btn= new QPushButton(tr("查找下一个"), findDlg);
QVBoxLayout *layout= new QVBoxLayout(findDlg);
layout->addWidget(findLineEdit);
layout->addWidget(btn);
connect(btn, SIGNAL(clicked()), this, SLOT(showFindText()));

这里创建了一个对话框,然后将一个行编辑器和一个按钮放到了上面,并使用布局管理器进行布局。

最后将按钮的单击信号关联到了自定义的显示查找到的文本槽上。

实现功能

mainwindow.cpp

1
2
3
4
5
void MainWindow::showFindText()
{
QString str = findLineEdit->text();
ui->textEdit->find(str, QTextDocument::FindBackward);//这行等会换一下
}

这时已经能实现查找的功能了。

但是find的返回值类型是bool型,而且,我们也应该为查找不到字符串作出提示。(怎么看,按F1

将这行代码更改为:

1
2
3
4
5
if (!ui->textEdit->find(str, QTextDocument::FindBackward))
{
QMessageBox::warning(this, tr("查找"),
tr("找不到%1").arg(str));
}

最后,我们来实现界面上的查找功能。从设计模式进入查找动作的触发信号的槽,更改如下:

1
2
3
4
void MainWindow::on_action_F_triggered()
{
findDlg->show();
}