KS09-06 为应用程序添加启动画面(QSplashScreen)

baizy77

版权声明

---------------------------------------------------------------------------------------------------------------------

该文章原创于Qter开源社区（www.qter.org）

作者： 女儿叫老白

转载请注明出处！

---------------------------------------------------------------------------------------------------------------------

课程目录: 【独家连载】《Qt入门与提高-GUI产品开发》目录

网页版课程源码 提取码：1uy7

引言

------------------------------------------------------------------------------------

大型的应用程序启动一般都比较耗时，为了不降低用户体验，大型应用一般都有启动画面。而且，启动画面上一般会显示进度：比如用文本或进度条指示进度。本节将介绍带进度条的启动画面的开发方法。

正文

------------------------------------------------------------------------------------

如果单纯展示一个启动画面，可以直接使用QSplashScreen；但是如果还要提供进度条，那么QSplashScreen就不满足需求了，需要我们自行实现。图09-06-01是程序运行效果图。

我们以src.baseline中的代码为基础，为其添加启动界面。

首先，我们要编写自己的CSplashScreen类

    CSpahsScreen派生自QSplashScreen。代码如下：

代码清单09-06-01

splashscreen.h

1. #pragma once
   
2. 
   
3. #include <QSplashScreen>
   
4. 
   
5. QT_BEGIN_NAMESPACE
   
6. class QProgressBar;
   
7. QT_END_NAMESPACE
   
8. 
   
9. class CSplashScreen : public QSplashScreen
   
10. {
    
11.         Q_OBJECT
    
12. public:
    
13.     CSplashScreen(const QPixmap &pixmap = QPixmap());
    
14.         ~CSplashScreen(){;}
    
15. 
    
16. public Q_SLOTS:
    
17.     void setProgress(quint32);
    
18. 
    
19. private:
    
20.     //进度条
    
21.     QProgressBar * m_pProgressBar;
    
22. };
    

复制代码

    在代码清单09-06-01中，我们提供了CSplashScreen类定义。该类派生自QSplashScreen。我们提供了一个构造函数，该构造函数接受一个const QPixmap&参数。

    在第21行，我们为该类提供了一个QProgressBar*进度条对象用来展示进度。

    在第17行，我们为该类提供一个槽函数setProgress(quint32)。大家可以看到，它接受一个quint32类型的数据。我们用这个数据来更新m_pProgressBar的进度值。

    下面看一下CSplashScreen的实现。

代码清单09-06-02

splashscreen.cpp

1. #include "splashscreen.h"
   
2. #include <QProgressBar>
   
3. CSplashScreen::CSplashScreen(const QPixmap &pixmap) :
   
4.     QSplashScreen(pixmap)
   
