Andrew Hayzen has proposed merging lp:~ahayzen/music-app/fix-1526274-use-layouts into lp:music-app.
Commit message: * Use ListItemLayout for listitems to improve performance and match design guidelines Requested reviews: Music App Developers (music-app-dev) For more details, see: https://code.launchpad.net/~ahayzen/music-app/fix-1526274-use-layouts/+merge/281757 * Use ListItemLayout for listitems to improve performance and match design guidelines Only issue with this is it changes the height of some of the listitems to be larger. This is because the ListItemLayout matches the 'design guidelines', we can reduce the vertical padding but should be approval from design first :-) -- Your team Music App Developers is requested to review the proposed merge of lp:~ahayzen/music-app/fix-1526274-use-layouts into lp:music-app.
=== modified file 'app/components/Delegates/MusicListItem.qml' --- app/components/Delegates/MusicListItem.qml 2015-10-29 23:02:17 +0000 +++ app/components/Delegates/MusicListItem.qml 2016-01-06 15:08:47 +0000 @@ -1,5 +1,5 @@ /* - * Copyright (C) 2013, 2014, 2015 + * Copyright (C) 2013, 2014, 2015, 2016 * Andrew Hayzen <[email protected]> * Nekhelesh Ramananthan <[email protected]> * Victor Thompson <[email protected]> @@ -23,17 +23,20 @@ ListItem { color: styleMusic.mainView.backgroundColor + height: listItemLayout.height highlightColor: Qt.lighter(color, 1.2) // Store the currentColor so that actions can bind to it property var currentColor: highlighted ? highlightColor : color - property alias column: musicRow.column - property alias imageSource: musicRow.imageSource + property alias imageSource: image.imageSource property bool multiselectable: false property bool reorderable: false + property alias subtitle: listItemLayout.subtitle + property alias title: listItemLayout.title + signal itemClicked() onClicked: { @@ -58,27 +61,45 @@ visible: false } - MusicRow { - id: musicRow - anchors { - fill: parent - // When not in selectMode we want a margin between the Image and the left edge - // when in selectMode the checkbox has its own margin so we don't want a double margin - leftMargin: selectMode ? 0 : units.gu(2) - rightMargin: selectMode ? 0 : units.gu(2) - } - - // Animate margin changes so it isn't noticible - Behavior on anchors.leftMargin { - NumberAnimation { - - } - } - - Behavior on anchors.rightMargin { - NumberAnimation { - - } + ListItemLayout { + id: listItemLayout + subtitle.color: styleMusic.common.subtitle + subtitle.wrapMode: Text.WrapAnywhere + title.color: styleMusic.common.music + title.wrapMode: Text.WrapAnywhere + + Image { + id: image + anchors { + verticalCenter: parent.verticalCenter + } + asynchronous: true + fillMode: Image.PreserveAspectCrop + height: width + SlotsLayout.position: SlotsLayout.Leading + source: { + if (imageSource !== undefined && imageSource !== "") { + if (imageSource.art !== undefined) { + imageSource.art + } else { + "image://albumart/artist=" + imageSource.author + "&album=" + imageSource.album + } + } else { + "" + } + } + sourceSize.height: height + sourceSize.width: width + width: units.gu(6) + visible: imageSource !== undefined + + onStatusChanged: { + if (status === Image.Error) { + source = Qt.resolvedUrl("../graphics/[email protected]") + } + } + + property var imageSource } } } === removed file 'app/components/MusicRow.qml' --- app/components/MusicRow.qml 2015-10-18 18:16:05 +0000 +++ app/components/MusicRow.qml 1970-01-01 00:00:00 +0000 @@ -1,79 +0,0 @@ -/* - * Copyright (C) 2013, 2014, 2015 - * Andrew Hayzen <[email protected]> - * Nekhelesh Ramananthan <[email protected]> - * Victor Thompson <[email protected]> - * - * This program is free software; you can redistribute it and/or modify - * it under the terms of the GNU General Public License as published by - * the Free Software Foundation; version 3. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU General Public License - * along with this program. If not, see <http://www.gnu.org/licenses/>. - */ - -import QtQuick 2.4 -import Ubuntu.Components 1.3 - - -Row { - height: units.gu(7) - - property alias column: columnComponent.sourceComponent - property real coverSize: styleMusic.common.albumSize - property var imageSource - - spacing: units.gu(2) - - Image { - id: image - anchors { - verticalCenter: parent.verticalCenter - } - asynchronous: true - fillMode: Image.PreserveAspectCrop - height: width - source: imageSource !== undefined && imageSource !== "" - ? (imageSource.art !== undefined - ? imageSource.art - : "image://albumart/artist=" + imageSource.author + "&album=" + imageSource.album) - : "" - sourceSize.height: height - sourceSize.width: width - width: units.gu(6) - - onStatusChanged: { - if (status === Image.Error) { - source = Qt.resolvedUrl("../graphics/[email protected]") - } - } - visible: imageSource !== undefined - } - - Loader { - id: columnComponent - anchors { - verticalCenter: parent.verticalCenter - } - width: imageSource === undefined ? parent.width - parent.spacing - : parent.width - image.width - parent.spacing - - onSourceComponentChanged: { - for (var i=0; i < item.children.length; i++) { - item.children[i].elide = Text.ElideRight - item.children[i].height = units.gu(2) - item.children[i].maximumLineCount = 1 - item.children[i].wrapMode = Text.NoWrap - item.children[i].verticalAlignment = Text.AlignVCenter - - // binds to width so it is updated when screen size changes - item.children[i].width = Qt.binding(function () { return width; }) - } - } - } -} === modified file 'app/components/Queue.qml' --- app/components/Queue.qml 2015-10-18 18:16:05 +0000 +++ app/components/Queue.qml 2016-01-06 15:08:47 +0000 @@ -1,5 +1,5 @@ /* - * Copyright (C) 2013, 2014, 2015 + * Copyright (C) 2013, 2014, 2015, 2016 * Andrew Hayzen <[email protected]> * Daniel Holm <[email protected]> * Victor Thompson <[email protected]> @@ -42,23 +42,6 @@ delegate: MusicListItem { id: queueListItem color: player.currentIndex === index ? "#2c2c34" : styleMusic.mainView.backgroundColor - column: Column { - Label { - id: trackTitle - color: player.currentIndex === index ? UbuntuColors.blue : styleMusic.common.music - fontSize: "small" - objectName: "titleLabel" - text: model.title - } - - Label { - id: trackArtist - color: styleMusic.common.subtitle - fontSize: "x-small" - objectName: "artistLabel" - text: model.author - } - } leadingActions: ListItemActions { actions: [ Remove { @@ -69,6 +52,11 @@ multiselectable: true objectName: "nowPlayingListItem" + index reorderable: true + title.color: player.currentIndex === index ? UbuntuColors.blue : styleMusic.common.music + title.text: model.title + title.objectName: "titleLabel" + subtitle.text: model.author + subtitle.objectName: "artistLabel" trailingActions: ListItemActions { actions: [ AddToPlaylist { === modified file 'app/ui/Songs.qml' --- app/ui/Songs.qml 2015-10-18 18:16:05 +0000 +++ app/ui/Songs.qml 2016-01-06 15:08:47 +0000 @@ -1,5 +1,5 @@ /* - * Copyright (C) 2013, 2014, 2015 + * Copyright (C) 2013, 2014, 2015, 2016 * Andrew Hayzen <[email protected]> * Daniel Holm <[email protected]> * Victor Thompson <[email protected]> @@ -93,25 +93,11 @@ delegate: MusicListItem { id: track objectName: "tracksPageListItem" + index - column: Column { - Label { - id: trackTitle - color: styleMusic.common.music - fontSize: "small" - objectName: "tracktitle" - text: model.title - } - - Label { - id: trackArtist - color: styleMusic.common.subtitle - fontSize: "x-small" - text: model.author - } - } - height: units.gu(7) imageSource: {"art": model.art} multiselectable: true + title.text: model.title + title.objectName: "tracktitle" + subtitle.text: model.author trailingActions: AddToQueueAndPlaylist { } === modified file 'app/ui/SongsView.qml' --- app/ui/SongsView.qml 2015-10-28 01:05:33 +0000 +++ app/ui/SongsView.qml 2016-01-06 15:08:47 +0000 @@ -1,5 +1,5 @@ /* - * Copyright (C) 2013, 2014, 2015 + * Copyright (C) 2013, 2014, 2015, 2016 * Andrew Hayzen <[email protected]> * Daniel Holm <[email protected]> * Victor Thompson <[email protected]> @@ -297,27 +297,13 @@ delegate: MusicListItem { id: track objectName: "songsPageListItem" + index - column: Column { - Label { - id: trackTitle - color: styleMusic.common.music - fontSize: "small" - objectName: "songspage-tracktitle" - text: model.title - } - - Label { - id: trackArtist - color: styleMusic.common.subtitle - fontSize: "x-small" - text: model.author - } - } - height: units.gu(6) leadingActions: songStackPage.line1 === i18n.tr("Playlist") ? playlistRemoveAction.item : null multiselectable: true reorderable: songStackPage.line1 === i18n.tr("Playlist") + title.text: model.title + title.objectName: "songspage-tracktitle" + subtitle.text: model.author trailingActions: AddToQueueAndPlaylist { } === modified file 'debian/changelog' --- debian/changelog 2015-12-23 02:07:46 +0000 +++ debian/changelog 2016-01-06 15:08:47 +0000 @@ -2,6 +2,7 @@ [ Andrew Hayzen ] * Release 2.2ubuntu2 and start on 2.3 + * Use ListItemLayout for listitems to improve performance and match design guidelines (LP: #1526247). [ Ken VanDine ] * Install the content-hub json file in the correct place for peer registry
-- Mailing list: https://launchpad.net/~ubuntu-touch-coreapps-reviewers Post to : [email protected] Unsubscribe : https://launchpad.net/~ubuntu-touch-coreapps-reviewers More help : https://help.launchpad.net/ListHelp

