ubuntu-touch-coreapps-reviewers team mailing list archive

[Victor Thompson <victor.thompson@xxxxxxxxx>]

Victor Thompson has proposed merging lp:~vthompson/music-app/fix-1436771 into lp:music-app.

Commit message:
Make SongsPages and AlbumsPages adaptive

Requested reviews:
  Music App Developers (music-app-dev)
Related bugs:
  Bug #1436771 in Ubuntu Music App: "Some views not taking advantage of available screen space"
  https://bugs.launchpad.net/music-app/+bug/1436771

For more details, see:
https://code.launchpad.net/~vthompson/music-app/fix-1436771/+merge/254353

Make SongsPages and AlbumsPages adaptive. This allows for more space for the header element in the SongsPage and AlbumsPage to expand up until the width of the view is 60 GU--after which it does not expand. 60 GU seemed to be a nice number and even allows the Nexus 7 not to be seemingly over stretched.

Now on Nexus 7: http://i.imgur.com/KBEdjZk.png
Before on Nexus 7: http://i.imgur.com/pfSb1D0.png
-- 
Your team Music App Developers is requested to review the proposed merge of lp:~vthompson/music-app/fix-1436771 into lp:music-app.

=== modified file 'common/AlbumsPage.qml'
--- common/AlbumsPage.qml	2015-01-30 01:23:39 +0000
+++ common/AlbumsPage.qml	2015-03-27 04:48:24 +0000
@@ -48,13 +48,14 @@
             };
         }
         header: BlurredHeader {
+            id: blurredHeader
             rightColumn: Column {
                 spacing: units.gu(2)
                 Button {
                     id: shuffleRow
                     height: units.gu(4)
                     strokeColor: UbuntuColors.green
-                    width: units.gu(15)
+                    width: blurredHeader.width > units.gu(60) ? units.gu(23.5) : (blurredHeader.width - units.gu(13)) / 2
                     Text {
                         anchors {
                             centerIn: parent
@@ -74,7 +75,7 @@
                     id: queueAllRow
                     height: units.gu(4)
                     strokeColor: UbuntuColors.green
-                    width: units.gu(15)
+                    width: blurredHeader.width > units.gu(60) ? units.gu(23.5) : (blurredHeader.width - units.gu(13)) / 2
                     Text {
                         anchors {
                             centerIn: parent
@@ -96,12 +97,12 @@
                     height: units.gu(4)
                     // TRANSLATORS: this appears in a button with limited space (around 14 characters)
                     text: i18n.tr("Play all")
-                    width: units.gu(15)
+                    width: blurredHeader.width > units.gu(60) ? units.gu(23.5) : (blurredHeader.width - units.gu(13)) / 2
                     onClicked: trackClicked(songArtistModel, 0, true)
                 }
             }
             coverSources: albumStackPage.covers
-            height: units.gu(30)
+            height: blurredHeader.width > units.gu(60) ? units.gu(39.5) : ((blurredHeader.width - units.gu(5)) / 2) + units.gu(12)
             bottomColumn: Column {
                 Label {
                     id: artistLabel

=== modified file 'common/BlurredHeader.qml'
--- common/BlurredHeader.qml	2014-11-11 19:24:09 +0000
+++ common/BlurredHeader.qml	2015-03-27 04:48:24 +0000
@@ -21,7 +21,6 @@
 import Ubuntu.Components.ListItems 1.0 as ListItem
 
 ListItem.Standard {
-    id: albumInfo
     width: parent.width
 
     property alias bottomColumn: bottomColumnLoader.sourceComponent
@@ -44,7 +43,7 @@
             top: parent.top
             topMargin: units.gu(3)
         }
-        size: units.gu(18)
+        size: parent.width > units.gu(60) ? units.gu(27.5) : (parent.width - units.gu(5)) / 2
     }
 
     Loader {

=== modified file 'common/SongsPage.qml'
--- common/SongsPage.qml	2015-03-24 02:17:30 +0000
+++ common/SongsPage.qml	2015-03-27 04:48:24 +0000
@@ -296,13 +296,14 @@
         }
 
         header: BlurredHeader {
+            id: blurredHeader
             rightColumn: Column {
                 spacing: units.gu(2)
                 Button {
                     id: shuffleRow
                     height: units.gu(4)
                     strokeColor: UbuntuColors.green
-                    width: units.gu(15)
+                    width: blurredHeader.width > units.gu(60) ? units.gu(23.5) : (blurredHeader.width - units.gu(13)) / 2
                     Text {
                         anchors {
                             centerIn: parent
@@ -334,7 +335,7 @@
                     id: queueAllRow
                     height: units.gu(4)
                     strokeColor: UbuntuColors.green
-                    width: units.gu(15)
+                    width: blurredHeader.width > units.gu(60) ? units.gu(23.5) : (blurredHeader.width - units.gu(13)) / 2
                     Text {
                         anchors {
                             centerIn: parent
@@ -356,7 +357,7 @@
                     height: units.gu(4)
                     // TRANSLATORS: this appears in a button with limited space (around 14 characters)
                     text: i18n.tr("Play all")
-                    width: units.gu(15)
+                    width: blurredHeader.width > units.gu(60) ? units.gu(23.5) : (blurredHeader.width - units.gu(13)) / 2
                     onClicked: {
                         trackClicked(albumtrackslist.model, 0)  // play track
 
@@ -372,10 +373,11 @@
                     }
                 }
             }
+            property int baseHeight: header.width > units.gu(60) ? units.gu(39.5) : ((header.width - units.gu(5)) / 2) + units.gu(12)
             coverSources: songStackPage.covers
             height: songStackPage.line1 !== i18n.tr("Playlist") &&
                     songStackPage.line1 !== i18n.tr("Genre") ?
-                        units.gu(33) : units.gu(30)
+                        baseHeight + units.gu(3) : baseHeight
             bottomColumn: Column {
                 Label {
                     id: albumLabel