Use HRotationAnimator instead of HNumberAnimation

src/qml/Base/HButtonContent.qml

@@ -18,6 +18,57 @@ HRowLayout {
 
     Behavior on opacity { HOpacityAnimator {} }
 
+    Item {
+        id: iconWrapper
+
+        Layout.preferredWidth: icon.width
+        Layout.preferredHeight: icon.height
+
+        ParallelAnimation {
+            id: resetAnimations
+            HOpacityAnimator { target: iconWrapper; to: 1 }
+            HRotationAnimator { target: iconWrapper; to: 0 }
+        }
+
+        HOpacityAnimator {
+            id: blink
+            target: iconWrapper
+            from: 1
+            to: 0.5
+            factor: 2
+            running: button.loading || false
+            onFinished: {
+                if (button.loading) { [from, to] = [to, from]; start() }
+            }
+        }
+
+        SequentialAnimation {
+            running: button.loading || false
+            loops: Animation.Infinite
+            onStopped: resetAnimations.start()
+
+            HPauseAnimation { factor: blink.factor * 8 }
+
+            // These don't work directly on HIcon, hence why we wrap it in
+            // an Item. Qt bug? (5.13.1_1)
+            HRotationAnimator {
+                id: rotation1
+                target: iconWrapper
+                from: 0
+                to: 180
+                factor: blink.factor
+            }
+
+            HPauseAnimation { factor: blink.factor * 8 }
+
+            HRotationAnimator {
+                target: rotation1.target
+                from: rotation1.to
+                to: 360
+                factor: rotation1.factor
+                direction: RotationAnimator.Clockwise
+            }
+        }
 
         HIcon {
             property bool loading: button.loading || false
@@ -27,52 +78,8 @@ HRowLayout {
             colorize: enabled ? button.icon.color: theme.icons.disabledColorize
             cache: button.icon.cache
 
-        onLoadingChanged: if (! loading) resetAnimations.start()
-
             Layout.fillHeight: true
             Layout.alignment: Qt.AlignCenter
-
-
-        ParallelAnimation {
-            id: resetAnimations
-            HOpacityAnimator { target: icon; to: 1 }
-            HNumberAnimation { target: icon; property: "rotation"; to: 0 }
-        }
-
-
-        HNumberAnimation on opacity {
-            id: blink
-            from: 1
-            to: 0.5
-            factor: 2
-            running: button.loading || false
-            onFinished: { [from, to] = [to, from]; start() }
-        }
-
-        SequentialAnimation {
-            running: button.loading || false
-            loops: Animation.Infinite
-
-            HPauseAnimation { factor: blink.factor * 8 }
-
-            HNumberAnimation {
-                id: rotation1
-                target: icon
-                property: "rotation"
-                from: 0
-                to: 180
-                factor: blink.factor
-            }
-
-            HPauseAnimation { factor: blink.factor * 8 }
-
-            HNumberAnimation {
-                target: rotation1.target
-                property: rotation1.property
-                from: rotation1.to
-                to: 360
-                factor: rotation1.factor
-            }
         }
     }
 

src/qml/Base/HRotationAnimator.qml

@@ -0,0 +1,7 @@
+import QtQuick 2.12
+
+RotationAnimator {
+    duration: theme.animationDuration * factor
+
+    property real factor: 1.0
+}