git.iko.soy/unity8
on xenial help sign in
rewrite PageHeader.qml
6c9d92eMichael Zanetti
qml/Components/PageHeader.qml+177−321
compare with xenial
unifiedsplit
@@ -14,387 +14,243 @@
14 * along with this program. If not, see <http://www.gnu.org/licenses/>.
14 * along with this program. If not, see <http://www.gnu.org/licenses/>.
15 */
15 */
16
16
17−import QtQuick 2.0
17+import QtQuick 2.2
18+import Ubuntu.Components 1.1
18−import Ubuntu.Components 0.1
19+import Ubuntu.Components.Themes.Ambiance 1.1
19−import Ubuntu.Components.Popups 0.1
20+import Ubuntu.Components.Popups 1.0
20−import Ubuntu.Components.ListItems 0.1 as ListItem
21+import Ubuntu.Components.ListItems 1.0
21−import Unity 0.2
22
22
23Item {
23Item {
24 id: root
24 id: root
25+ implicitHeight: headerContainer.height + units.gu(2) + bottomContainer.height
26+ height: implicitHeight
27+
28+ property bool showBackButton: false
29+ property string title
30+ property var scope: null
31+
25 property bool searchEntryEnabled: false
32 property bool searchEntryEnabled: false
26− property alias searchQuery: searchField.text
27 property ListModel searchHistory
33 property ListModel searchHistory
28− property var scope: null
34+ property alias searchQuery: searchTextField.text
29− property alias childItem: itemContainer.children
30− property alias bottomItem: bottomContainer.children
31− property alias showBackButton: backButton.visible
32
35
33− signal backClicked
36+ property alias bottomItem: bottomContainer.children
34
37
35− height: header.height + units.gu(2) + bottomContainer.height
38+ signal backClicked()
36− implicitHeight: header.height + units.gu(2) + bottomContainer.height
37
39
38 function triggerSearch() {
40 function triggerSearch() {
39− if (searchEntryEnabled) searchField.forceActiveFocus()
41+ if (searchEntryEnabled) searchTextField.forceActiveFocus()
40 }
42 }
41
43
42− function resetSearch() {
44+ function resetSearch(unfocusField) {
43− if (!searchHistory) return;
45+ if (unfocusField == undefined) {
46+ unfocusField = true;
47+ }
44
48
49+ if (searchHistory) {
45− searchHistory.addQuery(searchField.text);
50+ searchHistory.addQuery(searchTextField.text);
51+ }
52+ if (unfocusField) {
46− unfocus();
53+ unfocus();
47− searchField.text = "";
54+ }
55+ searchTextField.text = "";
48 }
56 }
49
57
50 function unfocus() {
58 function unfocus() {
59+ print("unfocusing field")
51− searchField.focus = false;
60+ searchTextField.focus = false;
52 }
61 }
53
62
54− Connections {
63+ function openSearchHistory() {
55− target: greeter
64+ print("should open search history")
56− onShownChanged: if (shown) resetSearch()
65+ if (openSearchAnimation.running) {
66+ print("huh! animation is running")
67+ openSearchAnimation.openSearchHistory = true
68+ } else if (root.searchHistory.count > 0) {
69+ PopupUtils.open(popoverComponent, searchTextField,
70+ {
71+ "contentWidth": searchTextField.width,
72+ "edgeMargins": units.gu(1)
73+ }
74+ )
75+ }
57 }
76 }
58
77
59 Flickable {
78 Flickable {
60− id: header
79+ id: headerContainer
61− anchors {
80+ clip: true
62− left: parent.left
81+ anchors { left: parent.left; top: parent.top; right: parent.right }
63− right: parent.right
64− top: parent.top
65− }
66 height: units.gu(6.5)
82 height: units.gu(6.5)
67−
83+ contentHeight: headersColumn.height
68 interactive: false
84 interactive: false
69− contentHeight: headerContainer.height
85+ contentY: showSearch ? 0 : height
70− clip: true
71
86
72− contentY: searchField.activeFocus || searchField.text != "" ? searchContainer.y : headerContainer.y
87+ property bool showSearch: false
73−
74− Behavior on contentY { NumberAnimation { duration: 200; easing.type: Easing.OutQuad } }
75−
76− AbstractButton {
77− id: backButton
78− objectName: root.objectName + "_backButton"
79− visible: false
80− height: header.height
81− y: header.contentY
82− anchors {
83− left: parent.left
84− leftMargin: visible ? units.gu(2) : 0
85− }
86− width: visible ? image.width + units.gu(2) : 0
87− onClicked: root.backClicked();
88− Image {
89− id: image
90− anchors.centerIn: parent
91− source: "graphics/headerback.png"
92− }
93− }
94
88
95− // FIXME this could potentially be simplified to avoid all the containers
89+ Behavior on contentY {
96− Item {
90+ UbuntuNumberAnimation {
97− id: headerContainer
91+ id: openSearchAnimation
92+ property bool openSearchHistory: false
98
93
99− anchors {
94+ onRunningChanged: {
100− left: backButton.right
95+ if (!running && openSearchAnimation.openSearchHistory) {
101− right: parent.right
96+ openSearchAnimation.openSearchHistory = false;
102− }
97+ root.openSearchHistory()
103− height: childrenRect.height
104−
105− Item {
106− id: itemContainer
107−
108− width: searchContainer.narrowMode ? header.width : header.width - searchContainer.width
109− height: header.height
110− }
111−
112− Item {
113− id: searchContainer
114− objectName: "searchContainer"
115−
116− visible: searchEntryEnabled
117− property bool popoverShouldOpen: false
118− property bool popoverShouldClose: false
119−
120− property bool narrowMode: parent.width < units.gu(80)
121−
122− property bool active: searchField.text != "" || searchField.activeFocus
123− property var popover: null
124−
125− anchors.right: headerContainer.right
126− height: header.height
127−
128− state:
129− if (active && narrowMode) "narrowActive"
130− else if (!active && narrowMode) "narrowInactive"
131− else if (active && !narrowMode) "active"
132− else if (!active && !narrowMode) "inactive"
133−
134− onStateChanged: {
135− if (state == "active" || state == "narrowActive") {
136− popoverShouldOpen = true;
137− popoverShouldClose = false;
138− } else {
139− popoverShouldOpen = false;
140− popoverShouldClose = true;
141 }
98 }
142 }
99 }
100+ }
101+ }
143
102
144− function openPopover() {
103+ Column {
145− if (searchHistory.count > 0) {
104+ id: headersColumn
146− searchContainer.popover = PopupUtils.open(popoverComponent, pointerPositioner,
105+ anchors.fill: parent
147− {
106+ height: searchHeader.height + header.height
148− "contentWidth": searchField.width,
107+
149− "edgeMargins": units.gu(1)
108+ PageHeadStyle {
150− }
109+ id: searchHeader
151− )
110+ anchors { left: parent.left; right: parent.right }
152− }
111+ height: headerContainer.height
153− popoverShouldOpen = false;
112+ contentHeight: height
154− popoverShouldClose = false;
113+ separatorSource: ""
155− }
114+ property var styledItem: searchHeader
156−
115+ property string title: "searchHeader"
157− function closePopover() {
116+ property var config: PageHeadConfiguration {
158− if (searchContainer.popover) {
117+ backAction: Action {
159− PopupUtils.close(searchContainer.popover);
118+ iconName: "back"
160− searchContainer.popover = null;
119+ onTriggered: {
120+ root.resetSearch(true)
121+ headerContainer.showSearch = false
122+ }
161 }
123 }
162− popoverShouldOpen = false;
163− popoverShouldClose = false;
164 }
124 }
165−
166− onActiveFocusChanged: if (!activeFocus) { searchHistory.addQuery(searchField.text) }
167−
168− TextField {
125+ property var contents: TextField {
169− id: searchField
126+ id: searchTextField
170−
171− anchors.fill: parent
172− anchors.margins: units.gu(1)
173−
174− inputMethodHints: Qt.ImhNoPredictiveText
175 hasClearButton: false
127 hasClearButton: false
128+ anchors {
129+ fill: parent;
130+ leftMargin: units.gu(1)
131+ topMargin: units.gu(1)
132+ bottomMargin: units.gu(1)
133+ rightMargin: root.width > units.gu(60) ? root.width - units.gu(40) : units.gu(1)
134+ }
176
135
177− primaryItem: AbstractButton {
136+ secondaryItem: AbstractButton {
178− enabled: searchField.text != "" && !searchIndicator.running
179− onClicked: {
180− if (searchField.text != "") {
181− searchHistory.addQuery(searchField.text)
182− searchField.text = ""
183− }
184− }
185− height: parent.height
137+ height: searchTextField.height
186 width: height
138 width: height
187
139
188− ActivityIndicator {
140+ Image {
189− id: searchIndicator
141+ anchors.fill: parent
190− objectName: "searchIndicator"
191−
192− anchors {
142+ anchors.margins: units.gu(.75)
193− verticalCenter: parent.verticalCenter
143+ source: "image://theme/clear"
194− left: parent.left
144+ opacity: searchTextField.text.length > 0 && !searchActivityIndicator.running
195− leftMargin: units.gu(0.5)
196− }
197−
198− running: opacity > 0
199 }
145 }
200
146
201− Image {
147+ ActivityIndicator {
202− id: primaryImage
148+ id: searchActivityIndicator
203− objectName: "primaryImage"
204− anchors {
149+ anchors.fill: parent
205− verticalCenter: parent.verticalCenter
150+ anchors.margins: units.gu(.75)
206− left: parent.left
151+ running: root.scope && root.scope.searchInProgress
207− leftMargin: units.gu(0.5)
152+ opacity: running ? 1 : 0
153+ Behavior on opacity {
154+ UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration }
208 }
155 }
209− width: units.gu(3)
210− height: units.gu(3)
211− visible: opacity > 0
212 }
156 }
213
157
214− Item {
158+ onClicked: {
215− id: pointerPositioner
159+ root.resetSearch(false)
216− anchors.left: parent.right
160+ root.openSearchHistory()
217− anchors.leftMargin: units.gu(0.5)
218− anchors.top: parent.bottom
219 }
161 }
220 }
162 }
221
163
222− onTextChanged: {
223− if (text != "") searchContainer.closePopover()
224− else if (text == "" && activeFocus) searchContainer.openPopover()
225− }
226−
227 onActiveFocusChanged: {
164 onActiveFocusChanged: {
228− if (!activeFocus) searchContainer.closePopover()
165+ if (activeFocus) {
166+ root.openSearchHistory()
167+ }
229 }
168 }
169+ }
170+ }
230
171
231− states: [
172+ PageHeadStyle {
232− State {
173+ id: header
233− name: "searching"
174+ anchors { left: parent.left; right: parent.right }
234− when: scope && scope.searchInProgress
175+ height: headerContainer.height
235− PropertyChanges { target: searchIndicator; running: true; opacity: 1 }
176+ contentHeight: height
236− PropertyChanges { target: primaryImage; opacity: 0 }
177+ separatorSource: ""
237− },
178+ textColor: "grey"
238− State {
179+ property var styledItem: header
239− name: "idle"
180+ property string title: root.title
240− when: !scope || !scope.searchInProgress
181+ property var config: PageHeadConfiguration {
241− PropertyChanges { target: searchIndicator; opacity: 0 }
182+ backAction: Action {
242− PropertyChanges { target: primaryImage; opacity: 1 }
183+ iconName: "back"
184+ visible: root.showBackButton
185+ onTriggered: {
186+ print("Back clicked")
187+ root.backClicked()
243 }
188 }
244− ]
189+ }
245
190
246− transitions: [
191+ actions: [
247− Transition {
192+ Action {
248− to: "searching"
193+ iconName: "search"
249− reversible: true
194+ visible: root.searchEntryEnabled
250− SequentialAnimation {
195+ onTriggered: {
251− NumberAnimation { target: primaryImage; property: "opacity"; duration: UbuntuAnimation.FastDuration; easing.type: Easing.Linear }
196+ headerContainer.showSearch = true
252− NumberAnimation { target: searchIndicator; property: "opacity"; duration: UbuntuAnimation.FastDuration; easing.type: Easing.Linear }
197+ searchTextField.forceActiveFocus()
253 }
198 }
254 }
199 }
255 ]
200 ]
256 }
201 }
202+ }
203+ }
204+ }
257
205
258− states: [
259− State {
260− name: "wide"
261− AnchorChanges { target: itemContainer; anchors.top: headerContainer.top }
262− AnchorChanges { target: searchContainer; anchors.left: undefined; anchors.top: itemContainer.top }
263− },
264− State {
265− name: "narrow"
266− PropertyChanges { target: searchField; highlighted: true }
267− AnchorChanges { target: itemContainer; anchors.top: searchContainer.bottom }
268− AnchorChanges { target: searchContainer; anchors.left: headerContainer.left; anchors.top: headerContainer.top }
269− },
270− State {
271− name: "active"
272− extend: "wide"
273− PropertyChanges { target: searchContainer; width: units.gu(40) }
274− PropertyChanges { target: primaryImage; source: searchField.text ? "../Dash/graphics/icon_clear.png" : "../Dash/graphics/icon_search_active.png" }
275− PropertyChanges { target: searchField; highlighted: true }
276− },
277− State {
278− name: "inactive"
279− extend: "wide"
280− PropertyChanges { target: searchContainer; width: units.gu(25) }
281− PropertyChanges { target: primaryImage; source: "../Dash/graphics/icon_search_inactive.png" }
282− PropertyChanges { target: searchField; highlighted: false }
283− },
284− State {
285− name: "narrowActive"
286− extend: "narrow"
287− PropertyChanges { target: header; contentY: 0 }
288− PropertyChanges { target: primaryImage; source: searchField.text ? "../Dash/graphics/icon_clear.png" : "../Dash/graphics/icon_search_active.png" }
289− },
290− State {
291− name: "narrowInactive"
292− extend: "narrow"
293− PropertyChanges { target: header; contentY: header.height }
294− PropertyChanges { target: primaryImage; source: searchField.text ? "../Dash/graphics/icon_clear.png" : "../Dash/graphics/icon_search_active.png" }
295− }
296− ]
297−
298− transitions: [
299− Transition {
300− to: "active"
301− SequentialAnimation {
302− ParallelAnimation {
303− NumberAnimation { targets: [searchContainer, searchField]; property: "width"; duration: 200; easing.type: Easing.InOutQuad }
304− PropertyAction { target: primaryImage; property: "source" }
305− AnchorAnimation { targets: [searchContainer, itemContainer]; duration: 200; easing.type: Easing.InOutQuad }
306− }
307− ScriptAction { script: if (searchContainer.popoverShouldOpen) { searchContainer.openPopover(); } }
308− }
309− },
310− Transition {
311− to: "inactive"
312− ScriptAction { script: if (searchContainer.popoverShouldClose) { searchContainer.closePopover(); } }
313− NumberAnimation { targets: [searchContainer, searchField] ; property: "width"; duration: 200; easing.type: Easing.InOutQuad }
314− AnchorAnimation { targets: [searchContainer, itemContainer]; duration: 200; easing.type: Easing.InOutQuad }
315− },
316− Transition {
317− to: "narrowActive"
318− SequentialAnimation {
319− ParallelAnimation {
320− NumberAnimation { targets: [searchContainer, searchField] ; property: "width"; duration: 200; easing.type: Easing.OutQuad }
321− AnchorAnimation { targets: [searchContainer, itemContainer]; duration: 200; easing.type: Easing.InOutQuad }
322− }
323− ScriptAction { script: if (searchContainer.popoverShouldOpen) { searchContainer.openPopover(); } }
324− }
325− },
326− Transition {
327− to: "narrowInactive"
328− ScriptAction { script: if (searchContainer.popoverShouldClose) { searchContainer.closePopover(); } }
329− NumberAnimation { targets: [searchContainer, searchField] ; property: "width"; duration: 200; easing.type: Easing.OutQuad }
330− AnchorAnimation { targets: [searchContainer, itemContainer]; duration: 200; easing.type: Easing.InOutQuad }
331− }
332− ]
333−
334− Component {
206+ Component {
335− id: popoverComponent
207+ id: popoverComponent
336− Popover {
208+ Popover {
337− id: popover
209+ id: popover
338−
210+
339− // FIXME: this should go into the first item below, but enable: false
211+ // FIXME: this should go into the first item below, but enable: false
340− // prevents mouse events propagation
212+ // prevents mouse events propagation
341− AbstractButton {
213+ AbstractButton {
342− anchors {
214+ anchors {
343− top: parent.top
215+ top: parent.top
344− right: parent.right
216+ right: parent.right
345− }
217+ }
346− height: units.gu(6)
218+ height: units.gu(6)
347− width: height
219+ width: height
348
220
349− onClicked: searchContainer.closePopover()
221+ onClicked: PopupUtils.close(popover)
350
222
351− Image {
223+ Image {
352− anchors.centerIn: parent
224+ anchors.centerIn: parent
353− width: units.gu(2)
225+ width: units.gu(2)
354− height: units.gu(2)
226+ height: units.gu(2)
355− source: "../Dash/graphics/icon_listview_clear.png"
227+ source: "../Dash/graphics/icon_listview_clear.png"
356− }
228+ }
357− }
229+ }
358
230
359− Column {
231+ Column {
360− anchors {
232+ anchors {
361− top: parent.top
233+ top: parent.top
362− left: parent.left
234+ left: parent.left
363− right: parent.right
235+ right: parent.right
364− }
236+ }
365
237
366− ListItem.Standard { enabled: false; text: i18n.tr("Recent searches") }
238+ Standard { enabled: false; text: i18n.tr("Recent searches") }
367
239
368− Repeater {
240+ Repeater {
369− id: recentSearches
241+ id: recentSearches
370− model: searchHistory
242+ model: searchHistory
371
243
372− delegate: ListItem.Standard {
244+ delegate: Standard {
373− showDivider: index < recentSearches.count - 1
245+ showDivider: index < recentSearches.count - 1
374− text: query
246+ text: query
375− onClicked: {
247+ onClicked: {
376− searchHistory.addQuery(text)
248+ searchHistory.addQuery(text)
377− searchField.text = text
249+ searchTextField.text = text
378− }
250+ PopupUtils.close(popover)
379− }
380− }
381 }
251 }
382 }
252 }
383 }
253 }
384−
385− InverseMouseArea {
386− enabled: searchField.activeFocus
387−
388− anchors {
389− top: parent.top
390− left: parent.left
391− right: parent.right
392− }
393−
394− height: searchContainer.popover ? parent.height + searchContainer.popover.contentHeight + units.gu(2) : parent.height
395−
396− onPressed: searchField.focus = false
397− }
398 }
254 }
399 }
255 }
400 }
256 }
@@ -402,7 +258,7 @@ Item {
402 BorderImage {
258 BorderImage {
403 id: bottomBorder
259 id: bottomBorder
404 anchors {
260 anchors {
405− top: header.bottom
261+ top: headerContainer.bottom
406 left: parent.left
262 left: parent.left
407 right: parent.right
263 right: parent.right
408 bottom: bottomContainer.top
264 bottom: bottomContainer.top
qml/Dash/DashContent.qml+3−41
@@ -16,7 +16,6 @@
16
16
17import QtQuick 2.0
17import QtQuick 2.0
18import Ubuntu.Components 1.1
18import Ubuntu.Components 1.1
19−import Ubuntu.Components.Themes.Ambiance 1.1
20import Unity 0.2
19import Unity 0.2
21import Utils 0.1
20import Utils 0.1
22import "../Components"
21import "../Components"
@@ -148,11 +147,11 @@ Item {
148
147
149 onLoaded: {
148 onLoaded: {
150 item.objectName = scope.id
149 item.objectName = scope.id
151− item.pageHeader = dashPageHeader;
150+ item.searchHistory = dashContent.searchHistory;
152 item.previewListView = previewListView;
151 item.previewListView = previewListView;
153 item.scope = Qt.binding(function() { return scope })
152 item.scope = Qt.binding(function() { return scope })
154 item.isCurrent = Qt.binding(function() { return visible && ListView.isCurrentItem })
153 item.isCurrent = Qt.binding(function() { return visible && ListView.isCurrentItem })
155− item.tabBarHeight = Qt.binding(function() { return dashPageHeader.implicitHeight; })
154+ item.title = Qt.binding(function() { return dashContentList.model.get(index).title; })
156 dashContent.scopeLoaded(item.scope.id)
155 dashContent.scopeLoaded(item.scope.id)
157 }
156 }
158 Connections {
157 Connections {
@@ -169,43 +168,6 @@ Item {
169 Component.onDestruction: active = false
168 Component.onDestruction: active = false
170 }
169 }
171 }
170 }
172−
173− PageHeader {
174− id: dashPageHeader
175− objectName: "pageHeader"
176− width: parent.width
177− searchEntryEnabled: true
178− searchHistory: dashContent.searchHistory
179− scope: dashContentList.currentItem && dashContentList.currentItem.theScope
180−
181− childItem: PageHeadStyle {
182− id: tabBar
183− objectName: "tabbar"
184− width: parent.width
185− height: units.gu(6.5)
186− contentHeight: height
187− separatorSource: ""
188− textColor: "grey"
189− property var styledItem: tabBar
190− property var title: dashContentList.model.get(dashContentList.currentIndex).title
191− property var config: PageHeadConfiguration {
192− actions: [
193− Action {
194− iconName: "search"
195− onTriggered: dashPageHeader.triggerSearch()
196− }
197− ]
198− }
199− }
200−
201− bottomItem: DashDepartments {
202− scope: dashContentList.currentItem ? dashContentList.currentItem.theScope : null
203− width: parent.width <= units.gu(60) ? parent.width : units.gu(40)
204− anchors.right: parent.right
205− windowHeight: dashContent.height
206− windowWidth: dashContent.width
207− }
208− }
209 }
171 }
210
172
211 PreviewListView {
173 PreviewListView {
@@ -213,7 +175,7 @@ Item {
213 objectName: "dashContentPreviewList"
175 objectName: "dashContentPreviewList"
214 visible: x != width
176 visible: x != width
215 scope: dashContentList.currentItem ? dashContentList.currentItem.theScope : null
177 scope: dashContentList.currentItem ? dashContentList.currentItem.theScope : null
216− pageHeader: dashPageHeader
178+// pageHeader: dashPageHeader
217 width: parent.width
179 width: parent.width
218 height: parent.height
180 height: parent.height
219 anchors.left: dashContentListHolder.right
181 anchors.left: dashContentListHolder.right
qml/Dash/GenericScopeView.qml+24−20
@@ -15,7 +15,8 @@
15 */
15 */
16
16
17import QtQuick 2.0
17import QtQuick 2.0
18−import Ubuntu.Components 0.1
18+import Ubuntu.Components 1.1
19+import Ubuntu.Components.Themes.Ambiance 1.1
19import Utils 0.1
20import Utils 0.1
20import Unity 0.2
21import Unity 0.2
21import Unity.Application 0.1
22import Unity.Application 0.1
@@ -29,13 +30,15 @@ FocusScope {
29 property SortFilterProxyModel categories: categoryFilter
30 property SortFilterProxyModel categories: categoryFilter
30 property bool isCurrent: false
31 property bool isCurrent: false
31 property alias moving: categoryView.moving
32 property alias moving: categoryView.moving
32− property int tabBarHeight: 0
33− property PageHeader pageHeader: null
34 property Item previewListView: null
33 property Item previewListView: null
35−
34+ property string title
35+ property bool hasBackAction: false
36+ property ListModel searchHistory
36 property bool enableHeightBehaviorOnNextCreation: false
37 property bool enableHeightBehaviorOnNextCreation: false
37 property var categoryView: categoryView
38 property var categoryView: categoryView
38
39
40+ signal backClicked()
41+
39 onScopeChanged: {
42 onScopeChanged: {
40 if (scope) {
43 if (scope) {
41 scope.activateApplication.connect(activateApp);
44 scope.activateApplication.connect(activateApp);
@@ -103,10 +106,6 @@ FocusScope {
103
106
104 property string expandedCategoryId: ""
107 property string expandedCategoryId: ""
105
108
106− onContentYChanged: pageHeader.positionRealHeader();
107− onOriginYChanged: pageHeader.positionRealHeader();
108− onContentHeightChanged: pageHeader.positionRealHeader();
109−
110 delegate: ListItems.Base {
109 delegate: ListItems.Base {
111 id: baseItem
110 id: baseItem
112 objectName: "dashCategory" + category
111 objectName: "dashCategory" + category
@@ -311,20 +310,25 @@ FocusScope {
311 categoryView.expandedCategoryId = "";
310 categoryView.expandedCategoryId = "";
312 }
311 }
313 }
312 }
314− pageHeader: Item {
315− implicitHeight: scopeView.tabBarHeight
316− onHeightChanged: {
317− if (scopeView.pageHeader && scopeView.isCurrent) {
318− scopeView.pageHeader.height = height;
319− }
320− }
321− onYChanged: positionRealHeader();
322
313
323− function positionRealHeader() {
314+ pageHeader: PageHeader {
324− if (scopeView.pageHeader && scopeView.isCurrent) {
315+ id: pageHeader
325− scopeView.pageHeader.y = y + parent.y;
316+ width: parent.width
326− }
317+ title: scopeView.title
318+ scope: scopeView.scope
319+ searchHistory: scopeView.searchHistory
320+ showBackButton: scopeView.hasBackAction
321+ searchEntryEnabled: true
322+
323+ bottomItem: DashDepartments {
324+ scope: scopeView.scope
325+ width: parent.width <= units.gu(60) ? parent.width : units.gu(40)
326+ anchors.right: parent.right
327+ windowHeight: scopeView.height
328+ windowWidth: scopeView.width
327 }
329 }
330+
331+ onBackClicked: scopeView.backClicked()
328 }
332 }
329 }
333 }
330}
334}
qml/Dash/PreviewListView.qml+4−20
@@ -15,7 +15,7 @@
15 */
15 */
16
16
17import QtQuick 2.0
17import QtQuick 2.0
18−import Ubuntu.Components 0.1
18+import Ubuntu.Components 1.1
19import Unity 0.2
19import Unity 0.2
20import "../Components"
20import "../Components"
21import "Previews" as Previews
21import "Previews" as Previews
@@ -24,7 +24,6 @@ Item {
24 id: root
24 id: root
25
25
26 property var scope: null
26 property var scope: null
27− property var pageHeader: null
28
27
29 property alias open: previewListView.open
28 property alias open: previewListView.open
30 property alias model: previewListView.model
29 property alias model: previewListView.model
@@ -36,27 +35,12 @@ Item {
36 id: header
35 id: header
37 objectName: root.objectName + "_pageHeader"
36 objectName: root.objectName + "_pageHeader"
38 width: parent.width
37 width: parent.width
38+ title: scope.name
39+ showBackButton: true
39 searchEntryEnabled: false
40 searchEntryEnabled: false
40 scope: root.scope
41 scope: root.scope
41− height: units.gu(8.5)
42− showBackButton: true
43− onBackClicked: root.open = false
44
42
45− childItem: Label {
43+ onBackClicked: root.open = false
46− id: label
47− anchors {
48− left: parent.left
49− right: parent.right
50− verticalCenter: parent.verticalCenter
51− }
52− text: scope ? scope.name : ""
53− // TODO Saviq: These should come from updated Ubuntu Palette.
54− color: "#888888"
55− font.family: "Ubuntu"
56− font.weight: Font.Light
57− fontSize: "x-large"
58− elide: Text.ElideRight
59− }
60 }
44 }
61
45
62 ListView {
46 ListView {
qml/Dash/ScopeItem.qml+5−37
@@ -48,56 +48,24 @@ Item {
48 width: parent.width
48 width: parent.width
49 height: parent.height
49 height: parent.height
50 isCurrent: scope != null
50 isCurrent: scope != null
51− tabBarHeight: scopeItemPageHeader.implicitHeight
51+ title: scope ? scope.name : ""
52− pageHeader: scopeItemPageHeader
52+ hasBackAction: true
53+ searchHistory: root.searchHistory
53 previewListView: previewListView
54 previewListView: previewListView
54
55
56+ onBackClicked: root.back();
57+
55 Connections {
58 Connections {
56 target: scopeView.isCurrent ? scope : null
59 target: scopeView.isCurrent ? scope : null
57 onGotoScope: root.gotoScope(scopeId);
60 onGotoScope: root.gotoScope(scopeId);
58 onOpenScope: root.openScope(scope);
61 onOpenScope: root.openScope(scope);
59 }
62 }
60 }
63 }
61−
62− PageHeader {
63− id: scopeItemPageHeader
64− width: parent.width
65− searchEntryEnabled: true
66− searchHistory: root.searchHistory
67− scope: root.scope
68− height: units.gu(8.5)
69− showBackButton: true
70− onBackClicked: root.back();
71−
72− childItem: Label {
73− id: label
74− anchors {
75− left: parent.left
76− right: parent.right
77− verticalCenter: parent.verticalCenter
78− }
79− text: scope ? scope.name : ""
80− color: "#888888"
81− font.family: "Ubuntu"
82− font.weight: Font.Light
83− fontSize: "x-large"
84− elide: Text.ElideRight
85− }
86−
87− bottomItem: DashDepartments {
88− scope: root.scope
89− width: parent.width <= units.gu(60) ? parent.width : units.gu(40)
90− anchors.right: parent.right
91− windowHeight: root.height
92− windowWidth: root.width
93− }
94− }
95 }
64 }
96
65
97 PreviewListView {
66 PreviewListView {
98 id: previewListView
67 id: previewListView
99 visible: x != width
68 visible: x != width
100− pageHeader: scopeItemPageHeader
101 scope: root.scope
69 scope: root.scope
102 width: parent.width
70 width: parent.width
103 height: parent.height
71 height: parent.height