summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorDan Leinir Turthra Jensen <[email protected]>2017-03-23 10:25:26 +0000
committerDan Leinir Turthra Jensen <[email protected]>2017-03-27 13:33:25 +0100
commit73b61fcdf1408871de85d60c7341e283194b92c6 (patch)
treec436caaa85c8e5589d79932baff2f4aec507ec45
parentbdccef045c12790c30648cb5de0096ab443325a4 (diff)
Implement UI feedback for long-running searches, and no-results
If a search takes longer than a couple of seconds, a spinner will face-and-slide in from the bottom of the view. If it then takes a while longer, a text saying "Still looking" will fade in very slowly. If the search is near-instant (the general case), the spinner does not show up.
-rw-r--r--discover/qml/ApplicationsListPage.qml71
1 files changed, 71 insertions, 0 deletions
diff --git a/discover/qml/ApplicationsListPage.qml b/discover/qml/ApplicationsListPage.qml
index f408758..8a984dd 100644
--- a/discover/qml/ApplicationsListPage.qml
+++ b/discover/qml/ApplicationsListPage.qml
@@ -78,5 +78,76 @@ DiscoverPage {
application: model.application
compact: page.compact
}
+
+ Kirigami.Label {
+ anchors.centerIn: parent
+ opacity: apps.count == 0 && !appsModel.isBusy ? 0.3 : 0
+ Behavior on opacity { PropertyAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad; } }
+ text: i18n("Sorry, nothing found...")
+ }
+
+ BusyIndicator {
+ id: busyIndicator
+ anchors {
+ top: parent.bottom
+ horizontalCenter: parent.horizontalCenter
+ margins: Kirigami.Units.largeSpacing
+ }
+ running: false
+ opacity: 0
+ states: [
+ State {
+ name: "running";
+ when: appsModel.isBusy
+ PropertyChanges { target: busyIndicator; opacity: 1; running: true; }
+ AnchorChanges { target: busyIndicator; anchors.bottom: parent.bottom; anchors.top: undefined; }
+ }
+ ]
+ transitions: [
+ Transition {
+ from: ""
+ to: "running"
+ SequentialAnimation {
+ PauseAnimation { duration: Kirigami.Units.longDuration * 5; }
+ ParallelAnimation {
+ AnchorAnimation { duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad; }
+ PropertyAnimation { property: "opacity"; duration: Kirigami.Units.longDuration; easing.type: Easing.InOutQuad; }
+ }
+ }
+ },
+ Transition {
+ from: "running"
+ to: ""
+ ParallelAnimation {
+ AnchorAnimation { duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad; }
+ PropertyAnimation { property: "opacity"; duration: Kirigami.Units.shortDuration; easing.type: Easing.InOutQuad; }
+ }
+ }
+ ]
+ Kirigami.Label {
+ id: busyLabel
+ anchors {
+ horizontalCenter: parent.horizontalCenter
+ bottom: parent.top
+ }
+ text: i18n("Still looking...")
+ opacity: 0
+ states: [
+ State {
+ name: "running";
+ when: busyIndicator.opacity === 1;
+ PropertyChanges { target: busyLabel; opacity: 1; }
+ }
+ ]
+ transitions: Transition {
+ from: ""
+ to: "running"
+ SequentialAnimation {
+ PauseAnimation { duration: Kirigami.Units.longDuration * 5; }
+ PropertyAnimation { property: "opacity"; duration: Kirigami.Units.longDuration * 10; easing.type: Easing.InOutCubic; }
+ }
+ }
+ }
+ }
}
}