on xenial help sign in
Refactor dash activity indicator. Fixes: 1351539
commitc853a12e9ef4977704f8b388dbc70d116cdb9441 authorMichał Sawicz <michal.sawicz@canonical.com> dateWed 6 Aug 2014, 19:39 (12 years ago) parent4dcf40a737e6c0
12 files changed+146−94
plugins/Dash/ScopeStyle.qml+11−8 qml/Components/PageHeader.qml+1−14 qml/Dash/Dash.qml+68−1 qml/Dash/DashContent.qml+2 qml/Dash/DashNavigationList.qml−5 qml/Dash/GenericScopeView.qml+2−1 qml/Dash/PreviewListView.qml+23−27 tests/autopilot/unity8/shell/emulators/dash.py+1−1 tests/plugins/Dash/tst_ScopeStyle.qml+14−7 tests/qmltests/Components/tst_PageHeader.qml−23 tests/qmltests/Dash/tst_Dash.qml+23−6 tests/qmltests/Dash/tst_GenericScopeView.qml+1−1
plugins/Dash/ScopeStyle.qml+11−8
@@ -38,14 +38,20 @@ QtObject {
3838 /// Color used for text and symbolic icons
3939 readonly property color foreground: "foreground-color" in style ? style["foreground-color"] : d.defaultDark
4040
41+ /// Luminance of the foreground color
42+ readonly property real foregroundLuminance: foreground ? luminance(foreground) : d.defaultForegroundLuminance
43+
4144 /// Color used for the overall background
4245 readonly property color background: "background-color" in style ? style["background-color"] : "transparent"
4346
47+ /// Luminance of the foreground color
48+ readonly property real backgroundLuminance: background ? luminance(background) : d.defaultBackgroundLuminance
49+
4450 /*! \brief Luminance threshold for switching between fore and background color
4551
4652 \note If background colour is not fully opaque, it's not taken into account.
4753 */
48− readonly property real threshold: background.a !== 1.0 ? d.foregroundLuminance : (d.foregroundLuminance + d.backgroundLuminance) / 2
54+ readonly property real threshold: background.a !== 1.0 ? foregroundLuminance : (foregroundLuminance + backgroundLuminance) / 2
4955
5056 /*! \brief The lighter of foreground and background colors
5157
@@ -53,8 +59,8 @@ QtObject {
5359 and defaults to the theme-provided light color.
5460 */
5561 readonly property color light: {
56− if (background.a !== 1.0) return d.foregroundLuminance > d.defaultLightLuminance ? foreground : d.defaultLight;
57− return d.foregroundLuminance > d.backgroundLuminance ? foreground : background;
62+ if (background.a !== 1.0) return foregroundLuminance > d.defaultLightLuminance ? foreground : d.defaultLight;
63+ return foregroundLuminance > backgroundLuminance ? foreground : background;
5864 }
5965
6066 /*! \brief The darker of foreground and background colors
@@ -63,8 +69,8 @@ QtObject {
6369 and defaults to the theme-provided dark color.
6470 */
6571 readonly property color dark: {
66− if (background.a !== 1.0) return d.foregroundLuminance < d.defaultDarkLuminance ? foreground : d.defaultDark;
67− return d.foregroundLuminance < d.backgroundLuminance ? foreground : background;
72+ if (background.a !== 1.0) return foregroundLuminance < d.defaultDarkLuminance ? foreground : d.defaultDark;
73+ return foregroundLuminance < backgroundLuminance ? foreground : background;
6874 }
6975
7076 /// Source of the logo image for the header
@@ -78,9 +84,6 @@ QtObject {
7884
7985 //! @cond
8086 property var d: QtObject {
81− readonly property real foregroundLuminance: luminance(foreground)
82− readonly property real backgroundLuminance: luminance(background)
83−
8487 // FIXME: should be taken from the theme
8588 readonly property color defaultLight: "white"
8689 readonly property color defaultDark: "grey"
qml/Components/PageHeader.qml+1−14
@@ -32,7 +32,6 @@ Item {
3232 property bool searchEntryEnabled: false
3333 property ListModel searchHistory: SearchHistoryModel
3434 property alias searchQuery: searchTextField.text
35− property bool searchInProgress: false
3635
3736 property alias bottomItem: bottomContainer.children
3837 property int paginationCount: 0
@@ -203,25 +202,13 @@ Item {
203202 anchors.fill: parent
204203 anchors.margins: units.gu(.75)
205204 source: "image://theme/clear"
206− opacity: searchTextField.text.length > 0 && !searchActivityIndicator.running
205+ opacity: searchTextField.text.length > 0
207206 visible: opacity > 0
208207 Behavior on opacity {
209208 UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration }
210209 }
211210 }
212211
213− ActivityIndicator {
214− id: searchActivityIndicator
215− objectName: "searchIndicator"
216− anchors.fill: parent
217− anchors.margins: units.gu(.75)
218− running: root.searchInProgress
219− opacity: running ? 1 : 0
220− Behavior on opacity {
221− UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration }
222− }
223− }
224−
225212 onClicked: {
226213 root.resetSearch(true);
227214 root.openSearchHistory();
qml/Dash/Dash.qml+68−1
@@ -14,7 +14,7 @@
1414 * along with this program. If not, see <http://www.gnu.org/licenses/>.
1515 */
1616
17−import QtQuick 2.0
17+import QtQuick 2.2
1818import Ubuntu.Components 0.1
1919import Unity 0.2
2020import Utils 0.1
@@ -140,4 +140,71 @@ Showable {
140140 }
141141 }
142142 }
143+
144+ Rectangle {
145+ id: indicator
146+ objectName: "processingIndicator"
147+ anchors {
148+ left: parent.left
149+ right: parent.right
150+ bottom: parent.bottom
151+ }
152+ height: units.dp(3)
153+ color: scopeStyle.backgroundLuminance > 0.7 ? "#50000000" : "#50ffffff"
154+ opacity: 0
155+ visible: opacity > 0
156+
157+ readonly property bool processing: dashContent.processing || scopeItem.processing
158+
159+ Behavior on opacity {
160+ UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration }
161+ }
162+
163+ onProcessingChanged: {
164+ if (processing) delay.start();
165+ else if (!persist.running) indicator.opacity = 0;
166+ }
167+
168+ Timer {
169+ id: delay
170+ interval: 200
171+ onTriggered: if (indicator.processing) {
172+ persist.restart();
173+ indicator.opacity = 1;
174+ }
175+ }
176+
177+ Timer {
178+ id: persist
179+ interval: 2 * UbuntuAnimation.SleepyDuration - UbuntuAnimation.FastDuration
180+ onTriggered: if (!indicator.processing) indicator.opacity = 0
181+ }
182+
183+ Rectangle {
184+ id: orange
185+ anchors { top: parent.top; bottom: parent.bottom }
186+ width: parent.width / 4
187+ color: Theme.palette.selected.foreground
188+
189+ SequentialAnimation {
190+ running: indicator.visible
191+ loops: Animation.Infinite
192+ XAnimator {
193+ from: -orange.width / 2
194+ to: indicator.width - orange.width / 2
195+ duration: UbuntuAnimation.SleepyDuration
196+ easing.type: Easing.InOutSine
197+ target: orange
198+ }
199+ XAnimator {
200+ from: indicator.width - orange.width / 2
201+ to: -orange.width / 2
202+ duration: UbuntuAnimation.SleepyDuration
203+ easing.type: Easing.InOutSine
204+ target: orange
205+ }
206+ }
207+ }
208+ }
209+
143210}
qml/Dash/DashContent.qml+2
@@ -25,6 +25,8 @@ Item {
2525
2626 property alias scopes: dashContentList.model
2727 readonly property alias currentIndex: dashContentList.currentIndex
28+ readonly property bool processing: dashContentList.currentItem && dashContentList.currentItem.item
29+ && dashContentList.currentItem.item.processing || false
2830
2931 signal scopeLoaded(string scopeId)
3032 signal gotoScope(string scopeId)
qml/Dash/DashNavigationList.qml−5
@@ -35,11 +35,6 @@ Item {
3535 anchors.fill: parent
3636 }
3737
38− ActivityIndicator {
39− id: loadingIndicator
40− anchors.centerIn: parent
41− running: !(navigation && navigation.loaded)
42− }
4338 clip: true
4439
4540 Behavior on height {
qml/Dash/GenericScopeView.qml+2−1
@@ -40,6 +40,8 @@ FocusScope {
4040 style: scope ? scope.customizations : {}
4141 }
4242
43+ readonly property bool processing: scope ? scope.searchInProgress || previewListView.processing : false
44+
4345 signal backClicked()
4446
4547 function positionAtBeginning() {
@@ -385,7 +387,6 @@ FocusScope {
385387 title: scopeView.scope ? scopeView.scope.name : ""
386388 showBackButton: scopeView.hasBackAction
387389 searchEntryEnabled: true
388− searchInProgress: scopeView.scope ? scopeView.scope.searchInProgress : false
389390 scopeStyle: scopeView.scopeStyle
390391
391392 bottomItem: DashNavigation {
qml/Dash/PreviewListView.qml+23−27
@@ -32,6 +32,9 @@ Item {
3232 property alias currentItem: previewListView.currentItem
3333 property alias count: previewListView.count
3434
35+ readonly property bool processing: currentItem && (!currentItem.previewModel.loaded
36+ || currentItem.previewModel.processingAction)
37+
3538 PageHeader {
3639 id: header
3740 objectName: "pageHeader"
@@ -83,39 +86,32 @@ Item {
8386 }
8487 }
8588
86− delegate: Item {
87− objectName: "previewItem" + index
89+ delegate: Previews.Preview {
90+ id: preview
91+ objectName: "preview" + index
8892 height: previewListView.height
8993 width: previewListView.width
9094
91− readonly property bool ready: preview.previewModel.loaded
92−
93− Previews.Preview {
94− id: preview
95− objectName: "preview" + index
96− anchors.fill: parent
95+ isCurrent: ListView.isCurrentItem
9796
98− isCurrent: parent.ListView.isCurrentItem
99−
100− previewModel: {
101− var previewStack = root.scope.preview(result);
102− return previewStack.getPreviewModel(0);
103− }
104− scopeStyle: root.scopeStyle
97+ previewModel: {
98+ var previewStack = root.scope.preview(result);
99+ return previewStack.getPreviewModel(0);
105100 }
101+ scopeStyle: root.scopeStyle
102+ }
103+ }
106104
107− MouseArea {
108− id: processingMouseArea
109− objectName: "processingMouseArea"
110− anchors.fill: parent
111− enabled: !preview.previewModel.loaded || preview.previewModel.processingAction
112−
113− ActivityIndicator {
114− anchors.centerIn: parent
115− visible: root.open && parent.enabled
116− running: visible
117− }
118− }
105+ MouseArea {
106+ id: processingMouseArea
107+ objectName: "processingMouseArea"
108+ anchors {
109+ left: parent.left
110+ right: parent.right
111+ top: pageHeader.bottom
112+ bottom: parent.bottom
119113 }
114+
115+ enabled: root.processing
120116 }
121117}
tests/autopilot/unity8/shell/emulators/dash.py+1−1
@@ -150,7 +150,7 @@ class Dash(emulators.UnityEmulatorBase):
150150 headerContainer.contentY.wait_for(0)
151151 search_text_field = self._get_search_text_field()
152152 search_text_field.write(query)
153− current_header.select_single(objectName="searchIndicator").running.wait_for(False)
153+ self.select_single(objectName="processingIndicator").visible.wait_for(False)
154154
155155 def _get_search_text_field(self):
156156 page_header = self._get_current_page_header()
tests/plugins/Dash/tst_ScopeStyle.qml+14−7
@@ -54,6 +54,9 @@ Rectangle {
5454 { tag: "lightgrey", luminance: 0.8275 },
5555 { tag: "grey", luminance: 0.5020 },
5656 { tag: "darkgrey", luminance: 0.6627 },
57+ { tag: "red", luminance: 0.2126 },
58+ { tag: "green", luminance: 0.3590 },
59+ { tag: "blue", luminance: 0.0722 },
5760 ];
5861 }
5962
@@ -64,10 +67,10 @@ Rectangle {
6467
6568 function test_foreground_data() {
6669 return [
67− { tag: "default", index: 0, foreground: "grey" },
68− { tag: "red on black", index: 1, foreground: "red" },
69− { tag: "green on white", index: 2, foreground: "green" },
70− { tag: "blue on darkgrey", index: 3, foreground: "blue" },
70+ { tag: "default", index: 0, foreground: "grey", luminance: 0.5020 },
71+ { tag: "red on black", index: 1, foreground: "red", luminance: 0.2126 },
72+ { tag: "green on white", index: 2, foreground: "green", luminance: 0.3590 },
73+ { tag: "blue on darkgrey", index: 3, foreground: "blue", luminance: 0.0722 },
7174 ];
7275 }
7376
@@ -75,14 +78,15 @@ Rectangle {
7578 tool.style = testCase.styles[data.index];
7679 verify(Qt.colorEqual(tool.foreground, data.foreground),
7780 "Foreground color not equal: %1 != %2".arg(tool.foreground).arg(data.foreground));
81+ compare(tool.foregroundLuminance.toFixed(4), data.luminance.toFixed(4));
7882 }
7983
8084 function test_background_data() {
8185 return [
8286 { tag: "default", index: 0, background: "transparent" },
83− { tag: "red on black", index: 1, background: "black" },
84− { tag: "green on white", index: 2, background: "white" },
85− { tag: "blue on darkgrey", index: 3, background: "darkgrey" },
87+ { tag: "red on black", index: 1, background: "black", luminance: 0 },
88+ { tag: "green on white", index: 2, background: "white", luminance: 1 },
89+ { tag: "blue on darkgrey", index: 3, background: "darkgrey", luminance: 0.6627 },
8690 ];
8791 }
8892
@@ -90,6 +94,9 @@ Rectangle {
9094 tool.style = testCase.styles[data.index];
9195 verify(Qt.colorEqual(tool.background, data.background),
9296 "Background color not equal: %1 != %2".arg(tool.background).arg(data.background));
97+ if (data.hasOwnProperty("luminance")) {
98+ compare(tool.backgroundLuminance.toFixed(4), data.luminance.toFixed(4));
99+ }
93100 }
94101
95102 function test_threshold_data() {
tests/qmltests/Components/tst_PageHeader.qml−23
@@ -119,29 +119,6 @@ Item {
119119 compare(pageHeader.searchHistory.get(0).query, "humppa4")
120120 }
121121
122− function test_search_indicator() {
123− var searchIndicator = findChild(pageHeader, "searchIndicator")
124− var clearIcon = findChild(pageHeader, "clearIcon")
125−
126− pageHeader.triggerSearch()
127−
128− tryCompare(clearIcon, "visible", false)
129− pageHeader.searchQuery = "ubuntu"
130− tryCompare(clearIcon, "visible", true)
131−
132− pageHeader.searchInProgress = false
133− compare(searchIndicator.running, false, "Search indicator is running.")
134− tryCompare(clearIcon, "visible", true)
135−
136− pageHeader.searchInProgress = true
137− compare(searchIndicator.running, true, "Search indicator isn't running.")
138− tryCompare(clearIcon, "visible", false)
139−
140− pageHeader.searchInProgress = false;
141− compare(searchIndicator.running, false, "Search indicator is running.")
142− tryCompare(clearIcon, "visible", true)
143− }
144−
145122 function test_titleImage() {
146123
147124 var titleImage = findChild(pageHeader, "titleImage");
tests/qmltests/Dash/tst_Dash.qml+23−6
@@ -45,12 +45,8 @@ Item {
4545 name: "Dash"
4646 when: windowShown
4747
48− property var scopes
49−
50− Component.onCompleted: {
51− var dashContent = findChild(dash, "dashContent");
52− scopes = dashContent.scopes;
53− }
48+ readonly property Item dashContent: findChild(dash, "dashContent");
49+ readonly property var scopes: dashContent.scopes
5450
5551 function init() {
5652 // clear and reload the scopes.
@@ -106,5 +102,26 @@ Item {
106102 dashCommunicatorService.mockSetCurrentScope("clickscope", true, true);
107103 tryCompare(dashContentList, "currentIndex", 1)
108104 }
105+
106+ function test_processing_indicator() {
107+ tryCompare(scopes, "loaded", true);
108+
109+ var processingIndicator = findChild(dash, "processingIndicator");
110+ verify(processingIndicator, "Can't find the processing indicator.");
111+
112+ verify(!processingIndicator.visible, "Processing indicator should be visible.");
113+
114+ tryCompareFunction(function() {
115+ return scopes.getScope(dashContent.currentIndex) != null;
116+ }, true);
117+ var currentScope = scopes.getScope(dashContent.currentIndex);
118+ verify(currentScope, "Can't find the current scope.");
119+
120+ currentScope.setSearchInProgress(true);
121+ tryCompare(processingIndicator, "visible", true);
122+
123+ currentScope.setSearchInProgress(false);
124+ tryCompare(processingIndicator, "visible", false);
125+ }
109126 }
110127}
tests/qmltests/Dash/tst_GenericScopeView.qml+1−1
@@ -320,7 +320,7 @@ Item {
320320 units.gu(2),
321321 testCase.previewListView.height / 2);
322322 tryCompare(previewListViewList, "moving", false);
323− tryCompare(testCase.previewListView.currentItem, "objectName", "previewItem" + i);
323+ tryCompare(testCase.previewListView.currentItem, "objectName", "preview" + i);
324324
325325 }
326326 closePreview();