on xenial help sign in
Add some spacing where the item is going to be dropped
1ecc557Albert Astals
qml/Dash/ScopesListCategory.qml+17−3
@@ -61,15 +61,27 @@ Item {
61 anchors.top: header.bottom
61 anchors.top: header.bottom
62 delegate: Loader {
62 delegate: Loader {
63 id: loader
63 id: loader
64+ readonly property bool addDropHint: {
65+ if (dragMarker.visible) {
66+ if (dragItem.originalIndex > index) {
67+ return dragMarker.index == index;
68+ } else {
69+ return dragMarker.index == index - 1;
70+ }
71+ } else {
72+ return false;
73+ }
74+ }
64 asynchronous: true
75 asynchronous: true
65 width: root.width
76 width: root.width
66− height: listItemHeight
77+ height: listItemHeight + (addDropHint ? units.gu(2) : 0)
67− clip: height != listItemHeight
78+ clip: height < listItemHeight
68 Behavior on height { enabled: visible; UbuntuNumberAnimation { } }
79 Behavior on height { enabled: visible; UbuntuNumberAnimation { } }
69 sourceComponent: ScopesListCategoryItem {
80 sourceComponent: ScopesListCategoryItem {
70 objectName: "delegate" + index
81 objectName: "delegate" + index
71
82
72 width: root.width
83 width: root.width
84+ topMargin: height > listItemHeight ? height - listItemHeight : 0
73
85
74 icon: model.art || ""
86 icon: model.art || ""
75 text: model.title || ""
87 text: model.title || ""
@@ -101,6 +113,7 @@ Item {
101 dragItem.text = text;
113 dragItem.text = text;
102 dragItem.subtext = subtext;
114 dragItem.subtext = subtext;
103 dragItem.originalY = mapToItem(root, 0, 0).y;
115 dragItem.originalY = mapToItem(root, 0, 0).y;
116+ dragItem.originalIndex = index;
104 dragItem.y = dragItem.originalY;
117 dragItem.y = dragItem.originalY;
105 dragItem.x = units.gu(1);
118 dragItem.x = units.gu(1);
106 dragItem.visible = true;
119 dragItem.visible = true;
@@ -136,13 +149,14 @@ Item {
136 if (i >= model.count - 1) i = model.count - 1;
149 if (i >= model.count - 1) i = model.count - 1;
137 return i;
150 return i;
138 }
151 }
139− y: list.y + index * listItemHeight
152+ y: list.y + index * listItemHeight + units.gu(1)
140 }
153 }
141
154
142 ScopesListCategoryItem {
155 ScopesListCategoryItem {
143 id: dragItem
156 id: dragItem
144
157
145 property real originalY
158 property real originalY
159+ property int originalIndex
146 property var loaderToShrink: null
160 property var loaderToShrink: null
147
161
148 objectName: "dragItem"
162 objectName: "dragItem"
qml/Dash/ScopesListCategoryItem.qml+63−56
@@ -25,6 +25,7 @@ MouseArea {
25 signal handlePressed(var handle)
25 signal handlePressed(var handle)
26 signal handleReleased(var handle)
26 signal handleReleased(var handle)
27
27
28+ property real topMargin: 0
28 property alias icon: shapeImage.source
29 property alias icon: shapeImage.source
29 property alias text: titleLabel.text
30 property alias text: titleLabel.text
30 property alias subtext: subtitleLabel.text
31 property alias subtext: subtitleLabel.text
@@ -33,65 +34,71 @@ MouseArea {
33 property bool isFavorite: false
34 property bool isFavorite: false
34 property bool hideChildren: false
35 property bool hideChildren: false
35
36
36− UbuntuShape {
37+ Item {
37− id: shape
38+ id: holder
38− anchors {
39+ anchors.fill: parent
39− left: parent.left
40+ anchors.topMargin: root.topMargin
40− leftMargin: units.gu(1)
41− verticalCenter: parent.verticalCenter
42− }
43− width: units.gu(5)
44− height: units.gu(5)
45− visible: !hideChildren
46− image: Image {
47− id: shapeImage
48− cache: true
49− fillMode: Image.PreserveAspectCrop
50− }
51− }
52
41
53− ColumnLayout {
42+ UbuntuShape {
43+ id: shape
44+ anchors {
45+ left: parent.left
46+ leftMargin: units.gu(1)
47+ verticalCenter: parent.verticalCenter
48+ }
49+ width: units.gu(5)
50+ height: units.gu(5)
54− visible: !hideChildren
51+ visible: !hideChildren
55− anchors {
52+ image: Image {
56− left: shape.right
53+ id: shapeImage
57− leftMargin: units.gu(1)
54+ cache: true
58− right: starArea.right
55+ fillMode: Image.PreserveAspectCrop
59− rightMargin: units.gu(1)
60− verticalCenter: parent.verticalCenter
61− }
62− Label {
63− id: titleLabel
64− elide: Text.ElideRight
65− wrapMode: Text.Wrap
66− maximumLineCount: 1
67− verticalAlignment: Text.AlignHCenter
68− }
56+ }
69− Label {
70− id: subtitleLabel
71− elide: Text.ElideRight
72− fontSize: "xx-small"
73− wrapMode: Text.Wrap
74− maximumLineCount: 1
75− verticalAlignment: Text.AlignHCenter
76− visible: text != ""
77 }
57 }
78− }
58+
79− MouseArea {
59+ ColumnLayout {
80− id: starArea
81− height: parent.height
82− width: height
83− anchors.right: parent.right
84− onClicked: if (!editMode) root.requestFavorite(model.scopeId, !isFavorite);
85− onPressed: if (editMode) root.handlePressed(starArea);
86− onReleased: if (editMode) root.handleReleased(starArea);
87− Icon {
88− id: star
89− anchors.centerIn: parent
90− height: units.gu(2)
91− width: units.gu(2)
92 visible: !hideChildren
60 visible: !hideChildren
61+ anchors {
62+ left: shape.right
63+ leftMargin: units.gu(1)
64+ right: starArea.right
65+ rightMargin: units.gu(1)
66+ verticalCenter: parent.verticalCenter
67+ }
68+ Label {
69+ id: titleLabel
70+ elide: Text.ElideRight
71+ wrapMode: Text.Wrap
72+ maximumLineCount: 1
73+ verticalAlignment: Text.AlignHCenter
74+ }
75+ Label {
76+ id: subtitleLabel
77+ elide: Text.ElideRight
78+ fontSize: "xx-small"
79+ wrapMode: Text.Wrap
80+ maximumLineCount: 1
81+ verticalAlignment: Text.AlignHCenter
82+ visible: text != ""
83+ }
84+ }
85+ MouseArea {
86+ id: starArea
87+ height: parent.height
88+ width: height
89+ anchors.right: parent.right
90+ onClicked: if (!editMode) root.requestFavorite(model.scopeId, !isFavorite);
91+ onPressed: if (editMode) root.handlePressed(starArea);
92+ onReleased: if (editMode) root.handleReleased(starArea);
93+ Icon {
94+ id: star
95+ anchors.centerIn: parent
96+ height: units.gu(2)
97+ width: units.gu(2)
98+ visible: !hideChildren
93− // TODO is view-grid-symbolic what we really want here? Looks good but seems semantically wrong
99+ // TODO is view-grid-symbolic what we really want here? Looks good but seems semantically wrong
94− source: editMode ? "image://theme/view-grid-symbolic" : isFavorite ? "image://theme/starred" : "image://theme/non-starred"
100+ source: editMode ? "image://theme/view-grid-symbolic" : isFavorite ? "image://theme/starred" : "image://theme/non-starred"
101+ }
95 }
102 }
96 }
103 }
97}
104}