Qt動畫架構(gòu)中的主要類

• Qt動畫架構(gòu)中的主要類如下圖所示：

    動畫框架由基類QAbstractAnimation和它的兩個兒子QVariantAnimation和QAnimationGroup組成。QAbstractAnimation是所有動畫類的祖宗。它包含了所有動畫的基本屬性。比如開始，停止和暫停一個動畫的能力。它也可以接收時間改變通知。

    動畫框架又進(jìn)一步提供了QProertyAnimation類。它繼承自QVariantAnimation并對某個Qt屬性（它須是Qt的”元數(shù)據(jù)對象系統(tǒng)”的一部分，見http://blog.csdn.net/nkmnkm/article/details/8225089）執(zhí)行動畫。此類對屬性執(zhí)行一個寬松曲線插值。所以當(dāng)你想去動畫一個值時，你可以把它聲明為一個屬性，并且讓你的類成為一個QObject。這給予我們極大的自由度來動畫那些已存在的widget和其它QObject。

    復(fù)雜的動畫可以通過建立一個QAbstractAnimation的樹來構(gòu)建。這個樹通過使用QAnimationGroups來創(chuàng)建，QAnimationGroups作為其它動畫的容器。注意動畫組也是從QAbstractAnimation派生的，所以動畫組可以再包含其它動畫組。

    動畫框架可以單獨使用，同時也被設(shè)計為狀態(tài)機(jī)框架的一部分。狀態(tài)機(jī)提供了一個特定的狀態(tài)可以用來播放動畫。在進(jìn)入或退出某個狀態(tài)時QState也可以設(shè)置屬性們，并且這個特定的動畫狀態(tài)將在指定QPropertyAnimation時給予的值之間做插值運算。后面我們要進(jìn)一步介紹此問題。

    在場景的背后，動畫被一個全局定時器收集，這個定時器發(fā)送update到所有的正在播放的動畫中。

• 動畫框架中的類們

QAbstractAnimation 所有動畫類的基類   

QAnimationGroup 動畫組的基類   

QEasingCurve 控制動畫的寬松曲線類   

QParallelAnimationGroup 并行動畫組類  

QPauseAnimation 串行動畫組類的暫停類  

QPropertyAnimation 動畫Qt屬性的類 

QSequentialAnimationGroup 串行動畫組類   

QTimeLine 控制動畫的時間線類   

QVariantAnimation 各動畫類的虛基類

• 動畫Qt屬性們

    如前面所講，QPropertyAnimation類可以修改Qt屬性們。要動畫一個值，就需要使用此類。實際上，它的父類，QVariantAnimation，是一個虛擬類，不能被直接使用。

    1、我們選擇動畫Qt屬性的一個主要理由是Qt屬性為我們提供了自己動畫已存在的類的自由度。尤其是QWidget類（我們也可以把它嵌入到一個QGraphicsView中）具有很多屬性表示其bounds,colors等等。讓我們看一個小例子：

QPushButton button("Animated Button");  

button.show();  

QPropertyAnimation animation(&button, "geometry");  

animation.setDuration(10000);  

animation.setStartValue(QRect(0, 0, 0, 0));  

animation.setEndValue(QRect(250, 250, 100, 30));  

animation.start();  

    這段代碼將把按鈕在10秒種內(nèi)從屏幕的左上角移動到(250,250)處，而且是逐漸變大。見下圖效果：

    2、上面的例子舉在開始值和結(jié)束值之間做線性插值。還可以在開始和結(jié)束值之間設(shè)置值，插值運算就會經(jīng)過這些點。

animation1 = new QPropertyAnimation(ui.pushButton, "geometry");   

animation1->setDuration(10000);  

animation1->setKeyValueAt(0, QRect(0, 0, 00, 00));  

animation1->setKeyValueAt(0.4, QRect(20, 250, 20, 30));  

animation1->setKeyValueAt(0.8, QRect(100, 250, 20, 30));  

animation1->setKeyValueAt(1, QRect(250, 250, 100, 30));  

animation1->setEndValue(QRect(250, 250, 100, 30));  

    在此例中，動畫將按鈕在8秒中內(nèi)弄到(250,250)處，然后在2秒種內(nèi)又弄回原位。移位是在這些點中間以線性插值進(jìn)行的。

    3、你也有可能動畫一個QObject的值，雖然這些值并沒有被聲明為Qt屬性。唯一的要求就是這個值具有一個setter。之后你可以從這個類派生子類從而包含這些值并且聲明一個使用這個setter的屬性。注意每個Qt屬性都需要有一個getter，所以你需要提供一個getter，如果它不存在的話。

class MyGraphicsRectItem : public QObject, public QGraphicsRectItem  

{  

    Q_OBJECT  

    Q_PROPERTY(QRectF geometry READ geometry WRITE setGeometry)  

};  

    在上例中，我們派生了QGraphicsRectItem并定義了一個geometry屬性。我們現(xiàn)在可以動畫這個widget的geometry了，即使QGraphicsRectItem沒有提供geometry屬性。

• 動畫和圖形視圖框架

    當(dāng)你想動畫QGraphicsItems，你也要用QPropertyAnimation。然而，QGraphicsItem不是從QObject派生的。一個好的解決方案是派生要動畫的圖形item。派生類也要從QObject派生。這樣，QPropertyAnimation就可以被用于QGraphicsItems了。

class Pixmap : public QObject, public QGraphicsPixmapItem  

{  

    Q_OBJECT  

    Q_PROPERTY(QPointF pos READ pos WRITE setPos)  

    ...  

    就如上一節(jié)中所講的，我們需要定義希望去動畫的屬性。

    注意：QObject必須是繼承中的第一個，因為元數(shù)據(jù)對象系統(tǒng)需要這樣做。

• 寬松曲線

    QPropertyAnimation在屬性的開始值和結(jié)束值之間執(zhí)行一個插值運算。除了向動畫添加更多的關(guān)鍵值外，你還可以使用一個寬松曲線。寬松曲線描述了一個在0和1之間插值的速度變化的函數(shù)，如果你想控制一個動畫的速度而不改變插值的路徑時，就非常有用。

animation1 = new QPropertyAnimation(ui.pushButton, "geometry");   

animation1->setDuration(10000);  

animation1->setStartValue(QRect(0, 0, 0, 0));  

animation1->setEndValue(QRect(250, 250, 100, 30));  

animation1->setEasingCurve(QEasingCurve::OutBounce);  

     這里，動畫將按照一個曲線進(jìn)行，這個曲線使得動畫像一個跳動的皮球從開始位置跳到結(jié)束位置。QEasingCurve具有一個大曲線集合，你可以從里面選擇一個。它們被定義為QEasingCurve::Type枚舉。如果你需要不一樣的曲線，你也可以自己實現(xiàn)一個，然后注冊到QEasingCurve。

•  錯誤1：QPropertyAnimation: you're trying to animate a non-existing property 屬性窗口

解釋：

animation1 = new QPropertyAnimation(ui.pushButton, "geometry");

    估計是你給的屬性名字（propertyName）是錯誤的,必須是qt自帶的屬性名字，或者你通過自定義實現(xiàn)的名字。

    我要是把代碼寫成：

animation1 = new QPropertyAnimation(ui.pushButton, "geometry23");

    會提示如下錯誤，找不到屬性geometry23

QPropertyAnimation: you're trying to animate a non-existing property setGeometry23 of your QObjec