feat(CaterpillarAnimation): add style file

tests/resources.qrc

@@ -55,6 +55,7 @@
     <file>ui/modules/Common/Popup/PopupShadow.qml</file>
     <file>ui/modules/Common/qmldir</file>
     <file>ui/modules/Common/SearchBox.qml</file>
+    <file>ui/modules/Common/Styles/Animations/CaterpillarAnimationStyle.qml</file>
     <file>ui/modules/Common/Styles/CollapseStyle.qml</file>
     <file>ui/modules/Common/Styles/DialogStyle.qml</file>
     <file>ui/modules/Common/Styles/DroppableTextAreaStyle.qml</file>

tests/ui/modules/Common/Animations/CaterpillarAnimation.qml

@@ -1,13 +1,15 @@
 import QtQuick 2.7
 
+import Common.Styles 1.0
+
 Row {
   id: container
 
-  property int duration: 200
+  property color sphereColor: CaterpillarAnimationStyle.sphere.color
-  property int nSpheres: 3
+  property int animationDuration: CaterpillarAnimationStyle.animation.duration
-  property color sphereColor: '#8F8F8F'
+  property int nSpheres: CaterpillarAnimationStyle.nSpheres
-  property int sphereSize: 10
+  property int sphereSize: CaterpillarAnimationStyle.sphere.size
-  property int sphereSpaceSize: 10
+  property int animationSpace: CaterpillarAnimationStyle.animation.space
 
   spacing: 6
 
@@ -41,7 +43,7 @@ Row {
           return
         }
 
-        if (y === (sphereSpaceSize / 2) && previousY === 0) {
+        if (y === (animationSpace / 2) && previousY === 0) {
           repeater.itemAt(index + 1).startAnimation()
         }
 
@@ -56,19 +58,19 @@ Row {
       }
 
       YAnimator on y {
-        duration: container.duration
+        duration: container.animationDuration
         from: 0
         id: animator
         running: false
-        to: sphereSpaceSize / 2
+        to: animationSpace / 2
 
         onRunningChanged: {
           if (running) {
             return
           }
 
-          var mid = sphereSpaceSize / 2
+          var mid = animationSpace / 2
-          if (from === sphereSpaceSize && to === mid) {
+          if (from === animationSpace && to === mid) {
             from = mid
             to = 0
           } else if (from === mid && to === 0) {
@@ -80,9 +82,9 @@ Row {
             }
           } else if (from === 0 && to === mid) {
             from = mid
-            to = sphereSpaceSize
+            to = animationSpace
           } else {
-            from = sphereSpaceSize
+            from = animationSpace
             to = mid
           }
 

tests/ui/modules/Common/Styles/Animations/CaterpillarAnimationStyle.qml

@@ -0,0 +1,17 @@
+pragma Singleton
+import QtQuick 2.7
+
+QtObject {
+  property int nSpheres: 3
+
+  property QtObject animation: QtObject {
+    property int duration: 200
+    property int space: 10
+  }
+
+  property QtObject sphere: QtObject {
+    property color color: '#8F8F8F'
+
+    property int size: 10
+  }
+}

tests/ui/modules/Common/Styles/qmldir

@@ -3,6 +3,8 @@
 module Common.Styles
 
 # Components styles.
+singleton CaterpillarAnimationStyle 1.0 Animations/CaterpillarAnimationStyle.qml
+
 singleton CollapseStyle             1.0 CollapseStyle.qml
 singleton DialogStyle               1.0 DialogStyle.qml
 singleton DroppableTextAreaStyle    1.0 DroppableTextAreaStyle.qml