on xenial help sign in
Add a no-group section and fix styling

* Adds a "no grouping" section, called "Apps" * Makes the grid of icons a bit wider and taller * Better fits app labels into the Drawer

commitacc1ca9ffb84e16b99272ac74fccb551b785f418 authorDalton Durst <d@ltondur.st> dateMon 1 Apr 2019, 14:55 (8 years ago) parent9406499
2 files changed+40−48
qml/Launcher/Drawer.qml+38−46 qml/Launcher/DrawerGridView.qml+2−2
qml/Launcher/Drawer.qml+38−46
@@ -121,11 +121,14 @@ FocusScope {
121121
122122 actions: [
123123 Action {
124− text: i18n.ctr("Apps sorted alphabetically", "A-Z")
124+ text: i18n.tr("Apps")
125+ },
126+ Action {
127+ text: i18n.ctr("Apps sorted and grouped alphabetically", "A-Z")
125128 // TODO: Disabling this for now as we don't get the right input from u-a-l yet.
126−// },
127−// Action {
128−// text: i18n.ctr("Most used apps", "Most used")
129+ // },
130+ // Action {
131+ // text: i18n.ctr("Most used apps", "Most used")
129132 }
130133 ]
131134
@@ -179,8 +182,8 @@ FocusScope {
179182
180183 sourceComponent: {
181184 switch (sections.selectedIndex) {
182− case 0: return aToZComponent;
183− case 1: return mostUsedComponent;
185+ case 0: return singleGroupComponent;
186+ case 1: return aToZComponent;
184187 }
185188 }
186189 Binding {
@@ -225,49 +228,42 @@ FocusScope {
225228 }
226229
227230 Component {
228− id: mostUsedComponent
231+ id: singleGroupComponent
229232 DrawerListView {
230− id: mostUsedListView
231−
232− header: MoreAppsHeader {
233− width: parent.width
234− height: units.gu(6)
235− highlighted: headerFocusScope.activeFocus
236− onClicked: headerFocusScope.trigger();
237− }
233+ id: singleGroupListView
238234
239− model: AppDrawerProxyModel {
240− source: sortProxyModel
241− group: AppDrawerProxyModel.GroupByAll
242− sortBy: AppDrawerProxyModel.SortByUsage
243− dynamicSortFilter: false
235+ model: ListModel {
236+ id: singleGroupModel
237+ Component.onCompleted: {
238+ append({"name": i18n.tr("Apps")});
239+ }
244240 }
245241
246− delegate: UbuntuShape {
242+ delegate: Item {
247243 width: parent.width - units.gu(2)
248244 anchors.horizontalCenter: parent.horizontalCenter
249− color: "#20ffffff"
250− aspect: UbuntuShape.Flat
251− // NOTE: Cannot use gridView.rows here as it would evaluate to 0 at first and only update later,
252− // which messes up the ListView.
253− height: (Math.ceil(mostUsedGridView.model.count / mostUsedGridView.columns) * mostUsedGridView.delegateHeight) + units.gu(2)
254245
255246 readonly property string appId: model.appId
256247
257− DrawerGridView {
258− id: mostUsedGridView
259− anchors.fill: parent
260− topMargin: units.gu(1)
261− bottomMargin: units.gu(1)
262− clip: true
248+ // NOTE: Cannot use gridView.rows here as it would evaluate to 0 at first and only update later,
249+ // which messes up the ListView.
250+ height: (Math.ceil(gridView.model.count / gridView.columns) * gridView.delegateHeight) + units.gu(2)
263251
264− interactive: true
265− focus: index == mostUsedListView.currentIndex
252+ DrawerGridView {
253+ id: gridView
254+ anchors { left: parent.left; top: parent.top; right: parent.right; topMargin: units.gu(1) }
255+ height: rows * delegateHeight
266256
267− model: sortProxyModel
257+ interactive: false
258+ focus: index == aToZListView.currentIndex
268259
260+ model: AppDrawerProxyModel {
261+ id: categoryModel
262+ source: sortProxyModel
263+ dynamicSortFilter: false
264+ }
269265 delegateWidth: root.delegateWidth
270− delegateHeight: units.gu(10)
266+ delegateHeight: units.gu(11)
271267 delegate: drawerDelegateComponent
272268 }
273269 }
@@ -279,13 +275,6 @@ FocusScope {
279275 DrawerListView {
280276 id: aToZListView
281277
282− header: MoreAppsHeader {
283− width: parent.width
284− height: units.gu(6)
285− highlighted: headerFocusScope.activeFocus
286− onClicked: headerFocusScope.trigger();
287− }
288−
289278 model: AppDrawerProxyModel {
290279 source: sortProxyModel
291280 sortBy: AppDrawerProxyModel.SortByAToZ
@@ -327,7 +316,7 @@ FocusScope {
327316 dynamicSortFilter: false
328317 }
329318 delegateWidth: root.delegateWidth
330− delegateHeight: units.gu(10)
319+ delegateHeight: units.gu(11)
331320 delegate: drawerDelegateComponent
332321 }
333322 }
@@ -340,7 +329,7 @@ FocusScope {
340329 AbstractButton {
341330 id: drawerDelegate
342331 width: GridView.view.cellWidth
343− height: units.gu(10)
332+ height: units.gu(11)
344333 objectName: "drawerItem_" + model.appId
345334
346335 readonly property bool focused: index === GridView.view.currentIndex && GridView.view.activeFocus
@@ -349,7 +338,7 @@ FocusScope {
349338 z: loader.active ? 1 : 0
350339
351340 Column {
352− width: units.gu(8)
341+ width: units.gu(9)
353342 anchors.horizontalCenter: parent.horizontalCenter
354343 height: childrenRect.height
355344 spacing: units.gu(1)
@@ -382,8 +371,11 @@ FocusScope {
382371 id: label
383372 text: model.name
384373 width: parent.width
374+ anchors.horizontalCenter: parent.horizontalCenter
385375 horizontalAlignment: Text.AlignHCenter
386376 fontSize: "small"
377+ wrapMode: Text.WordWrap
378+ maximumLineCount: 2
387379 elide: Text.ElideRight
388380
389381 Loader {
qml/Launcher/DrawerGridView.qml+2−2
@@ -20,8 +20,8 @@ import "../Components"
2020FocusScope {
2121 id: root
2222
23− property int delegateWidth: units.gu(10)
24− property int delegateHeight: units.gu(10)
23+ property int delegateWidth: units.gu(11)
24+ property int delegateHeight: units.gu(11)
2525 property alias delegate: gridView.delegate
2626 property alias model: gridView.model
2727 property alias interactive: gridView.interactive