a custom loading indicator

This commit is contained in:
Chris Cochrun 2024-04-12 06:32:35 -05:00
parent 2428792895
commit 402bc08d52
2 changed files with 20 additions and 29 deletions

View file

@ -8,7 +8,7 @@ import "./" as Presenter
Controls.BusyIndicator { Controls.BusyIndicator {
id: root id: root
property color color property color color
visible: true visible: root.running
contentItem: Item { contentItem: Item {
implicitWidth: 64 implicitWidth: 64
@ -30,7 +30,7 @@ Controls.BusyIndicator {
Repeater { Repeater {
id: repeater id: repeater
model: 1 model: 4
Rectangle { Rectangle {
id: delegate id: delegate
@ -38,41 +38,32 @@ Controls.BusyIndicator {
x: item.width / 2 - width / 2 x: item.width / 2 - width / 2
y: item.height / 2 - height / 2 y: item.height / 2 - height / 2
implicitWidth: root.width height: width
implicitHeight: root.width
radius: 500 radius: 500
color: root.color color: root.color
opacity: delegate.scale
/* visible: root.visible */
/* Text { */
/* text: delegate.scale + " & " + delegate.opacity */
/* } */
PropertyAnimation { PropertyAnimation {
target: delegate target: delegate
property: "scale" property: "width"
running: root.visible && root.running running: root.running
from: 0 from: 0 - (index * 100)
to: 1 to: root.width * 1.8
loops: Animation.Infinite loops: Animation.Infinite
duration: 500 * index duration: 1400
easing.type: Easing.OutInExpo easing.type: Easing.InSine
easing.amplitude: 2.0
} }
/* transform: [ */ PropertyAnimation {
/* Translate { */ target: delegate
/* y: -Math.min(item.width, item.height) * 0.5 */ property: "opacity"
/* x: index */ running: root.running
/* }, */ from: 1
/* Rotation { */ to: 0
/* angle: delegate.index / repeater.count * 360 */ loops: Animation.Infinite
/* origin.x: 5 */ duration: 1400
/* origin.y: 5 */ easing.type: Easing.InSine
/* } */ }
/* ] */
} }
} }
} }

View file

@ -45,7 +45,7 @@ Item {
Presenter.LoadingSpinner { Presenter.LoadingSpinner {
id: loadingSpinner id: loadingSpinner
color: Kirigami.Theme.highlightColor color: Kirigami.Theme.highlightColor
running: true running: itemType === "video" && imageSource.length() < 1
anchors.fill: parent anchors.fill: parent
} }