本帖最后由 正点原子运营 于 2022-7-27 15:12 编辑
1)实验平台:正点原子阿尔法Linux开发板
2) 章节摘自【正点原子】《I.MX6U 嵌入式Qt开发指南》
3)购买链接:https://detail.tmall.com/item.htm?id=609033604451
4)全套实验源码+手册+视频下载地址:http://www.openedv.com/docs/boards/arm-linux/zdyz-i.mx6ull.html
5)正点原子官方B站:https://space.bilibili.com/394620890
6)正点原子阿尔法Linux交流群:1027879335
第七章 Qt控件
7.4 显示窗口部件之浏览器
7.4.1 QTextBrowser
7.4.1.1 控件简介 QTextBrowser继承QTextEdit,QTextBrowser类提供了一个具有超文本导航的文本浏览器。该类扩展了QTextEdit(在只读模式下),添加了一些导航功能,以便用户可以跟踪超文本文档中的链接。 7.4.1.2 用法示例 例27_qtextbrowser,简单的文本浏览器(难度:简单),本例设计一个文本浏览器程序,可以打开并显示txt、html等文件。本小节还用到QAction,菜单栏,学习文件的打开以及处理等。 在新建例程默认继承QMainWindow类即可。勾选mainwindow.ui,因为我们要在工具栏里添加按钮来打开文件等操作。新建项目完成如下。 file:///C:/Users/ALIENTEK/AppData/Local/Temp/msohtmlclip1/01/clip_image002.jpg 在头文件“mainwindow.h”具体代码如下。 - mainwindow.h编程后的代码
- 1 #ifndef MAINWINDOW_H
- 2 #define MAINWINDOW_H
- 3
- 4 #include <QMainWindow>
- 5 #include <QTextBrowser>
- 6
- 7 QT_BEGIN_NAMESPACE
- 8 namespace Ui { class MainWindow; }
- 9 QT_END_NAMESPACE
- 10
- 11 class MainWindow : public QMainWindow
- 12 {
- 13 Q_OBJECT
- 14
- 15 public:
- 16 MainWindow(QWidget *parent = nullptr);
- 17 ~MainWindow();
- 18
- 19 private:
- 20 Ui::MainWindow *ui;
- 21 /* 声明对象 */
- 22 QTextBrowser *textBrowser;
- 23 QAction *openAction;
- 24
- 25 private slots:
- 26 /* 槽函数 */
- 27 void openActionTriggered();
- 28 };
- 29 #endif // MAINWINDOW_H
复制代码在源文件“mainwindow.cpp”具体代码如下。 - mainwindow.cpp编程后的代码
- 1 #include "mainwindow.h"
- 2 #include "ui_mainwindow.h"
- 3 /* 窗口对话框与文本流 */
- 4 #include <QFileDialog>
- 5 #include <QTextStream>
- 6
- 7 MainWindow::MainWindow(QWidget *parent)
- 8 : QMainWindow(parent)
- 9 , ui(new Ui::MainWindow)
- 10 {
- 11 ui->setupUi(this);
- 12 /* 设置主窗体位置与大小 */
- 13 this->setGeometry(0, 0, 800, 480);
- 14
- 15 /* 将窗口标题设置为文本浏览器 */
- 16 this->setWindowTitle("文本浏览器");
- 17
- 18 /* 实例化 */
- 19 textBrowser = new QTextBrowser(this);
- 20 /* 将文本浏览器窗口居中 */
- 21 this->setCentralWidget(textBrowser);
- 22
- 23 /* 实例化 */
- 24 openAction = new QAction("打开",this);
- 25 /* ui窗口自带有menubar(菜单栏)、mainToolbar(工具栏)与
- 26 * statusbar(状态栏)
- 27 * menuBar是ui生成工程就有的,所以可以在menubar里添加
- 28 * 我们的QActiont等,如果不需要menubar,可以在ui设计
- 29 * 窗口里,在右则对象里把menubar删除,再自己重新定义自己的
- 30 * 菜单栏
- 31 */
- 32 /* 将动作添加到菜单栏 */
- 33 ui->menubar->addAction(openAction);
- 34
- 35 /* 信号槽连接 */
- 36 connect(openAction, SIGNAL(triggered()),
- 37 this, SLOT(openActionTriggered()));
- 38
- 39 }
- 40
- 41 MainWindow::~MainWindow()
- 42 {
- 43 delete ui;
- 44 }
- 45
- 46 void MainWindow::openActionTriggered()
- 47 {
- 48 /* 调用系统打开文件窗口,过滤文件名 */
- 49 QString fileName = QFileDialog::getOpenFileName(
- 50 this,tr("打开文件"),"",
- 51 tr("Files(*.txt *.cpp *.h *.html *.htm)")
- 52 );
- 53 QFile myFile(fileName);
- 54 /* 以只读、文本方式打开,若打开失败,则返回 */
- 55 if(!myFile.open(QIODevice::ReadOnly | QIODevice::Text))
- 56 return;
- 57
- 58 /* 用QTextStream对象接收 */
- 59 QTextStream in (&myFile);
- 60
- 61 /* 读取全部数据 */
- 62 QString myText = in.readAll();
- 63
- 64 /* 判断打开文件的后缀,如果是html格式的则设置文本浏览器为html格式 */
- 65 if(fileName.endsWith("html") || fileName.endsWith("htm")){
- 66 textBrowser->setHtml(myText);
- 67 } else {
- 68 textBrowser->setPlainText(myText);
- 69 }
- 70
- 71 /* ui窗口自带有statusbar(状态栏),设置打开的文件名 */
- 72 ui->statusbar->showMessage("文件名:" + fileName);
- 73 }
复制代码在源文件“main.cpp”具体代码如下。由新建项目时生成,无改动。 - main.cpp编程后的代码
- 1 #include "mainwindow.h"
- 2
- 3 #include <QApplication>
- 4
- 5 int main(int argc, char *argv[])
- 6 {
- 7 QApplication a(argc, argv);
- 8 MainWindow w;
- 9 w.show();
- 10 return a.exec();
- 11 }
复制代码 7.4.1.3 运行效果 程序编译运行的结果如下。在菜单栏点击打开后,系统默认是打开的最近打开的位置,选择任意一个可打开的文件,本次打开的是该工程中的mainwindow.cpp文件,结果如下图。根据上面的例子可自行拓展打造自己的文本浏览器,例如在菜单栏上加上关闭动作等,在工具栏还可以添加字体颜色,与及背景颜色,以及字体的放大与缩小等,可自行拓展。(备注:经测试Ubuntu16的Qt程序异常,看不到菜单栏,所以看不到“打开”这个按钮,Ubuntu18显示正常。) file:///C:/Users/ALIENTEK/AppData/Local/Temp/msohtmlclip1/01/clip_image004.jpg 7.4.2 QGraphicsView小节前言: 在这里主要是简单介绍QGraphicsView这种框架类的介绍与常用接口,实际上这种框架过于复杂,我们也不能在这一小节完全展现,下面就让我们快速去了解QGraphicsView图形视图框架类吧!
7.4.2.1 控件简介 QGraphicsView继承QAbstractScrollArea。QGraphicsView是图形视图框架的一部分,它提供了基于图元的模型/视图编程。QGraphicsView在可滚动视图中可视化QGraphicsScene的内容。要创建带有几何项的场景,请参阅QGraphicsScene的文档。 要可视化场景,首先构造一个QGraphicsView对象,将要可视化的场景的地址传递给QGraphicsView的构造函数。或者,可以调用setScene()在稍后设置场景。
7.4.2.2 用法示例 例28_qgraphicsview,简单的图像浏览器(难度:简单),本例设计一个图像浏览器程序,在上一节一的基础上,将它改变为图像浏览器。 在新建例程默认继承QMainWindow类即可。勾选mainwindow.ui,因为我们要在工具栏里添加按钮来打开文件等操作。新建项目完成如下。 file:///C:/Users/ALIENTEK/AppData/Local/Temp/msohtmlclip1/01/clip_image006.jpg 在头文件“mainwindow.h”具体代码如下。 - mainwindow.h编程后的代码
- 1 #ifndef MAINWINDOW_H
- 2 #define MAINWINDOW_H
- 3
- 4 #include <QMainWindow>
- 5 #include <QGraphicsView>
- 6
- 7 QT_BEGIN_NAMESPACE
- 8 namespace Ui { class MainWindow; }
- 9 QT_END_NAMESPACE
- 10
- 11 class MainWindow : public QMainWindow
- 12 {
- 13 Q_OBJECT
- 14
- 15 public:
- 16 MainWindow(QWidget *parent = nullptr);
- 17 ~MainWindow();
- 18
- 19 private:
- 20 Ui::MainWindow *ui;
- 21 /* 声明对象 */
- 22 QGraphicsView *graphicsView;
- 23 QGraphicsScene *graphicsScene;
- 24 QAction *openAction;
- 25
- 26 private slots:
- 27 /* 槽函数 */
- 28 void openActionTriggered();
- 29
- 30 };
- 31 #endif // MAINWINDOW_H
复制代码在源文件“mainwindow.cpp”具体代码如下。 - mainwindow.cpp编程后的代码
- 1 #include "mainwindow.h"
- 2 #include "ui_mainwindow.h"
- 3 #include <QFileDialog>
- 4
- 5 MainWindow::MainWindow(QWidget *parent)
- 6 : QMainWindow(parent)
- 7 , ui(new Ui::MainWindow)
- 8 {
- 9 ui->setupUi(this);
- 10 /* 设置主窗体大小 */
- 11
- 12 this->setGeometry(0, 0, 800, 480);
- 13 /* 将窗口标题设置为图像浏览器 */
- 14 this->setWindowTitle("图像浏览器");
- 15
- 16 /* 实例化图形视图对象 */
- 17 graphicsView = new QGraphicsView(this);
- 18 /* 将图像浏览器窗口居中 */
- 19 this->setCentralWidget(graphicsView);
- 20
- 21 /* 实例化场景对象 */
- 22 graphicsScene = new QGraphicsScene(this);
- 23
- 24 /* 在QGraphicsView设置场景 */
- 25 graphicsView->setScene(graphicsScene);
- 26
- 27 /* 将动作添加到菜单栏 */
- 28 openAction = new QAction("打开",this);
- 29 ui->menubar->addAction(openAction);
- 30
- 31 /* 信号槽连接 */
- 32 connect(openAction, SIGNAL(triggered()),
- 33 this, SLOT(openActionTriggered()));
- 34 }
- 35
- 36 MainWindow::~MainWindow()
- 37 {
- 38 delete ui;
- 39 }
- 40
- 41 void MainWindow::openActionTriggered()
- 42 {
- 43 /*调用系统打开文件窗口,设置窗口标题为“打开文件”,过滤文件名*/
- 44 QString fileName = QFileDialog::getOpenFileName(
- 45 this,tr("打开文件"), "",
- 46 tr("Files(*.png *.jpg *.bmp)")
- 47 );
- 48 /* 定义QPixmap对象,指向fileName */
- 49 QPixmap image(fileName);
- 50 /* 将image用scaled来重新设置长宽为graphicsView的长宽,
- 51 * 保持纵横比等
- 52 */
- 53
- 54 /* 假若用户没选择文件,则返回 */
- 55 if(image.isNull())
- 56 return;
- 57 image = image.scaled(graphicsView->width(),
- 58 graphicsView->height(),
- 59 Qt::KeepAspectRatio,
- 60 Qt::FastTransformation
- 61 );
- 62 /* 在添加场景内容前,先清除之前的场景内容 */
- 63 graphicsScene->clear();
- 64 /* 添加场景内容image */
- 65 graphicsScene->addPixmap(image);
- 66 /* ui窗口自带有statusBar(状态栏),设置打开的文件名 */
- 67 ui->statusbar->showMessage("文件名:" + fileName);
- 68 }
复制代码在源文件“main.cpp”具体代码如下。由新建项目时生成,无改动。 - main.cpp编程后的代码
- 1 #include "mainwindow.h"
- 2
- 3 #include <QApplication>
- 4
- 5 int main(int argc, char *argv[])
- 6 {
- 7 QApplication a(argc, argv);
- 8 MainWindow w;
- 9 w.show();
- 10 return a.exec();
- 11 }
复制代码 7.4.2.3 运行效果 程序编译运行的结果如下。菜单栏点击打开后,系统默认是打开的最近打开的位置,选择任意一个可打开的图片。(备注:本例所展示的图片已经放在工程目录下)。
file:///C:/Users/ALIENTEK/AppData/Local/Temp/msohtmlclip1/01/clip_image008.jpg
|