Scale all QML elements according to the current display size

LenaPi/PlayerControlPannel.qml

@@ -1,4 +1,5 @@
 import QtQuick 2.0
+import QtQuick.Layouts 1.3
 
 Rectangle {
     id: container
@@ -6,28 +7,29 @@ Rectangle {
     property int margins
 
     color: "#99ffffff"
-    height: 140
+    height: content.height + 2* margins //StyleSizes.playerControlPanelHeight
 
-    MediaProgress{
-       id: progress
-       anchors.top: parent.top
-       anchors.left: parent.left
-       anchors.right: parent.right
-       anchors.margins: container.margins
 
-       model: container.model
-       // might require height for labels to be shown on RasPi (Qt 5.10)
-       //2019-04-04: defined in MediaProgress.qml -> test on rasPi
-    }
-
-    PlayerButtons{
-        id: buttons
+    ColumnLayout{
+        id: content
+        spacing: StyleSpacings.smallSpacing
+        anchors.margins: container.margins
         anchors.left: parent.left
         anchors.right: parent.right
-        anchors.top: progress.bottom
-        anchors.bottom: parent.bottom
 
-        model: container.model
-        spacing: 20
+        MediaProgress{
+           id: progress
+
+           model: container.model
+        }
+
+        PlayerButtons{
+            id: buttons
+            Layout.alignment: Qt.AlignHCenter
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+            model: container.model
+            spacing: StyleSpacings.defaultSpacing
+        }
     }
 }