diff --git a/src/qml/FeedListDelegate.qml b/src/qml/FeedListDelegate.qml index 0d444dda..2402d45b 100644 --- a/src/qml/FeedListDelegate.qml +++ b/src/qml/FeedListDelegate.qml @@ -59,6 +59,7 @@ Controls.ItemDelegate { anchors.fill: parent imageSource: feed.cachedImage imageTitle: feed.name + isLoading: feed.refreshing } Rectangle { @@ -69,7 +70,6 @@ Controls.ItemDelegate { width: actionsButton.width height: actionsButton.height color: Kirigami.Theme.highlightColor - opacity: 0.8 radius: Kirigami.Units.smallSpacing - 2 * borderWidth } diff --git a/src/qml/ImageWithFallback.qml b/src/qml/ImageWithFallback.qml index 25d2bb9f..229febdf 100644 --- a/src/qml/ImageWithFallback.qml +++ b/src/qml/ImageWithFallback.qml @@ -20,12 +20,14 @@ Item { property int absoluteRadius: 0 property real fractionalRadius: 0.0 property string imageTitle: "" + property bool isLoading: false Loader { + //active: !isLoading id: imageLoader anchors.fill: parent asynchronous: true - sourceComponent: imageSource === "no-image" ? fallbackImg : (imageSource === "" ? fallbackImg : realImg ) + sourceComponent: imageSource === "no-image" ? fallbackImg : (imageSource === "" ? loaderSymbol : realImg ) opacity: root.imageOpacity layer.enabled: (root.absoluteRadius > 0 || root.fractionalRadius > 0) layer.effect: OpacityMask { @@ -84,7 +86,7 @@ Item { anchors.right: parent.right padding: 10 text: root.imageTitle - level: 2 + level: 3 color: "white" wrapMode: Text.Wrap elide: Text.ElideRight @@ -99,4 +101,28 @@ Item { } } } + + Component { + id: loaderSymbol + Item { + anchors.fill: parent + Rectangle { + color: "white" + opacity: 0.5 + anchors.fill: parent + } + Controls.BusyIndicator { + anchors.centerIn: parent + width: parent.width / 2 + height: parent.height / 2 + } + } + } + + Loader { + active: isLoading + sourceComponent: loaderSymbol + anchors.fill: parent + //anchors.centerIn: parent + } }