[vlc-devel] [PATCH 11/38] qml: add progressbar to the miniplayer

[Fatih Uzunoglu]

+ some layout changes
---
 modules/gui/qt/player/qml/MiniPlayer.qml | 208 +++++++++++++----------
 modules/gui/qt/style/VLCStyle.qml        |   2 +-
 2 files changed, 119 insertions(+), 91 deletions(-)

diff --git a/modules/gui/qt/player/qml/MiniPlayer.qml b/modules/gui/qt/player/qml/MiniPlayer.qml
index 4ee41d91de..7ec5995733 100644
--- a/modules/gui/qt/player/qml/MiniPlayer.qml
+++ b/modules/gui/qt/player/qml/MiniPlayer.qml
@@ -49,127 +49,155 @@ Widgets.NavigableFocusScope {
         to: 0
     }
 
-    Rectangle {
-
+    Column {
         anchors.left: parent.left
         anchors.right: parent.right
 
-        height: VLCStyle.miniPlayerHeight
-        color: VLCStyle.colors.banner
-
-        RowLayout {
-            anchors.fill: parent
-            anchors.leftMargin: VLCStyle.applicationHorizontalMargin
-            anchors.rightMargin: VLCStyle.applicationHorizontalMargin
-            anchors.bottomMargin: VLCStyle.applicationVerticalMargin
-
-            Widgets.FocusBackground {
-                id: playingItemInfo
-                Layout.fillHeight: true
-                Layout.preferredWidth: playingItemInfoRow.implicitWidth
-                width: childrenRect.width
-                focus: true
-
-                MouseArea {
-                    anchors.fill: parent
-                    onClicked: history.push(["player"])
-                }
+        spacing: VLCStyle.dp(-progressBar.height / 2)
 
-                Keys.onPressed: {
-                    if (KeyHelper.matchOk(event) ) {
-                        event.accepted = true
-                    }
-                }
-                Keys.onReleased: {
-                    if (!event.accepted && KeyHelper.matchOk(event))
-                        history.push(["player"])
+        SliderBar {
+            id: progressBar
+            value: player.position
+            visible: progressBar.value >= 0.0 && progressBar.value <= 1.0
+            z: 1
+
+            isMiniplayer: true
+
+            anchors {
+                left: parent.left
+                right: parent.right
+            }
+        }
+
+        Rectangle {
+            anchors {
+                left: parent.left
+                right: parent.right
+            }
+            z: 0
+            height: VLCStyle.miniPlayerHeight
+            color: VLCStyle.colors.banner
+
+            RowLayout {
+                anchors {
+                    fill: parent
+
+                    leftMargin: VLCStyle.applicationHorizontalMargin
+                    rightMargin: VLCStyle.applicationHorizontalMargin
+                    bottomMargin: VLCStyle.applicationVerticalMargin
                 }
 
-                Row {
-                    id: playingItemInfoRow
-                    anchors.top: parent.top
-                    anchors.bottom: parent.bottom
+                Widgets.FocusBackground {
+                    id: playingItemInfo
+                    Layout.fillHeight: true
+                    Layout.preferredWidth: playingItemInfoRow.implicitWidth
+                    width: childrenRect.width
+                    focus: true
 
-                    rightPadding: VLCStyle.margin_normal
+                    MouseArea {
+                        anchors.fill: parent
+                        onClicked: history.push(["player"])
+                    }
+
+                    Keys.onPressed: {
+                        if (KeyHelper.matchOk(event) ) {
+                            event.accepted = true
+                        }
+                    }
+                    Keys.onReleased: {
+                        if (!event.accepted && KeyHelper.matchOk(event))
+                            history.push(["player"])
+                    }
 
-                    Image {
-                        id: cover
-                        source: (mainPlaylistController.currentItem.artwork && mainPlaylistController.currentItem.artwork.toString())
-                                ? mainPlaylistController.currentItem.artwork
-                                : VLCStyle.noArtAlbum
-                        fillMode: Image.PreserveAspectFit
 
+                    Row {
+                        id: playingItemInfoRow
                         anchors.top: parent.top
                         anchors.bottom: parent.bottom
-                    }
-
-                    Column {
                         anchors.verticalCenter: parent.verticalCenter
+
                         leftPadding: VLCStyle.margin_normal
 
-                        Widgets.MenuLabel {
-                            id: titleLabel
-                            text: mainPlaylistController.currentItem.title
-                        }
+                        Image {
+                            id: cover
+                            anchors.verticalCenter: parent.verticalCenter
+
+                            source: (mainPlaylistController.currentItem.artwork && mainPlaylistController.currentItem.artwork.toString())
+                                    ? mainPlaylistController.currentItem.artwork
+                                    : VLCStyle.noArtAlbum
+                            fillMode: Image.PreserveAspectFit
 
-                        Widgets.MenuCaption {
-                            id: artistLabel
-                            text: mainPlaylistController.currentItem.artist
+                            width: VLCStyle.dp(60)
+                            height: VLCStyle.dp(60)
                         }
 
-                        Widgets.MenuCaption {
-                            id: progressIndicator
-                            text: player.time.toString() + " / " + player.length.toString()
+                        Column {
+                            anchors.verticalCenter: parent.verticalCenter
+                            leftPadding: VLCStyle.margin_xsmall
+
+                            Widgets.MenuLabel {
+                                id: titleLabel
+                                text: mainPlaylistController.currentItem.title
+                            }
+
+                            Widgets.MenuCaption {
+                                id: artistLabel
+                                text: mainPlaylistController.currentItem.artist
+                            }
+
+                            Widgets.MenuCaption {
+                                id: progressIndicator
+                                text: player.time.toString() + " / " + player.length.toString()
+                            }
                         }
                     }
-                }
 
-                KeyNavigation.right: buttonrow
-            }
+                    KeyNavigation.right: buttonrow
+                }
 
-            Item {
-                Layout.fillWidth: true
-            }
+                Item {
+                    Layout.fillWidth: true
+                }
 
-            PlayerButtonsLayout {
-                id: buttonrow
+                PlayerButtonsLayout {
+                    id: buttonrow
 
-                model: miniPlayerModel
-                defaultSize: VLCStyle.icon_normal
+                    model: miniPlayerModel
+                    defaultSize: VLCStyle.icon_normal
 
-                Layout.alignment: Qt.AlignVCenter
-                Layout.rightMargin: VLCStyle.margin_normal
-                Layout.preferredWidth: buttonrow.implicitWidth
-                Layout.preferredHeight: buttonrow.implicitHeight
+                    Layout.alignment: Qt.AlignVCenter
+                    Layout.rightMargin: VLCStyle.margin_normal
+                    Layout.preferredWidth: buttonrow.implicitWidth
+                    Layout.preferredHeight: buttonrow.implicitHeight
 
-                navigationParent: root
-                navigationLeftItem: playingItemInfo
+                    navigationParent: root
+                    navigationLeftItem: playingItemInfo
+                }
             }
-        }
 
-        Connections{
-            target: mainInterface
-            onToolBarConfUpdated: {
-                miniPlayerModel.reloadModel()
+            Connections{
+                target: mainInterface
+                onToolBarConfUpdated: {
+                    miniPlayerModel.reloadModel()
+                }
             }
-        }
 
-        PlayerControlBarModel {
-            id: miniPlayerModel
-            mainCtx: mainctx
-            configName: "MiniPlayerToolbar"
-        }
+            PlayerControlBarModel {
+                id: miniPlayerModel
+                mainCtx: mainctx
+                configName: "MiniPlayerToolbar"
+            }
 
-        ControlButtons {
-            id: controlmodelbuttons
-        }
+            ControlButtons {
+                id: controlmodelbuttons
+            }
 
-        Keys.onPressed: {
-            if (!event.accepted)
-                defaultKeyAction(event, 0)
-            if (!event.accepted)
-                mainInterface.sendHotkey(event.key, event.modifiers);
+            Keys.onPressed: {
+                if (!event.accepted)
+                    defaultKeyAction(event, 0)
+                if (!event.accepted)
+                    mainInterface.sendHotkey(event.key, event.modifiers);
+            }
         }
-
     }
 }
diff --git a/modules/gui/qt/style/VLCStyle.qml b/modules/gui/qt/style/VLCStyle.qml
index 49bc56a5fd..26e0767bae 100644
--- a/modules/gui/qt/style/VLCStyle.qml
+++ b/modules/gui/qt/style/VLCStyle.qml
@@ -120,7 +120,7 @@ Item {
 
     property real network_normal: dp(100, scale)
 
-    property int miniPlayerHeight: dp(60, scale)
+    property int miniPlayerHeight: dp(76, scale)
 
     property int expandAlbumTracksHeight: dp(200, scale)
 
-- 
2.25.1