import QtQuick import "../skin-bank.js" as SkinBank Item { property string source: "" property int currentFrame: 0 property alias interval: timer.interval property int loadedFrameCount: 0 property bool autoStart: false property bool loop: false property bool keepAtStop: false signal loaded() signal started() signal finished() id: root width: childrenRect.width height: childrenRect.height property string folder: source property int fileModel Repeater { id: frames model: fileModel Image { source: root.source + "/" + index visible: false onStatusChanged: { if (status == Image.Ready) { loadedFrameCount++; if (loadedFrameCount == fileModel) root.loaded(); } } } } onLoaded: { if (autoStart) { root.started(); timer.start(); } } Timer { id: timer interval: 50 repeat: true onTriggered: { if (currentFrame >= fileModel) { if (!keepAtStop) { frames.itemAt(fileModel - 1).visible = false; } if (loop) { currentFrame = 0; } else { timer.stop(); root.finished(); return; } } if (currentFrame > 0) frames.itemAt(currentFrame - 1).visible = false; frames.itemAt(currentFrame).visible = true; currentFrame++; } } function start() { if (loadedFrameCount == fileModel) { root.started(); timer.start(); } else { root.loaded.connect(() => { root.started(); timer.start(); }); } } function stop() { timer.stop(); } Component.onCompleted: { fileModel = Backend.ls(folder).length; } }