Qt移動應用開發（二）：使用動畫框架

Qt移動應用開發（二）：使用動畫框架

 

         上一篇博客介紹了怎樣使用Qt的QML來對屏幕分辨率大小進行適應，其實，不一樣分辨率的適應是一個很棘手的問題，除了分辨率不一樣外，寬高比（aspect ratio）也不盡一樣。

有些平板在硬件上作得和IPad同樣是Retina屏（2048×1536），有些低端的手機分辨率僅僅有320×480。這樣寬高比又不同了。因此在設計App的過程必定要對內容佈局有所規劃。採用錨佈局的方法可以幫咱們解決必定的問題，同一時候也要善用Screen類的成員來得到系統分辨率的不少其它信息。

         這篇文章主要介紹的是QtQuick的動畫框架。

Qt Quick動畫框架自從Qt4的時代就有了，當時也有很是多的demo給咱們眼前一亮。

脫胎於C++的動畫框架。Qt Quick的動畫框架絢麗並且易用。很是值得學習。

原創文章。反對未聲明的引用。原博客地址：http://blog.csdn.net/gamesdev/article/details/32730079

         首先介紹一下與動畫框架相關的幾個類:

Animation是這些類的基類。它具備這幾個屬性：

alwaysRunToEnd : bool
loops : int
paused : bool
running : bool

後三個屬性很好理解。第一個解釋一下，假設設爲true，那麼無論動畫是否結束，他都會讓動畫完畢最後一輪播放。設爲false，那麼一旦動畫結束。那麼動畫立刻結束。

Animation有很是多子類。包含AnchorAnimation、ParallelAnimation、ParentAnimation、PathAnimation、PauseAnimation、PropertyAction、PropertyAnimation、ScriptAction、和 SequentialAnimation。咱們在實際應用中。通常單個動畫會使用PropertyAnimation的子類ColorAnimation、NumberAnimation、RotationAnimation和Vector3dAnimation，如下是一個簡單的樣例：

NumberAnimation on x { from: 0;to: 100; duration: 1000 }

如上面樣例所看到的，PropertyAnimation如下的子類靈活多樣。有多種語法存在形式，常常和介詞on以及短語Behavior on連用。上面的樣例表示介詞on左邊的動畫類型必定要和右邊的屬性類型相應。假設要對一個vector3d的變量應用介詞on。那麼應該這麼寫：

Vector3dAnimation on position { from: Qt.vector3d( 0, 0, 0 ); to Qt.vector3d( 1, 1, 1 ); duration: 1000 }

Behavior on和on的差異在於Behavioron是提供了默認的動畫操做。即Behavior裏面可以描寫敘述默認的動畫：

Behavior on width
{
        NumberAnimation { duration: 1000 }
}

但多是Qt Quick動畫這一塊不無缺吧，有的時候在不一樣的平臺上表現會有所不一樣，有時Behavior不工做。有時卻又是好的（問題描寫敘述）。

當Behavior遇到了狀態轉換（transition）時，Behavior會被覆蓋。詳情請參閱Qt的相關文檔。

你們看到我製做的遊戲三個細菌和膠囊是一直從左往右移動的，並且是循環的，這裏展現一下代碼：

Image
{
         id:animateCapsule
         height:parent.width / 10
         width:height / 2
         propertyint xFrom: parent.width + height * 8
         propertyint xTo: -height * 2
         x:xFrom
         y:parent.height * 0.45
         source:"../../images/capsule.png"
 
         RotationAnimation on rotation
         {
                   from:0
                   to:360
                   loops:Animation.Infinite
                   duration:2000
         }
 
         //@桌面：請注意使用這一段代碼
         Behavioron x
         {
                   NumberAnimation
                   {
                            from:animateCapsule.xFrom
                            to:animateCapsule.xTo
                            loops:Animation.Infinite
                            duration:2000
                   }
         }
}

本文參加了CSDN博文大賽。請你們支持我，爲我投一票！