git.iko.soy/unity8
on xenial help sign in
Merge lp:~aacid/unity8/new-scopes-dash-preview-fullscreen.
6954905Albert Astals
qml/Dash/Dash.qml+3−3
compare with xenial
unifiedsplit
@@ -27,7 +27,7 @@ Showable {
27 visible: shown
27 visible: shown
28
28
29 property ListModel searchHistory: SearchHistoryModel {}
29 property ListModel searchHistory: SearchHistoryModel {}
30− property bool searchable: !dashContent.previewOnScreen && !scopeItem.previewOnScreen
30+ property bool searchable: !dashContent.previewOpen && !scopeItem.previewOpen
31
31
32 property alias contentProgress: dashContent.contentProgress
32 property alias contentProgress: dashContent.contentProgress
33 property string showScopeOnLoaded: "clickscope"
33 property string showScopeOnLoaded: "clickscope"
@@ -88,8 +88,8 @@ Showable {
88 clip: scale != 1.0 || scopeItem.visible
88 clip: scale != 1.0 || scopeItem.visible
89 Behavior on x {
89 Behavior on x {
90 UbuntuNumberAnimation {
90 UbuntuNumberAnimation {
91− onStopped: {
91+ onRunningChanged: {
92− if (dashContent.x == 0) {
92+ if (!running && dashContent.x == 0) {
93 dashContent.closeScope(scopeItem.scope);
93 dashContent.closeScope(scopeItem.scope);
94 scopeItem.scope = null;
94 scopeItem.scope = null;
95 }
95 }
qml/Dash/DashContent.qml+12−17
@@ -26,7 +26,7 @@ Item {
26 property var scopes: null
26 property var scopes: null
27 property real contentProgress: Math.max(0, Math.min(dashContentList.contentX / (dashContentList.contentWidth - dashContentList.width), units.dp(1)))
27 property real contentProgress: Math.max(0, Math.min(dashContentList.contentX / (dashContentList.contentWidth - dashContentList.width), units.dp(1)))
28 property alias currentIndex: dashContentList.currentIndex
28 property alias currentIndex: dashContentList.currentIndex
29− property alias previewOnScreen: previewListView.onScreen
29+ property alias previewOpen: previewListView.open
30
30
31 property ScopeDelegateMapper scopeMapper : ScopeDelegateMapper {}
31 property ScopeDelegateMapper scopeMapper : ScopeDelegateMapper {}
32 property ListModel searchHistory
32 property ListModel searchHistory
@@ -93,13 +93,17 @@ Item {
93
93
94 Item {
94 Item {
95 id: dashContentListHolder
95 id: dashContentListHolder
96− anchors.fill: parent
96+
97+ x: previewListView.open ? -width : 0
98+ Behavior on x { UbuntuNumberAnimation { } }
99+ width: parent.width
100+ height: parent.height
97
101
98 ListView {
102 ListView {
99 id: dashContentList
103 id: dashContentList
100 objectName: "dashContentList"
104 objectName: "dashContentList"
101
105
102− interactive: dashContent.scopes.loaded && !previewListView.onScreen && !currentItem.moving
106+ interactive: dashContent.scopes.loaded && !previewListView.open && !currentItem.moving
103
107
104 anchors.fill: parent
108 anchors.fill: parent
105 model: dashContent.model
109 model: dashContent.model
@@ -114,6 +118,7 @@ Item {
114 cacheBuffer: 1073741823
118 cacheBuffer: 1073741823
115 onMovementStarted: dashContent.movementStarted()
119 onMovementStarted: dashContent.movementStarted()
116 onMovementEnded: dashContent.movementEnded()
120 onMovementEnded: dashContent.movementEnded()
121+ clip: parent.x != 0
117
122
118 // If the number of items is less than the current index, then need to reset to another item.
123 // If the number of items is less than the current index, then need to reset to another item.
119 onCountChanged: {
124 onCountChanged: {
@@ -149,7 +154,6 @@ Item {
149 item.isCurrent = Qt.binding(function() { return visible && ListView.isCurrentItem })
154 item.isCurrent = Qt.binding(function() { return visible && ListView.isCurrentItem })
150 item.tabBarHeight = dashPageHeader.implicitHeight;
155 item.tabBarHeight = dashPageHeader.implicitHeight;
151 item.pageHeader = dashPageHeader;
156 item.pageHeader = dashPageHeader;
152− item.openEffect = openEffect;
153 item.previewListView = previewListView;
157 item.previewListView = previewListView;
154 dashContentList.movementStarted.connect(item.movementStarted)
158 dashContentList.movementStarted.connect(item.movementStarted)
155 dashContent.positionedAtBeginning.connect(item.positionedAtBeginning)
159 dashContent.positionedAtBeginning.connect(item.positionedAtBeginning)
@@ -219,22 +223,13 @@ Item {
219 }
223 }
220 }
224 }
221
225
222− DashContentOpenEffect {
223− id: openEffect
224− anchors {
225− fill: parent
226− bottomMargin: -bottomOverflow
227− }
228− sourceItem: dashContentListHolder
229− previewListView: previewListView
230− }
231−
232 PreviewListView {
226 PreviewListView {
233 id: previewListView
227 id: previewListView
234− openEffect: openEffect
228+ visible: x != width
235− categoryView: dashContentList.currentItem ? dashContentList.currentItem.categoryView : null
236 scope: dashContentList.currentItem ? dashContentList.currentItem.theScope : null
229 scope: dashContentList.currentItem ? dashContentList.currentItem.theScope : null
237 pageHeader: dashPageHeader
230 pageHeader: dashPageHeader
238− anchors.fill: parent
231+ width: parent.width
232+ height: parent.height
233+ anchors.left: dashContentListHolder.right
239 }
234 }
240}
235}
qml/Dash/DashContentOpenEffect.qmldeleted−57
@@ -1,57 +0,0 @@
1−/*
2− * Copyright (C) 2013 Canonical, Ltd.
3− *
4− * This program is free software; you can redistribute it and/or modify
5− * it under the terms of the GNU General Public License as published by
6− * the Free Software Foundation; version 3.
7− *
8− * This program is distributed in the hope that it will be useful,
9− * but WITHOUT ANY WARRANTY; without even the implied warranty of
10− * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11− * GNU General Public License for more details.
12− *
13− * You should have received a copy of the GNU General Public License
14− * along with this program. If not, see <http://www.gnu.org/licenses/>.
15− */
16−
17−import QtQuick 2.0
18−import Ubuntu.Components 0.1
19−import "../Components"
20−
21−OpenEffect {
22− property PreviewListView previewListView: null
23−
24− objectName: "openEffect"
25− anchors {
26− fill: parent
27− bottomMargin: -bottomOverflow
28− }
29−
30− enabled: gap > 0.0
31−
32− topGapPx: (1 - gap) * positionPx
33− topOpacity: (1 - gap * 1.2)
34− bottomGapPx: positionPx + gap * (targetBottomGapPx - positionPx)
35− bottomOverflow: units.gu(20)
36− live: !expansionAnimation.running
37−
38− property int targetBottomGapPx: height - units.gu(8) - bottomOverflow
39− property real gap: previewListView.open ? 1.0 : 0.0
40−
41− Behavior on gap {
42− NumberAnimation {
43− id: expansionAnimation
44− duration: 200
45− easing.type: Easing.InOutQuad
46− onRunningChanged: {
47− if (!previewListView.open && !running) {
48− previewListView.onScreen = false
49− }
50− }
51− }
52− }
53− Behavior on positionPx {
54− enabled: previewListView.open
55− UbuntuNumberAnimation {}
56− }
57−}
qml/Dash/GenericScopeView.qml+2−26
@@ -30,7 +30,6 @@ FocusScope {
30 property alias moving: categoryView.moving
30 property alias moving: categoryView.moving
31 property int tabBarHeight: 0
31 property int tabBarHeight: 0
32 property PageHeader pageHeader: null
32 property PageHeader pageHeader: null
33− property OpenEffect openEffect: null
34 property Item previewListView: null
33 property Item previewListView: null
35
34
36 signal endReached
35 signal endReached
@@ -56,7 +55,7 @@ FocusScope {
56 Binding {
55 Binding {
57 target: scope
56 target: scope
58 property: "isActive"
57 property: "isActive"
59− value: isCurrent && !previewListView.onScreen
58+ value: isCurrent && !previewListView.open
60 }
59 }
61
60
62 Timer {
61 Timer {
@@ -116,13 +115,12 @@ FocusScope {
116 objectName: "categoryListView"
115 objectName: "categoryListView"
117 anchors.fill: parent
116 anchors.fill: parent
118 model: scopeView.categories
117 model: scopeView.categories
119− forceNoClip: previewListView.onScreen
118+ forceNoClip: previewListView.open
120
119
121 onAtYEndChanged: if (atYEnd) endReached()
120 onAtYEndChanged: if (atYEnd) endReached()
122 onMovingChanged: if (moving && atYEnd) endReached()
121 onMovingChanged: if (moving && atYEnd) endReached()
123
122
124 property string expandedCategoryId: ""
123 property string expandedCategoryId: ""
125− signal correctExpandedCategory();
126
124
127 onContentYChanged: pageHeader.positionRealHeader();
125 onContentYChanged: pageHeader.positionRealHeader();
128 onOriginYChanged: pageHeader.positionRealHeader();
126 onOriginYChanged: pageHeader.positionRealHeader();
@@ -191,9 +189,6 @@ FocusScope {
191 target: rendererLoader.item
189 target: rendererLoader.item
192 onClicked: {
190 onClicked: {
193 // Prepare the preview in case activate() triggers a preview only
191 // Prepare the preview in case activate() triggers a preview only
194− openEffect.positionPx = Math.max(mapToItem(categoryView, 0, itemY).y, pageHeader.height + categoryView.stickyHeaderHeight);
195− previewListView.categoryId = categoryId
196− previewListView.categoryDelegate = rendererLoader.item
197 previewListView.model = target.model;
192 previewListView.model = target.model;
198 previewListView.currentIndex = -1
193 previewListView.currentIndex = -1
199 previewListView.currentIndex = index;
194 previewListView.currentIndex = index;
@@ -207,9 +202,6 @@ FocusScope {
207 }
202 }
208 }
203 }
209 onPressAndHold: {
204 onPressAndHold: {
210− openEffect.positionPx = Math.max(mapToItem(categoryView, 0, itemY).y, pageHeader.height + categoryView.stickyHeaderHeight);
211− previewListView.categoryId = categoryId
212− previewListView.categoryDelegate = rendererLoader.item
213 previewListView.model = target.model;
205 previewListView.model = target.model;
214 previewListView.currentIndex = -1
206 previewListView.currentIndex = -1
215 previewListView.currentIndex = index;
207 previewListView.currentIndex = index;
@@ -221,9 +213,6 @@ FocusScope {
221 onExpandedCategoryIdChanged: {
213 onExpandedCategoryIdChanged: {
222 collapseAllButExpandedCategory();
214 collapseAllButExpandedCategory();
223 }
215 }
224− onCorrectExpandedCategory: {
225− collapseAllButExpandedCategory();
226− }
227 function collapseAllButExpandedCategory() {
216 function collapseAllButExpandedCategory() {
228 var item = rendererLoader.item;
217 var item = rendererLoader.item;
229 if (item.expandable) {
218 if (item.expandable) {
@@ -333,17 +322,4 @@ FocusScope {
333 default: return "CardFilterGrid.qml";
322 default: return "CardFilterGrid.qml";
334 }
323 }
335 }
324 }
336−
337− // TODO: Move as InverseMouseArea to DashPreview
338− MouseArea {
339− objectName: "closePreviewMouseArea"
340− enabled: previewListView.onScreen
341− anchors {
342− fill: parent
343− topMargin: openEffect.bottomGapPx
344− }
345− onClicked: {
346− previewListView.open = false;
347− }
348− }
349}
325}
qml/Dash/PreviewListView.qml+26−77
@@ -23,49 +23,46 @@ import "Previews" as Previews
23Item {
23Item {
24 id: root
24 id: root
25
25
26− property OpenEffect openEffect: null
27− property ScopeListView categoryView: null
28 property Scope scope: null
26 property Scope scope: null
29 property var pageHeader: null
27 property var pageHeader: null
30
28
31 property alias open: previewListView.open
29 property alias open: previewListView.open
32− property alias onScreen: previewListView.onScreen
33− property alias categoryId: previewListView.categoryId
34− property alias categoryDelegate: previewListView.categoryDelegate
35 property alias model: previewListView.model
30 property alias model: previewListView.model
36 property alias currentIndex: previewListView.currentIndex
31 property alias currentIndex: previewListView.currentIndex
37 property alias currentItem: previewListView.currentItem
32 property alias currentItem: previewListView.currentItem
38 property alias count: previewListView.count
33 property alias count: previewListView.count
39
34
40− Image {
35+ PageHeader {
41− objectName: "pointerArrow"
36+ id: header
42− anchors {
37+ width: parent.width
43− top: previewListView.bottom
38+ searchEntryEnabled: false
44− left: parent.left
39+ scope: root.scope
45− leftMargin: previewListView.categoryDelegate !== undefined && previewListView.categoryDelegate.currentItem ?
40+ height: units.gu(8.5)
46− previewListView.categoryDelegate.currentItem.x + previewListView.categoryDelegate.currentItem.width / 2 + (-width + margins) / 2 : 0
41+ showBackButton: true
47−
42+ onBackClicked: root.open = false
48− Behavior on leftMargin {
43+
49− SmoothedAnimation {
44+ childItem: Label {
50− duration: UbuntuAnimation.FastDuration
45+ id: label
51− }
46+ anchors {
47+ left: parent.left
48+ right: parent.right
49+ verticalCenter: parent.verticalCenter
52 }
50 }
51+ text: scope ? i18n.tr("%1 Preview").arg(scope.name) : ""
52+ color: "#888888"
53+ font.family: "Ubuntu"
54+ font.weight: Font.Light
55+ fontSize: "x-large"
56+ elide: Text.ElideRight
53 }
57 }
54− height: units.gu(1)
55− width: units.gu(2)
56− property int margins: previewListView.categoryDelegate ? previewListView.categoryDelegate.margins : 0
57− opacity: previewListView.open ? .5 : 0
58−
59− source: "graphics/tooltip_arrow.png"
60 }
58 }
61
59
62 ListView {
60 ListView {
63 id: previewListView
61 id: previewListView
64 objectName: "previewListView"
62 objectName: "previewListView"
65− height: openEffect.bottomGapPx - openEffect.topGapPx
66 anchors {
63 anchors {
67− top: parent.top
64+ top: header.bottom
68− topMargin: openEffect.topGapPx
65+ bottom: parent.bottom
69 left: parent.left
66 left: parent.left
70 right: parent.right
67 right: parent.right
71 }
68 }
@@ -80,65 +77,17 @@ Item {
80
77
81 // To be set before opening the preview
78 // To be set before opening the preview
82 property string categoryId: ""
79 property string categoryId: ""
83− property var categoryDelegate
84
80
85 // because the ListView is built asynchronous, setting the
81 // because the ListView is built asynchronous, setting the
86 // currentIndex directly won't work. We need to refresh it
82 // currentIndex directly won't work. We need to refresh it
87 // when the first preview is ready to be displayed.
83 // when the first preview is ready to be displayed.
88 property bool init: true
84 property bool init: true
89
85
90− onCurrentIndexChanged: positionListView();
91−
92− function positionListView() {
93− if (!open || currentIndex < 0) {
94− return;
95− }
96−
97− var row = Math.floor(currentIndex / categoryDelegate.columns);
98− if (categoryDelegate.collapsedRowCount <= row) {
99− categoryView.expandedCategoryId = categoryId
100− }
101−
102− categoryDelegate.highlightIndex = currentIndex
103−
104− // Adjust contentY in case we need to change to it to show the next row
105− if (categoryDelegate.rows > 1) {
106− var itemY = categoryView.contentItem.mapFromItem(categoryDelegate.currentItem).y;
107−
108− // Find new contentY and effect.postionPx
109− var newContentY = itemY - openEffect.positionPx - categoryDelegate.verticalSpacing;
110−
111− // Make sure the item is not covered by a header. Move the effect split down if necessary
112− var headerHeight = pageHeader.height + categoryView.stickyHeaderHeight;
113− var effectAdjust = Math.max(openEffect.positionPx, headerHeight);
114−
115− // Make sure we don't overscroll the listview. If yes, adjust effect position
116− if (newContentY < 0) {
117− effectAdjust += newContentY;
118− newContentY = 0;
119− } else if (categoryView.contentHeight < categoryView.height) {
120− // We can't change contentY if the content is smaller than the view, so adjust effect position
121− effectAdjust += newContentY;
122− newContentY = 0;
123− } else if (newContentY > categoryView.contentHeight - categoryView.height) {
124− effectAdjust += -(categoryView.contentHeight - categoryView.height) + newContentY
125− newContentY = categoryView.contentHeight - categoryView.height;
126− }
127−
128− openEffect.positionPx = effectAdjust;
129− categoryView.contentY = newContentY;
130− }
131− }
132−
133 property bool open: false
86 property bool open: false
134− property bool onScreen: false
135
87
136 onOpenChanged: {
88 onOpenChanged: {
137 if (open) {
89 if (open) {
138− onScreen = true;
139− categoryDelegate.highlightIndex = currentIndex;
140 pageHeader.unfocus();
90 pageHeader.unfocus();
141− positionListView();
142 } else {
91 } else {
143 // Cancel any pending preview requests or actions
92 // Cancel any pending preview requests or actions
144 if (previewListView.currentItem.previewData !== undefined) {
93 if (previewListView.currentItem.previewData !== undefined) {
@@ -146,8 +95,6 @@ Item {
146 }
95 }
147 scope.cancelActivation();
96 scope.cancelActivation();
148 model = undefined;
97 model = undefined;
149− categoryView.correctExpandedCategory();
150− categoryDelegate.highlightIndex = -1;
151 }
98 }
152 }
99 }
153
100
@@ -155,6 +102,8 @@ Item {
155 height: previewListView.height
102 height: previewListView.height
156 width: previewListView.width
103 width: previewListView.width
157
104
105+ readonly property bool ready: preview.previewModel.loaded
106+
158 Previews.Preview {
107 Previews.Preview {
159 id: preview
108 id: preview
160 objectName: "preview" + index
109 objectName: "preview" + index
@@ -181,7 +130,7 @@ Item {
181
130
182 ActivityIndicator {
131 ActivityIndicator {
183 anchors.centerIn: parent
132 anchors.centerIn: parent
184− visible: root.onScreen && parent.enabled
133+ visible: root.open && parent.enabled
185 running: visible
134 running: visible
186 }
135 }
187 }
136 }
qml/Dash/ScopeItem.qml+11−17
@@ -23,7 +23,7 @@ Item {
23 id: root
23 id: root
24
24
25 property alias scope: scopeView.scope
25 property alias scope: scopeView.scope
26− property alias previewOnScreen: previewListView.onScreen
26+ property alias previewOpen: previewListView.open
27
27
28 property ListModel searchHistory
28 property ListModel searchHistory
29
29
@@ -33,7 +33,11 @@ Item {
33
33
34 Item {
34 Item {
35 id: scopeViewHolder
35 id: scopeViewHolder
36− anchors.fill: parent
36+
37+ x: previewListView.open ? -width : 0
38+ Behavior on x { UbuntuNumberAnimation { } }
39+ width: parent.width
40+ height: parent.height
37
41
38 GenericScopeView {
42 GenericScopeView {
39 id: scopeView
43 id: scopeView
@@ -42,7 +46,6 @@ Item {
42 isCurrent: scope != null
46 isCurrent: scope != null
43 tabBarHeight: scopeItemPageHeader.implicitHeight
47 tabBarHeight: scopeItemPageHeader.implicitHeight
44 pageHeader: scopeItemPageHeader
48 pageHeader: scopeItemPageHeader
45− openEffect: openEffect
46 previewListView: previewListView
49 previewListView: previewListView
47
50
48 Connections {
51 Connections {
@@ -58,7 +61,7 @@ Item {
58 searchEntryEnabled: true
61 searchEntryEnabled: true
59 searchHistory: root.searchHistory
62 searchHistory: root.searchHistory
60 scope: root.scope
63 scope: root.scope
61− height: units.gu(7)
64+ height: units.gu(8.5)
62 showBackButton: true
65 showBackButton: true
63 onBackClicked: root.back();
66 onBackClicked: root.back();
64
67
@@ -79,22 +82,13 @@ Item {
79 }
82 }
80 }
83 }
81
84
82− DashContentOpenEffect {
83− id: openEffect
84− anchors {
85− fill: parent
86− bottomMargin: -bottomOverflow
87− }
88− sourceItem: scopeViewHolder
89− previewListView: previewListView
90− }
91−
92 PreviewListView {
85 PreviewListView {
93 id: previewListView
86 id: previewListView
94− openEffect: openEffect
87+ visible: x != width
95− categoryView: scopeView.categoryView
96 pageHeader: scopeItemPageHeader
88 pageHeader: scopeItemPageHeader
97 scope: root.scope
89 scope: root.scope
98− anchors.fill: parent
90+ width: parent.width
91+ height: parent.height
92+ anchors.left: scopeViewHolder.right
99 }
93 }
100}
94}