on xenial help sign in
Make "See Less" get stuck at the bottom of the view
db4d213Michał Sawicz
qml/Dash/GenericScopeView.qml+65−10
@@ -144,14 +144,16 @@ FocusScope {
144 x: previewListView.open ? -width : 0
144 x: previewListView.open ? -width : 0
145 Behavior on x { UbuntuNumberAnimation { } }
145 Behavior on x { UbuntuNumberAnimation { } }
146 width: parent.width
146 width: parent.width
147+ height: floatingSeeLess.visible ? parent.height - floatingSeeLess.height + floatingSeeLess.yOffset
148+ : parent.height
147− height: parent.height
149+ clip: height != parent.height
148
150
149 model: scopeView.categories
151 model: scopeView.categories
150 forceNoClip: previewListView.open
152 forceNoClip: previewListView.open
151 pixelAligned: true
153 pixelAligned: true
152 interactive: !navigationShown
154 interactive: !navigationShown
153
155
154− property string expandedCategoryId: ""
156+ property Item expandedCategoryItem: null
155
157
156 readonly property bool pageHeaderTotallyVisible: scopeView.showPageHeader &&
158 readonly property bool pageHeaderTotallyVisible: scopeView.showPageHeader &&
157 ((headerItemShownHeight == 0 && categoryView.contentY <= categoryView.originY) || (headerItemShownHeight == pageHeaderLoader.item.height))
159 ((headerItemShownHeight == 0 && categoryView.contentY <= categoryView.originY) || (headerItemShownHeight == pageHeaderLoader.item.height))
@@ -162,6 +164,8 @@ FocusScope {
162 highlightWhenPressed: false
164 highlightWhenPressed: false
163 showDivider: false
165 showDivider: false
164
166
167+ property Item seeAllButton: seeAll
168+
165 readonly property bool expandable: {
169 readonly property bool expandable: {
166 if (categoryView.model.count === 1) return false;
170 if (categoryView.model.count === 1) return false;
167 if (cardTool.template && cardTool.template["collapsed-rows"] === 0) return false;
171 if (cardTool.template && cardTool.template["collapsed-rows"] === 0) return false;
@@ -191,7 +195,7 @@ FocusScope {
191 // This can happen with the VJ that doesn't know how height it will be on creation
195 // This can happen with the VJ that doesn't know how height it will be on creation
192 // so doesn't set expandable until a bit too late for onLoaded
196 // so doesn't set expandable until a bit too late for onLoaded
193 if (expandable) {
197 if (expandable) {
194− var shouldExpand = baseItem.category === categoryView.expandedCategoryId;
198+ var shouldExpand = baseItem === categoryView.expandedCategoryItem;
195 baseItem.expand(shouldExpand, false /*animate*/);
199 baseItem.expand(shouldExpand, false /*animate*/);
196 }
200 }
197 }
201 }
@@ -242,7 +246,7 @@ FocusScope {
242 item.objectName = Qt.binding(function() { return categoryId })
246 item.objectName = Qt.binding(function() { return categoryId })
243 item.scopeStyle = scopeView.scopeStyle;
247 item.scopeStyle = scopeView.scopeStyle;
244 if (baseItem.expandable) {
248 if (baseItem.expandable) {
245− var shouldExpand = categoryId === categoryView.expandedCategoryId;
249+ var shouldExpand = baseItem === categoryView.expandedCategoryItem;
246 baseItem.expand(shouldExpand, false /*animate*/);
250 baseItem.expand(shouldExpand, false /*animate*/);
247 }
251 }
248 updateDelegateCreationRange();
252 updateDelegateCreationRange();
@@ -279,13 +283,13 @@ FocusScope {
279 }
283 }
280 Connections {
284 Connections {
281 target: categoryView
285 target: categoryView
282− onExpandedCategoryIdChanged: {
286+ onExpandedCategoryItemChanged: {
283 collapseAllButExpandedCategory();
287 collapseAllButExpandedCategory();
284 }
288 }
285 function collapseAllButExpandedCategory() {
289 function collapseAllButExpandedCategory() {
286 var item = rendererLoader.item;
290 var item = rendererLoader.item;
287 if (baseItem.expandable) {
291 if (baseItem.expandable) {
288− var shouldExpand = categoryId === categoryView.expandedCategoryId;
292+ var shouldExpand = baseItem === categoryView.expandedCategoryItem;
289 if (shouldExpand != baseItem.expanded) {
293 if (shouldExpand != baseItem.expanded) {
290 // If the filter animation will be seen start it, otherwise, just flip the switch
294 // If the filter animation will be seen start it, otherwise, just flip the switch
291 var shrinkingVisible = !shouldExpand && y + item.collapsedHeight + seeAll.height < categoryView.height;
295 var shrinkingVisible = !shouldExpand && y + item.collapsedHeight + seeAll.height < categoryView.height;
@@ -346,13 +350,13 @@ FocusScope {
346 left: parent.left
350 left: parent.left
347 right: parent.right
351 right: parent.right
348 }
352 }
349− height: seeAllLabel.visible ? seeAllLabel.font.pixelSize + units.gu(6) : 0
353+ height: seeAllLabel.visible ? seeAllLabel.font.pixelSize + units.gu(4) : 0
350
354
351 onClicked: {
355 onClicked: {
352− if (categoryView.expandedCategoryId != baseItem.category) {
356+ if (categoryView.expandedCategoryItem !== baseItem) {
353− categoryView.expandedCategoryId = baseItem.category;
357+ categoryView.expandedCategoryItem = baseItem;
354 } else {
358 } else {
355− categoryView.expandedCategoryId = "";
359+ categoryView.expandedCategoryItem = null;
356 }
360 }
357 }
361 }
358
362
@@ -443,6 +447,57 @@ FocusScope {
443 }
447 }
444 }
448 }
445
449
450+ AbstractButton {
451+ id: floatingSeeLess
452+ objectName: "floatingSeeLess"
453+
454+ property Item companionTo: companionBase ? companionBase.seeAllButton : null
455+ property Item companionBase: categoryView.expandedCategoryItem
456+ property bool showBecausePosition: false
457+ property real yOffset: 0
458+
459+ anchors {
460+ left: categoryView.left
461+ right: categoryView.right
462+ }
463+ y: parent.height - height + yOffset
464+ height: seeLessLabel.font.pixelSize + units.gu(4)
465+ visible: companionTo && showBecausePosition
466+
467+ onClicked: categoryView.expandedCategoryItem = null;
468+
469+ function updateVisibility() {
470+ var companionPos = companionTo.mapToItem(floatingSeeLess, 0, 0);
471+ showBecausePosition = companionPos.y > 0;
472+
473+ var posToBase = floatingSeeLess.mapToItem(companionBase, 0, -yOffset).y;
474+ yOffset = Math.max(0, companionBase.item.collapsedHeight - posToBase);
475+ yOffset = Math.min(yOffset, height);
476+ }
477+
478+ Label {
479+ id: seeLessLabel
480+ text: i18n.tr("See less")
481+ anchors {
482+ centerIn: parent
483+ verticalCenterOffset: units.gu(-0.5)
484+ }
485+ fontSize: "small"
486+ font.weight: Font.Bold
487+ color: scopeStyle ? scopeStyle.foreground : Theme.palette.normal.baseText
488+ }
489+
490+ Connections {
491+ target: floatingSeeLess.companionTo ? categoryView : null
492+ onContentYChanged: floatingSeeLess.updateVisibility();
493+ }
494+
495+ Connections {
496+ target: floatingSeeLess.companionTo
497+ onYChanged: floatingSeeLess.updateVisibility();
498+ }
499+ }
500+
446 LimitProxyModel {
501 LimitProxyModel {
447 id: previewLimitModel
502 id: previewLimitModel
448 }
503 }
tests/qmltests/Dash/tst_GenericScopeView.qml+7−3
@@ -227,11 +227,15 @@ Item {
227 shell.width = units.gu(20)
227 shell.width = units.gu(20)
228 var categoryListView = findChild(genericScopeView, "categoryListView");
228 var categoryListView = findChild(genericScopeView, "categoryListView");
229 categoryListView.contentY = units.gu(20);
229 categoryListView.contentY = units.gu(20);
230− var seeAll = findChild(category, "seeAll")
230+ var seeAll = findChild(category, "seeAll");
231+ var floatingSeeLess = findChild(genericScopeView, "floatingSeeLess");
231 mouseClick(seeAll, seeAll.width / 2, seeAll.height / 2);
232 mouseClick(seeAll, seeAll.width / 2, seeAll.height / 2);
232 tryCompare(category, "expanded", true);
233 tryCompare(category, "expanded", true);
234+ tryCompareFunction(function() {
235+ return category.item.height + floatingSeeLess.height ==
233− tryCompareFunction(function() { return category.item.height == genericScopeView.height - category.item.displayMarginBeginning - category.item.displayMarginEnd; }, true);
236+ genericScopeView.height - category.item.displayMarginBeginning - category.item.displayMarginEnd;
237+ }, true);
234− mouseClick(seeAll, seeAll.width / 2, seeAll.height / 2);
238+ mouseClick(floatingSeeLess, floatingSeeLess.width / 2, floatingSeeLess.height / 2);
235 tryCompare(category, "expanded", false);
239 tryCompare(category, "expanded", false);
236 }
240 }
237
241