5. {
   
6.     m_pProgressBar = new QProgressBar(this);
   
7.    
   
8.     //设置进度条的位置
   
9.     m_pProgressBar->setGeometry(0,
   
10.                                 pixmap.height() - 50,
    
11.                                 pixmap.width(),
    
12.                                 30);
    
13.     //设置进度条的样式
    
14.     m_pProgressBar->setStyleSheet(  
    
15.         "QProgressBar {color:black;font:30px;text-align:center; } \
    
16.          QProgressBar::chunk {background-color: rgb(200, 160, 16);}");
    
17.    
    
18.     //设置进度条的范围
    
19.     m_pProgressBar->setRange(0, 100);
    
20.    
    
21.     //设置进度条的当前进度
    
22.     m_pProgressBar->setValue(0);
    
23. }
    
24. 
    
25. void CSplashScreen::setProgress(quint32 value)
    
26. {
    
27.     m_pProgressBar->setValue(value%101);
    
28. }
    

复制代码

    在代码清单09-06-02中，我们提供了CSplashScreen的实现。

    在构造函数中，在第6行，我们构建了进度条对象m_pProgressBar。

    在第9~12行，我们设置了进度条的位置、尺寸。这里我们借用了启动图片的宽度和高度数据。

    为了让进度条更加美观，在第14~16行为进度条对象设置样式。读者可以根据需要自行调整、修改样式数据。

    第19~22行设置了进度条的范围、默认值。

    第25~28行提供了进度条的槽函数实现。该槽函数用来接收主窗口发出的进度信号中带的进度数据，以便更新进度条位置。

然后，修改主窗口，为它添加进度信号以及connect信号槽的代码

    先为主窗口增加位置信号和槽函数。

代码清单09-06-03

mainwindow.h

1. class CMainWindow : public QMainWindow
   
2. {
   
3.         Q_OBJECT
   
4. public:
   
5.         CMainWindow(QWidget* parent, CSplashScreen* pSplashScreen);
   
6.         ~CMainWindow(){;}
   
7. 
   
8.     void readData(); // 模拟构造过程中的耗时操作
   
9. 
   
10. Q_SIGNALS:
    
11. void progress(quint32);
    
12. // ......
    
13. };
    

复制代码

    在代码清单09-06-03中，只列出了修改的内容。

    第5行，为构造函数增加了一个参数，用来传入CSplashScreen对象。可能有人有疑问：为何不提供接口来设置该对象呢？原因很简单，我们的目的是在CMainWindow构造(比较耗时)的过程中，展示启动进度，如果在CMainWindow构造完成后再去调用接口传入CSplashScreen对象来更新进度条就已经晚了。如果您的应用程序的启动过程的时间主要花费在其他地方，那么就可以在耗费时间的地方去发送信号更新进度条状态。本节只是以CMainWindow构造比较耗时为例进行演示。

    第8行的readData()接口用来模拟构造过程中的耗时操作。以便在该接口中发出信号更新进度条。

    第11行的progress(quint32)信号就是我们为主窗口新增的信号。该信号用来通知CSplashScreen更新进度条。具体在CMainWindow的构造函数的实现代码中解释。

    下面看一下CMainWindow的实现代码。

代码清单09-06-04

mainwindow.cpp

1. #include "splashscreen.h"
   
2. CMainWindow::CMainWindow(QWidget* parent, CSplashScreen* pSplashScreen) : QMainWindow(parent)
   
3. {
   
4.     connect(this,
   
5.         &CMainWindow::progress,
   
6.         pSplashScreen,
   
7.         &CSplashScreen::setProgress);
   
8. 
   
9.     // 模拟耗时操作
   
10.     QThread::sleep(1);
    
11.     emit progress(10);
    
12.    
    
13.     createActions();
    
14.         createMenus();
    
15.         createToolBars();
    
16.         createStatusBar();
    
17. 
    
18.         initialize();
    
19. 
    
20.         setWindowTitle(tr("Demo"));
    
21.         setMinimumSize(160, 160);
    
22.         resize(480, 320);   
    
23. }
    

复制代码

    在代码清单09-06-04中，我们对CMainWindow的构造函数进行了修改(见粗体斜体部分的代码)。

    我们现在第5~8行将该类的progress信号绑定到传入的CSplashScreen对象的setProgress槽函数。请注意，设计的信号和槽函数的参数列表务必保持一致。

    第11~12行模拟了一次耗时操作，方法是调用QThread::sleep(1)，导致的结果是睡眠1秒。然后发出progress信号，信号中传输的值为10。这样就会更新进度条的进度值为10。具体可以查看CSplashScreen::setProgress()接口的实现。

    代码清单09-06-05

CMainWindow::initialize()

1. void CMainWindow::initialize()
   
2. {
   
3.     // ......
   
4.     readData();
   
5. 
   
6. }
   

复制代码

    在代码清单09-06-05中，我们把模拟耗时操作的接口readData()添加到initialize()中调用。

    最后来看一下模拟耗时操作接口readData()的实现。

    代码清单09-06-06

CMainWindow:: readData ()

1. void CMainWindow::readData()
   
2. {
   
3. 
   
4.     QThread::sleep(1);
   
5.     emit progress(30);
   
6. 
   
7.     QThread::sleep(1);
   
8.     emit progress(50);
   
9. 
   
10.     QThread::sleep(1);
    
11.     emit progress(70);
    
12. 
    
13.     QThread::sleep(1);
    
14.     emit progress(100);
    
15. 
    
16. }
    

复制代码

    从代码清单09-06-06可以看出，我们的模拟耗时操作接口readData()其实非常简单，就是通过QThread::sleep()接口进行睡眠然后发出更新进度条状态的信号progress()。

最后，在main()函数为应用程序中添加启动画面

    代码清单09-06-07

main.cpp

1. #include <QApplication>
   
2. #include <QTranslator>
   
3. #include <QLibraryInfo>
   
4. #include <QFile>
   
5. #include <QPixmap>
   
6. #include <QTextEdit>
   
7. #include <QTextStream>
   
8. #include "mainwindow.h"
   
9. #include "splashscreen.h"
   
10. 
    
11. int main(int argc, char * argv[])
    
12. {
    
13.     QApplication app(argc, argv);
    
14.         // ......
    
15.     QPixmap pixmap(":images/logo.png");
    
16.     CSplashScreen splashScreen(pixmap);
    
17.     splashScreen.show();
    
18. app.processEvents();         // 保证显示启动画面的同时仍可以正
    
19.                              //   常响应鼠标、键盘等操作
    
20. 
    
21.         CMainWindow mainWindow(NULL, &splashScreen);   
    
22.     splashScreen.finish(&mainWindow);   // 等待主窗口初始化完毕，然后隐藏splashScreen
    
23.         mainWindow.showMaximized();
    
24. 
    
25.     return app.exec();
    
26. }
    

复制代码

在代码清单09-06-07中：

    第15~17行构造CSplashScreen对象并将其显示出来，请注意第15行中image文件的路径语法；

    第18行的app.processEvents()目的是为了保证显示启动画面的同时仍可以正常响应鼠标、键盘等操作；

    第21行，在构造CMainWindow对象时传入了splashScreen对象地址，以便在构造函数中绑定信号槽；

    第22行的调用目的是在mianWindow构造函数执行完毕后隐藏splashScreen。

    为应用程序添加启动画面的方法介绍完毕。

结语

------------------------------------------------------------------------------------

本文介绍了为应用程序添加启动界面的方法。其实，对不同的应用程序来说它的启动过程中的耗时操作可能不一定跟本节课demo的场景完全相同，但是处理思路是一致的：就是在耗时操作过程中不断的发出更新进度的信号以便自定义的CSplashScreen对象在接收到信号后更新进度条的进度。