app/resources/qml/components/ConnectionIcon.qml

import QtQuick 2.6

Image {
    id: logo
    property var status

    source: "qrc:/graphics/icons/buzzer_black.png"
    mipmap: true

    opacity: status === "connected" || status === "connecting" ? 1:0
    visible: true

    width: height
    onOpacityChanged: visible = true

    SequentialAnimation {
        //rotating animation
        running: status === "connecting"
        loops: Animation.Infinite
        onStopped: {
            logo.rotation = 0
        }

        NumberAnimation {
            target: logo
            property: "rotation"
            duration: 1300
            from: 0
            to: 360
            easing.type: Easing.InOutQuad
        }
    }

    Behavior on rotation {
        NumberAnimation {
            duration: 200
            easing.type: Easing.OutQuad
        }
    }

    Behavior on opacity {
        NumberAnimation {
            duration: 200
            easing.type: Easing.OutQuad
        }
    }
}