Qt 等待提示框（QPropertyAnimation）

效果

　　由于录制程序的原因，引起gif效果不清晰，可忽略。

资源

　　需要几张不同阶段的图标进行切换，这里使用8张。

源码

　　QPropertyAnimation动画里面并不支持旋转的属性，所以我们可以通过自定义来完成。

 1 class MainWindow : public CustomWindow
 2 {
 3     Q_OBJECT
 4     // 声明属性
 5     Q_PROPERTY(int pixmap READ pixmap WRITE setPixmap)
 6 
 7 public:
 8     explicit MainWindow(QWidget *parent = 0);
 9     ~MainWindow();
10     // 开始动画
11     void startAnimation();
12     // 停止动画
13     void stopAnimation();
14 
15 private:
16     int pixmap() const;
17     // 切换图标
18     void setPixmap(const int index);
19 
20 private:
21     QLabel *m_pLoadingLabel;
22     QPropertyAnimation *m_pAnimation;
23     int m_nIndex;
24 };

 1 m_pAnimation = new QPropertyAnimation(this, "pixmap");
 2 m_pAnimation->setDuration(1000);
 3 // 永远运行，直到stop
 4 m_pAnimation->setLoopCount(-1); 
 5 
 6 // 设置动画各区间的值
 7 for (int i = 0; i < 8; ++i)
 8 {
 9     m_pAnimation->setKeyValueAt(i/7.0, i + 1);
10 }
11 
12 // 开始动画
13 startAnimation();

 1 void MainWindow::startAnimation()
 2 {
 3     m_pAnimation->start();
 4 }
 5 
 6 void MainWindow::stopAnimation()
 7 {
 8     m_pAnimation->stop();
 9 }
10 
11 int MainWindow::pixmap() const
12 {
13     return m_nIndex;
14 }
15 
16 void MainWindow::setPixmap(const int index)
17 {
18     m_nIndex = index;
19 
20     QPixmap pixmap(QString(":/Images/loading%1").arg(index));
21     m_pLoadingLabel->setPixmap(pixmap);
22 }

分析
　　首先我们通过Q_PROPERTY来声明属性，这样我们就可以在QPropertyAnimation动画中使用了，然后通过设置动画的时长、运行次数、各个区间的值达到切换图标的效果，然后动画就可以很流畅的实现了。因为这里存在8张图标，所以通过setKeyValueAt(i/7.0, i + 1)来设置各区间范围。

衍伸
　　上面我们使用了8张图标进行切换，另外一种方式-只使用一张，然后进行图标旋转。

 1 // 设置动画各区间的值
 2 for (int i = 0; i <= 10; ++i)
 3 {
 4     m_pAnimation->setKeyValueAt(i / 10.0, i);
 5 }
 6 
 7 void MainWindow::setPixmap(const int index)
 8 {
 9     m_nIndex = index;
10     
11     // 图标旋转
12     QMatrix leftmatrix;
13     leftmatrix.rotate((360.0 / 10) * index);
14 
15     QPixmap pixmap(QString(":/Images/loading1"));
16     QPixmap pix = pixmap.transformed(leftmatrix, Qt::SmoothTransformation);
17     m_pLoadingLabel->setPixmap(pix);
18 }

　　这里虽然只用了一张图片，但是存在一个问题，因为图片是28*28的，旋转角度如果不是90度的整数，那么，旋转后图片肯定会进行缩放，这时可能会造成上下跳动的情况，所以我们需要将图标固定到一个固定大小的控件里面，防止此情况的发生。