[vlc-devel] [PATCH 1/6] qt: qml: update "enable aligned player controlbar customization" patch

Fatih Uzunoglu fuzun54 at outlook.com
Fri Nov 20 19:32:30 CET 2020


due to an incident, a preliminary and incomplete version of "enable aligned player controlbar customization" patch was merged. this update ensures that the latest and the most tested version of the patch is available.
---
 .../dialogs/toolbar/qml/EditorDNDDelegate.qml |  81 +++++-
 .../qt/dialogs/toolbar/qml/EditorDNDView.qml  |  67 +++--
 .../dialogs/toolbar/qml/EditorTabButton.qml   |  22 +-
 .../qt/dialogs/toolbar/qml/ToolbarEditor.qml  | 233 ++++++++++++++----
 .../toolbar/qml/ToolbarEditorButtonList.qml   |  89 +++++--
 .../gui/qt/dialogs/toolbar/toolbareditor.cpp  |  20 +-
 .../gui/qt/dialogs/toolbar/toolbareditor.hpp  |   2 -
 .../gui/qt/player/playercontrolbarmodel.cpp   |  33 ++-
 .../gui/qt/player/playercontrolbarmodel.hpp   |   2 +
 modules/gui/qt/player/qml/ControlBar.qml      |   4 -
 modules/gui/qt/player/qml/MiniPlayer.qml      |   9 -
 11 files changed, 432 insertions(+), 130 deletions(-)

diff --git a/modules/gui/qt/dialogs/toolbar/qml/EditorDNDDelegate.qml b/modules/gui/qt/dialogs/toolbar/qml/EditorDNDDelegate.qml
index b52a09b94e..a11f21291a 100644
--- a/modules/gui/qt/dialogs/toolbar/qml/EditorDNDDelegate.qml
+++ b/modules/gui/qt/dialogs/toolbar/qml/EditorDNDDelegate.qml
@@ -32,12 +32,31 @@ MouseArea {
     property bool dropVisible: false
     property var dndView: null
     anchors.verticalCenter: parent.verticalCenter
-    cursorShape: dropVisible ? Qt.DragMoveCursor : Qt.OpenHandCursor
+    cursorShape: Qt.OpenHandCursor
     drag.target: held ? content : undefined
     width: buttonloader.width
     height: VLCStyle.icon_medium
     hoverEnabled: true
 
+    property alias containsDrag: dropArea.containsDrag
+
+    onHeldChanged: {
+        if (held) {
+            removeInfoRectVisible = true
+        }
+        else {
+            removeInfoRectVisible = false
+        }
+    }
+
+    Rectangle {
+        z: -1
+        anchors.fill: parent
+
+        visible: dragArea.containsMouse && !held
+        color: VLCStyle.colors.bgHover
+    }
+
     Rectangle {
         z: 1
         width: VLCStyle.dp(2, VLCStyle.scale)
@@ -45,27 +64,39 @@ MouseArea {
         anchors {
             left: parent.left
             verticalCenter: parent.verticalCenter
+            leftMargin: index === 0 ? 0 : -width
         }
         antialiasing: true
         visible: dropVisible
         color: VLCStyle.colors.accent
     }
-    onPressed: held = true
+
+    onPressed: {
+        held = true
+        root._held = true
+    }
+
     onEntered: playerBtnDND.currentIndex = index
 
-    onExited: {
-        if(containsPress)
-            dndView.deleteBtn = true
+    onWheel: {
+        playerBtnDND.wheelScroll(wheel.angleDelta.y)
     }
 
     onReleased: {
         drag.target.Drag.drop()
         held = false
-        if(dndView.deleteBtn){
-            dndView.deleteBtn = false
-            dndView.model.remove(
-                        dragArea.DelegateModel.itemsIndex)
-        }
+        root._held = false
+    }
+
+    onPositionChanged: {
+        var pos = this.mapToGlobal(mouseX, mouseY)
+        updatePos(pos.x, pos.y)
+    }
+
+    function updatePos(x, y) {
+        var pos = root.mapFromGlobal(x, y)
+        content.x = pos.x
+        content.y = pos.y
     }
 
     Rectangle {
@@ -76,6 +107,9 @@ MouseArea {
             horizontalCenter: parent.horizontalCenter
             verticalCenter: parent.verticalCenter
         }
+
+        opacity: held ? 0.75 : 1.0
+
         Loader{
             id: buttonloader
             anchors {
@@ -96,22 +130,42 @@ MouseArea {
                 anchors { horizontalCenter: undefined; verticalCenter: undefined }
             }
         }
+
+        onXChanged: {
+            root.handleScroll(this)
+        }
     }
+
     DropArea {
+        id: dropArea
         anchors.fill: parent
 
         onEntered: {
+            if ((drag.source === null ||
+                 (drag.source.dndView === playerBtnDND &&
+                  (parent.DelegateModel.itemsIndex === drag.source.DelegateModel.itemsIndex + 1))))
+                return
+
+            if (held)
+                return
+
             dropVisible = true
-            dndView.deleteBtn = false
         }
 
         onExited: {
+            if (held)
+                return
+
             dropVisible = false
-            if(!dndView.addBtn)
-                dndView.deleteBtn = true
         }
 
         onDropped: {
+            if (!dropVisible)
+                return
+
+            if (held)
+                return
+
             if (drag.source.dndView === playerBtnDND) {
                 // moving from same section
                 var srcIndex = drag.source.DelegateModel.itemsIndex
@@ -128,6 +182,7 @@ MouseArea {
             else {
                 // moving between sections
                 dndView.model.insert(parent.DelegateModel.itemsIndex, {"id" : drag.source.controlId})
+                drag.source.dndView.model.remove(drag.source.DelegateModel.itemsIndex)
             }
 
             dropVisible = false
diff --git a/modules/gui/qt/dialogs/toolbar/qml/EditorDNDView.qml b/modules/gui/qt/dialogs/toolbar/qml/EditorDNDView.qml
index 4a2b9638eb..b44077ea30 100644
--- a/modules/gui/qt/dialogs/toolbar/qml/EditorDNDView.qml
+++ b/modules/gui/qt/dialogs/toolbar/qml/EditorDNDView.qml
@@ -25,25 +25,45 @@ import "qrc:///style/"
 
 ListView {
     id: playerBtnDND
-    spacing: VLCStyle.margin_xxsmall
+    spacing: VLCStyle.margin_xsmall
     orientation: Qt.Horizontal
     clip: true
-    property bool deleteBtn: false
-    property bool addBtn: false
-    onDeleteBtnChanged: {
-        if(deleteBtn)
-            toolbareditor.deleteCursor()
+
+    property bool containsDrag: footerItem.dropVisible
+
+    property alias scrollBar: scrollBar
+
+    ScrollBar.horizontal: ScrollBar {
+        id: scrollBar
+        policy: playerBtnDND.contentWidth > playerBtnDND.width ? ScrollBar.AlwaysOn : ScrollBar.AsNeeded
+    }
+
+    function wheelScroll(delta) {
+        if (delta > 0)
+            scrollBar.decrease()
         else
-            toolbareditor.restoreCursor()
+            scrollBar.increase()
     }
 
-    ScrollBar.horizontal: ScrollBar {}
+    MouseArea {
+        anchors.fill: parent
+        z: 1
 
-    footer: Item {
+        visible: root._held
+
+        cursorShape: visible ? Qt.DragMoveCursor : Qt.ArrowCursor
+    }
+
+    footer: MouseArea {
         height: VLCStyle.icon_medium
-        width: height
+        width: Math.max(height, playerBtnDND.width - x)
         anchors.verticalCenter: parent.verticalCenter
         property bool dropVisible: false
+
+        onWheel: {
+            wheelScroll(wheel.angleDelta.y)
+        }
+
         Rectangle {
             z: 2
             width: VLCStyle.dp(2, VLCStyle.scale)
@@ -59,16 +79,20 @@ ListView {
             anchors.fill: parent
 
             onEntered: {
+                if (drag.source.dndView === playerBtnDND && drag.source.DelegateModel.itemsIndex === playerBtnDND.count - 1)
+                    return
+
                 dropVisible = true
-                playerBtnDND.deleteBtn = false
             }
 
             onExited: {
                 dropVisible = false
-                playerBtnDND.deleteBtn = true
             }
 
             onDropped: {
+                if (!dropVisible)
+                    return
+
                 if (drag.source.dndView === playerBtnDND) {
                     // moving from same section
                     playerBtnDND.model.move(drag.source.DelegateModel.itemsIndex, playerBtnDND.count - 1)
@@ -80,22 +104,25 @@ ListView {
                 else {
                     // moving between sections
                     playerBtnDND.model.insert(playerBtnDND.count, {"id" : drag.source.controlId})
+                    drag.source.dndView.model.remove(drag.source.DelegateModel.itemsIndex)
                 }
 
                 dropVisible = false
             }
         }
-
     }
 
     delegate: EditorDNDDelegate {
         dndView: playerBtnDND
-    }
-    highlight: Rectangle{
-        anchors.verticalCenter: currentIndex > 0 ? parent.verticalCenter : undefined
-        color: VLCStyle.colors.bgHover
-    }
 
-    highlightMoveDuration: 0 //ms
-    highlightResizeDuration: 0 //ms
+        onContainsDragChanged: {
+            for(var child in playerBtnDND.contentItem.children) {
+                if (playerBtnDND.contentItem.children[child].containsDrag === true) {
+                    playerBtnDND.containsDrag = true
+                    return
+                }
+            }
+            playerBtnDND.containsDrag = Qt.binding(function() { return footerItem.dropVisible; } )
+        }
+    }
 }
diff --git a/modules/gui/qt/dialogs/toolbar/qml/EditorTabButton.qml b/modules/gui/qt/dialogs/toolbar/qml/EditorTabButton.qml
index 7623729942..b9a105e580 100644
--- a/modules/gui/qt/dialogs/toolbar/qml/EditorTabButton.qml
+++ b/modules/gui/qt/dialogs/toolbar/qml/EditorTabButton.qml
@@ -26,6 +26,8 @@ TabButton {
     property int index: 0
     property bool active: index == bar.currentIndex
 
+    implicitWidth: VLCStyle.button_width_large
+
     contentItem: Text {
         text: mainPlayerControl.text
         color: VLCStyle.colors.buttonText
@@ -34,9 +36,23 @@ TabButton {
     }
 
     background: Rectangle {
-        width: VLCStyle.button_width_large
-        height: VLCStyle.heightBar_normal
         color: active ? VLCStyle.colors.bgAlt : hovered ? VLCStyle.colors.bgHover : VLCStyle.colors.bg
-        radius: 2
+
+        border.color: VLCStyle.colors.accent
+        border.width: active ? VLCStyle.dp(1, VLCStyle.scale) : 0
+
+        Rectangle {
+            width: parent.width - parent.border.width * 2
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.top: parent.bottom
+
+            anchors.topMargin: -(height / 2)
+
+            color: parent.color
+
+            visible: active
+
+            height: parent.border.width * 2
+        }
     }
 }
diff --git a/modules/gui/qt/dialogs/toolbar/qml/ToolbarEditor.qml b/modules/gui/qt/dialogs/toolbar/qml/ToolbarEditor.qml
index 846f84c748..607b36b0c2 100644
--- a/modules/gui/qt/dialogs/toolbar/qml/ToolbarEditor.qml
+++ b/modules/gui/qt/dialogs/toolbar/qml/ToolbarEditor.qml
@@ -29,42 +29,69 @@ Rectangle{
     id: root
     color: VLCStyle.colors.bg
 
+    property bool _held: false
+
+    property alias removeInfoRectVisible: buttonList.removeInfoRectVisible
+
+    MouseArea {
+        anchors.fill: parent
+        z: -1
+
+        visible: _held
+
+        cursorShape: visible ? Qt.ForbiddenCursor : Qt.ArrowCursor
+    }
+
     ColumnLayout{
         anchors.fill: parent
         spacing: 0
+
         TabBar {
             id: bar
             Layout.preferredHeight: VLCStyle.heightBar_normal
-            Layout.preferredWidth: VLCStyle.button_width_large * bar.count
+
+            z: 1
+
+            spacing: VLCStyle.dp(1) // this causes binding loop warning in Qt 5.11.3 probably due to a bug
 
             EditorTabButton {
                 id: mainPlayerTab
+
+                anchors.top: parent.top
+                anchors.bottom: parent.bottom
+
                 index: 0
                 text: i18n.qtr("Mainplayer")
             }
 
             EditorTabButton {
                 id: miniPlayerTab
+
+                anchors.top: parent.top
+                anchors.bottom: parent.bottom
+
                 index: 1
                 text: i18n.qtr("Miniplayer")
             }
         }
+
         Rectangle{
-            Layout.preferredHeight: VLCStyle.heightBar_large
+            Layout.preferredHeight: VLCStyle.heightBar_large * 1.25
             Layout.fillWidth: true
-            radius: 2
+
             color: VLCStyle.colors.bgAlt
 
+            border.color: VLCStyle.colors.accent
+            border.width: VLCStyle.dp(1, VLCStyle.scale)
+
             StackLayout{
                 anchors.fill: parent
                 currentIndex: bar.currentIndex
 
                 RowLayout {
-                    Layout.preferredHeight: VLCStyle.heightBar_large
+                    Layout.preferredHeight: VLCStyle.heightBar_large * 1.25
                     Layout.fillWidth: true
 
-                    spacing: VLCStyle.margin_xlarge
-
                     TextMetrics {
                         id: leftMetric
                         text: i18n.qtr("L   E   F   T")
@@ -85,19 +112,18 @@ Rectangle{
 
                     EditorDNDView {
                         id : playerBtnDND_left
-                        Layout.preferredHeight: VLCStyle.heightBar_large
+                        Layout.fillHeight: true
 
-                        Layout.alignment: Qt.AlignLeft
                         Layout.fillWidth: count > 0 || (playerBtnDND_left.count === 0 && playerBtnDND_center.count === 0 && playerBtnDND_right.count === 0)
-                        Layout.minimumWidth: leftMetric.width
+                        Layout.minimumWidth: centerMetric.width
+                        Layout.leftMargin: VLCStyle.margin_xsmall
+                        Layout.rightMargin: VLCStyle.margin_xsmall
 
                         model: playerControlBarModel_left
 
                         Text {
-                            anchors.centerIn: parent
+                            anchors.fill: parent
 
-                            height: parent.height
-                            width: parent.width / 2
                             text: leftMetric.text
                             verticalAlignment: Text.AlignVCenter
                             font.pixelSize: VLCStyle.fontSize_xxlarge
@@ -107,21 +133,31 @@ Rectangle{
                         }
                     }
 
+                    Rectangle {
+                        Layout.preferredWidth: VLCStyle.margin_small
+
+                        Layout.fillHeight: true
+                        Layout.topMargin: VLCStyle.dp(1, VLCStyle.scale)
+                        Layout.bottomMargin: VLCStyle.dp(1, VLCStyle.scale)
+                        Layout.alignment: Qt.AlignVCenter
+
+                        color: VLCStyle.colors.bg
+                    }
+
                     EditorDNDView {
                         id : playerBtnDND_center
-                        Layout.preferredHeight: VLCStyle.heightBar_large
+                        Layout.fillHeight: true
 
-                        Layout.alignment: Qt.AlignHCenter
                         Layout.fillWidth: count > 0 || (playerBtnDND_left.count === 0 && playerBtnDND_center.count === 0 && playerBtnDND_right.count === 0)
                         Layout.minimumWidth: centerMetric.width
+                        Layout.leftMargin: VLCStyle.margin_xsmall
+                        Layout.rightMargin: VLCStyle.margin_xsmall
 
                         model: playerControlBarModel_center
 
                         Text {
-                            anchors.centerIn: parent
+                            anchors.fill: parent
 
-                            height: parent.height
-                            width: parent.width / 2
                             text: centerMetric.text
                             verticalAlignment: Text.AlignVCenter
                             font.pixelSize: VLCStyle.fontSize_xxlarge
@@ -131,21 +167,31 @@ Rectangle{
                         }
                     }
 
+                    Rectangle {
+                        Layout.preferredWidth: VLCStyle.margin_small
+
+                        Layout.fillHeight: true
+                        Layout.topMargin: VLCStyle.dp(1, VLCStyle.scale)
+                        Layout.bottomMargin: VLCStyle.dp(1, VLCStyle.scale)
+                        Layout.alignment: Qt.AlignVCenter
+
+                        color: VLCStyle.colors.bg
+                    }
+
                     EditorDNDView {
                         id : playerBtnDND_right
-                        Layout.preferredHeight: VLCStyle.heightBar_large
+                        Layout.fillHeight: true
 
-                        Layout.alignment: Qt.AlignRight
                         Layout.fillWidth: count > 0 || (playerBtnDND_left.count === 0 && playerBtnDND_center.count === 0 && playerBtnDND_right.count === 0)
-                        Layout.minimumWidth: rightMetric.width
+                        Layout.minimumWidth: centerMetric.width
+                        Layout.leftMargin: VLCStyle.margin_xsmall
+                        Layout.rightMargin: VLCStyle.margin_xsmall
 
                         model: playerControlBarModel_right
 
                         Text {
-                            anchors.centerIn: parent
+                            anchors.fill: parent
 
-                            height: parent.height
-                            width: parent.width / 2
                             text: rightMetric.text
                             verticalAlignment: Text.AlignVCenter
                             font.pixelSize: VLCStyle.fontSize_xxlarge
@@ -157,26 +203,23 @@ Rectangle{
                 }
 
                 RowLayout {
-                    Layout.preferredHeight: VLCStyle.heightBar_large
+                    Layout.preferredHeight: VLCStyle.heightBar_large * 1.25
                     Layout.fillWidth: true
 
-                    spacing: VLCStyle.margin_xlarge
-
                     EditorDNDView {
                         id : miniPlayerBtnDND_left
-                        Layout.preferredHeight: VLCStyle.heightBar_large
+                        Layout.fillHeight: true
 
-                        Layout.alignment: Qt.AlignLeft
                         Layout.fillWidth: count > 0 || (miniPlayerBtnDND_left.count === 0 && miniPlayerBtnDND_center.count === 0 && miniPlayerBtnDND_right.count === 0)
-                        Layout.minimumWidth: leftMetric.width
+                        Layout.minimumWidth: centerMetric.width
+                        Layout.leftMargin: VLCStyle.margin_xsmall
+                        Layout.rightMargin: VLCStyle.margin_xsmall
 
                         model: miniPlayerModel_left
 
                         Text {
-                            anchors.centerIn: parent
+                            anchors.fill: parent
 
-                            height: parent.height
-                            width: parent.width / 2
                             text: leftMetric.text
                             verticalAlignment: Text.AlignVCenter
                             font.pixelSize: VLCStyle.fontSize_xxlarge
@@ -186,21 +229,31 @@ Rectangle{
                         }
                     }
 
+                    Rectangle {
+                        Layout.preferredWidth: VLCStyle.margin_small
+
+                        Layout.fillHeight: true
+                        Layout.topMargin: VLCStyle.dp(1, VLCStyle.scale)
+                        Layout.bottomMargin: VLCStyle.dp(1, VLCStyle.scale)
+                        Layout.alignment: Qt.AlignVCenter
+
+                        color: VLCStyle.colors.bg
+                    }
+
                     EditorDNDView {
                         id : miniPlayerBtnDND_center
-                        Layout.preferredHeight: VLCStyle.heightBar_large
+                        Layout.fillHeight: true
 
-                        Layout.alignment: Qt.AlignHCenter
                         Layout.fillWidth: count > 0 || (miniPlayerBtnDND_left.count === 0 && miniPlayerBtnDND_center.count === 0 && miniPlayerBtnDND_right.count === 0)
                         Layout.minimumWidth: centerMetric.width
+                        Layout.leftMargin: VLCStyle.margin_xsmall
+                        Layout.rightMargin: VLCStyle.margin_xsmall
 
                         model: miniPlayerModel_center
 
                         Text {
-                            anchors.centerIn: parent
+                            anchors.fill: parent
 
-                            height: parent.height
-                            width: parent.width / 2
                             text: centerMetric.text
                             verticalAlignment: Text.AlignVCenter
                             font.pixelSize: VLCStyle.fontSize_xxlarge
@@ -210,21 +263,31 @@ Rectangle{
                         }
                     }
 
+                    Rectangle {
+                        Layout.preferredWidth: VLCStyle.margin_small
+
+                        Layout.fillHeight: true
+                        Layout.topMargin: VLCStyle.dp(1, VLCStyle.scale)
+                        Layout.bottomMargin: VLCStyle.dp(1, VLCStyle.scale)
+                        Layout.alignment: Qt.AlignVCenter
+
+                        color: VLCStyle.colors.bg
+                    }
+
                     EditorDNDView {
                         id : miniPlayerBtnDND_right
-                        Layout.preferredHeight: VLCStyle.heightBar_large
+                        Layout.fillHeight: true
 
-                        Layout.alignment: Qt.AlignRight
                         Layout.fillWidth: count > 0 || (miniPlayerBtnDND_left.count === 0 && miniPlayerBtnDND_center.count === 0 && miniPlayerBtnDND_right.count === 0)
-                        Layout.minimumWidth: rightMetric.width
+                        Layout.minimumWidth: centerMetric.width
+                        Layout.leftMargin: VLCStyle.margin_xsmall
+                        Layout.rightMargin: VLCStyle.margin_xsmall
 
                         model: miniPlayerModel_right
 
                         Text {
-                            anchors.centerIn: parent
+                            anchors.fill: parent
 
-                            height: parent.height
-                            width: parent.width / 2
                             text: rightMetric.text
                             verticalAlignment: Text.AlignVCenter
                             font.pixelSize: VLCStyle.fontSize_xxlarge
@@ -255,6 +318,8 @@ Rectangle{
                 }
 
                 ToolbarEditorButtonList {
+                    id: buttonList
+
                     Layout.fillWidth: true
                     Layout.fillHeight: true
                     Layout.margins: VLCStyle.margin_xxsmall
@@ -357,15 +422,88 @@ Rectangle{
         id: buttonDragItem
         visible: false
         Drag.active: visible
-        Drag.hotSpot.x: width / 2
-        Drag.hotSpot.y: height / 2
         color: VLCStyle.colors.buttonText
 
+        opacity: 0.75
+
         function updatePos(x, y) {
             var pos = root.mapFromGlobal(x, y)
-            this.x = pos.x - 20
-            this.y = pos.y - 20
+            this.x = pos.x
+            this.y = pos.y
+        }
+
+        onXChanged: {
+            handleScroll(this)
+        }
+    }
+
+    property int _scrollingDirection: 0
+
+    function getHoveredListView() {
+        if (playerBtnDND_left.containsDrag)
+            return playerBtnDND_left
+        else if (playerBtnDND_center.containsDrag)
+            return playerBtnDND_center
+        else if (playerBtnDND_right.containsDrag)
+            return playerBtnDND_right
+        else if (miniPlayerBtnDND_left.containsDrag)
+            return miniPlayerBtnDND_left
+        else if (miniPlayerBtnDND_center.containsDrag)
+            return miniPlayerBtnDND_center
+        else if (miniPlayerBtnDND_right.containsDrag)
+            return miniPlayerBtnDND_right
+        else
+            return undefined
+    }
+
+    function handleScroll(dragItem) {
+        var view = root.getHoveredListView()
+
+        if (view === undefined) {
+            upAnimation.target = null
+            downAnimation.target = null
+
+            _scrollingDirection = 0
+            return
+        }
+
+        upAnimation.target = view
+        downAnimation.target = view
+
+        downAnimation.to = Qt.binding(function() { return view.contentWidth - view.width; })
+
+        var dragItemX = root.mapToGlobal(dragItem.x, dragItem.y).x
+        var viewX     = root.mapToGlobal(view.x, view.y).x
+
+        var leftDiff  = (viewX + VLCStyle.dp(20, VLCStyle.scale)) - dragItemX
+        var rightDiff = dragItemX - (viewX + view.width - VLCStyle.dp(20, VLCStyle.scale))
+
+        if( !view.atXBeginning && leftDiff > 0 ) {
+            _scrollingDirection = -1
+        }
+        else if( !view.atXEnd && rightDiff > 0 ) {
+            _scrollingDirection = 1
         }
+        else {
+            _scrollingDirection = 0
+        }
+    }
+
+    SmoothedAnimation {
+        id: upAnimation
+        property: "contentX"
+        to: 0
+        running: root._scrollingDirection === -1 && target !== null
+
+        velocity: VLCStyle.dp(150, VLCStyle.scale)
+    }
+
+    SmoothedAnimation {
+        id: downAnimation
+        property: "contentX"
+        running: root._scrollingDirection === 1 && target !== null
+
+        velocity: VLCStyle.dp(150, VLCStyle.scale)
     }
 
     /*
@@ -379,4 +517,3 @@ Rectangle{
                                ";selection-background-color:"+
                                VLCStyle.colors.bgHover);
 }
-
diff --git a/modules/gui/qt/dialogs/toolbar/qml/ToolbarEditorButtonList.qml b/modules/gui/qt/dialogs/toolbar/qml/ToolbarEditorButtonList.qml
index 4eaf9f9b60..93eb2c0c50 100644
--- a/modules/gui/qt/dialogs/toolbar/qml/ToolbarEditorButtonList.qml
+++ b/modules/gui/qt/dialogs/toolbar/qml/ToolbarEditorButtonList.qml
@@ -36,7 +36,72 @@ GridView{
 
     highlightMoveDuration: 0 //ms
 
-    delegate:MouseArea{
+    property alias removeInfoRectVisible: removeInfoRect.visible
+
+    DropArea {
+        id: dropArea
+        anchors.fill: parent
+
+        z: 3
+
+        function isFromList() {
+            if (drag.source.objectName === "buttonsList")
+                return true
+            else
+                return false
+        }
+
+        onDropped: {
+            if (isFromList())
+                return
+
+            drag.source.dndView.model.remove(drag.source.DelegateModel.itemsIndex)
+        }
+    }
+
+    Rectangle {
+        id: removeInfoRect
+        anchors.fill: parent
+        z: 2
+
+        visible: false
+
+        opacity: 0.8
+        color: VLCStyle.colors.bg
+
+        border.color: VLCStyle.colors.menuCaption
+        border.width: VLCStyle.dp(2, VLCStyle.scale)
+
+        Text {
+            anchors.centerIn: parent
+
+            text: VLCIcons.del
+            verticalAlignment: Text.AlignVCenter
+            horizontalAlignment: Text.AlignHCenter
+
+            font.pointSize: VLCStyle.fontHeight_xxxlarge
+
+            font.family: VLCIcons.fontFamily
+            color: VLCStyle.colors.menuCaption
+        }
+
+        MouseArea {
+            anchors.fill: parent
+
+            cursorShape: visible ? Qt.DragMoveCursor : Qt.ArrowCursor
+        }
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        z: 1
+
+        visible: root._held
+
+        cursorShape: visible ? Qt.DragMoveCursor : Qt.ArrowCursor
+    }
+
+    delegate: MouseArea {
         id:dragArea
         objectName: "buttonsList"
         hoverEnabled: true
@@ -53,27 +118,21 @@ GridView{
             buttonDragItem.text = controlButtons.buttonL[model.index].label
             buttonDragItem.Drag.source = dragArea
             held = true
-            var pos = this.mapToGlobal( mouseX, mouseY)
-            buttonDragItem.updatePos(pos.x, pos.y)
-            playerBtnDND_left.addBtn = true
-            playerBtnDND_center.addBtn = true
-            playerBtnDND_right.addBtn = true
-            miniPlayerBtnDND_left.addBtn = true
-            miniPlayerBtnDND_center.addBtn = true
-            miniPlayerBtnDND_right.addBtn = true
+            root._held = true
         }
 
         onReleased: {
             drag.target.Drag.drop()
             buttonDragItem.visible = false
             held = false
-            playerBtnDND_left.addBtn = false
-            playerBtnDND_center.addBtn = false
-            playerBtnDND_right.addBtn = false
-            miniPlayerBtnDND_left.addBtn = false
-            miniPlayerBtnDND_center.addBtn = false
-            miniPlayerBtnDND_right.addBtn = false
+            root._held = false
         }
+
+        onPositionChanged: {
+            var pos = this.mapToGlobal(mouseX, mouseY)
+            buttonDragItem.updatePos(pos.x, pos.y)
+        }
+
         onEntered: allButtonsView.currentIndex = index
 
         ColumnLayout{
diff --git a/modules/gui/qt/dialogs/toolbar/toolbareditor.cpp b/modules/gui/qt/dialogs/toolbar/toolbareditor.cpp
index 1e84e76f12..d6efb5584a 100644
--- a/modules/gui/qt/dialogs/toolbar/toolbareditor.cpp
+++ b/modules/gui/qt/dialogs/toolbar/toolbareditor.cpp
@@ -80,11 +80,16 @@ ToolbarEditorDialog::ToolbarEditorDialog( QWidget *_w, intf_thread_t *_p_intf)
     /* Load defaults ones if we have no combos */
     if( i_size == 0 )
     {
+        profileCombo->addItem( qtr("Default Style"), PlayerControlBarModel::getSerializedDefaultStyle() );
         profileCombo->addItem( PROFILE_NAME_1, QString( VALUE_1 ) );
         profileCombo->addItem( PROFILE_NAME_2, QString( VALUE_2 ) );
         profileCombo->addItem( PROFILE_NAME_3, QString( VALUE_3 ) );
+        profileCombo->setCurrentIndex(0);
+    }
+    else
+    {
+        profileCombo->setCurrentIndex( -1 );
     }
-    profileCombo->setCurrentIndex( -1 );
 
     /* Drag and Drop */
     editorView = new QQuickWidget(this);
@@ -175,7 +180,8 @@ void ToolbarEditorDialog::changeProfile( int i )
 {
     QStringList qs_list = profileCombo->itemData( i ).toString().split( "|" );
     if( qs_list.count() < 2 )
-            return;
+        return;
+
     QStringList align_list_main = qs_list[0].split("#");
     QStringList align_list_mini = qs_list[1].split("#");
 
@@ -199,13 +205,3 @@ void ToolbarEditorDialog::changeProfile( int i )
     else
         emit updatePlayerModel("MiniPlayerToolbar-right", "");
 }
-
-void ToolbarEditorDialog::deleteCursor()
-{
-    QApplication::setOverrideCursor(Qt::ForbiddenCursor);
-}
-
-void ToolbarEditorDialog::restoreCursor()
-{
-    QApplication::restoreOverrideCursor();
-}
diff --git a/modules/gui/qt/dialogs/toolbar/toolbareditor.hpp b/modules/gui/qt/dialogs/toolbar/toolbareditor.hpp
index 2002b335a2..01d27b0efc 100644
--- a/modules/gui/qt/dialogs/toolbar/toolbareditor.hpp
+++ b/modules/gui/qt/dialogs/toolbar/toolbareditor.hpp
@@ -37,8 +37,6 @@ public:
 public slots:
     Q_INVOKABLE void close();
     Q_INVOKABLE void cancel();
-    Q_INVOKABLE void deleteCursor();
-    Q_INVOKABLE void restoreCursor();
 
 private slots:
     void newProfile();
diff --git a/modules/gui/qt/player/playercontrolbarmodel.cpp b/modules/gui/qt/player/playercontrolbarmodel.cpp
index efb82f8285..479ef42eaa 100644
--- a/modules/gui/qt/player/playercontrolbarmodel.cpp
+++ b/modules/gui/qt/player/playercontrolbarmodel.cpp
@@ -27,8 +27,7 @@ enum default_align {
     ALIGN_SIZE
 };
 
-static const QVector<PlayerControlBarModel::IconToolButton> MAIN_TB_DEFAULT[default_align::ALIGN_SIZE] =
-{
+static const QVector<PlayerControlBarModel::IconToolButton> MAIN_TB_DEFAULT[default_align::ALIGN_SIZE] = {
     {
         // left
         {PlayerControlBarModel::LANG_BUTTON},
@@ -49,8 +48,7 @@ static const QVector<PlayerControlBarModel::IconToolButton> MAIN_TB_DEFAULT[defa
     }
 };
 
-static const QVector<PlayerControlBarModel::IconToolButton> MINI_TB_DEFAULT[default_align::ALIGN_SIZE] =
-{
+static const QVector<PlayerControlBarModel::IconToolButton> MINI_TB_DEFAULT[default_align::ALIGN_SIZE] = {
     {
         // left
         {PlayerControlBarModel::ARTWORK_INFO}
@@ -262,6 +260,33 @@ void PlayerControlBarModel::setConfigName(QString name)
     emit configNameChanged(name);
 }
 
+QString PlayerControlBarModel::getSerializedDefaultStyle()
+{
+    QString out;
+
+    auto serialize = [](auto style)
+    {
+          QString _out;
+          for (size_t i = 0; i < default_align::ALIGN_SIZE; i++)
+          {
+              for (const auto& it : style[i])
+              {
+                  _out += QString::number(it.id) + ";";
+              }
+              _out.chop(1);
+              _out += "#";
+          }
+          _out.chop(1);
+          return _out;
+    };
+
+    out += serialize(MAIN_TB_DEFAULT);
+    out += " | ";
+    out += serialize(MINI_TB_DEFAULT);
+
+    return out;
+}
+
 void PlayerControlBarModel::insert(int index, QVariantMap bdata)
 {
     beginInsertRows(QModelIndex(),index,index);
diff --git a/modules/gui/qt/player/playercontrolbarmodel.hpp b/modules/gui/qt/player/playercontrolbarmodel.hpp
index 43c85df938..d439bbbdb0 100644
--- a/modules/gui/qt/player/playercontrolbarmodel.hpp
+++ b/modules/gui/qt/player/playercontrolbarmodel.hpp
@@ -103,6 +103,8 @@ public:
     inline QString getConfigName() { return configName; }
     void setConfigName(QString name);
 
+    static QString getSerializedDefaultStyle();
+
 signals:
     void ctxChanged(QmlMainContext*);
     void configNameChanged(QString);
diff --git a/modules/gui/qt/player/qml/ControlBar.qml b/modules/gui/qt/player/qml/ControlBar.qml
index fc0080544e..d02503b3af 100644
--- a/modules/gui/qt/player/qml/ControlBar.qml
+++ b/modules/gui/qt/player/qml/ControlBar.qml
@@ -145,10 +145,6 @@ Widgets.NavigableFocusScope {
                 Keys.onPressed: defaultKeyAction(event, 0)
             }
 
-            Item {
-                Layout.fillWidth: true
-            }
-
             PlayerButtonsLayout {
                 id: buttons_right
 
diff --git a/modules/gui/qt/player/qml/MiniPlayer.qml b/modules/gui/qt/player/qml/MiniPlayer.qml
index d201f32935..482c17aaac 100644
--- a/modules/gui/qt/player/qml/MiniPlayer.qml
+++ b/modules/gui/qt/player/qml/MiniPlayer.qml
@@ -144,9 +144,6 @@ Widgets.NavigableFocusScope {
                         else
                             root.navigationUp(index)
                     }
-
-                    Keys.priority: Keys.AfterItem
-                    Keys.onPressed: defaultKeyAction(event, 0)
                 }
 
                 PlayerButtonsLayout {
@@ -169,9 +166,6 @@ Widgets.NavigableFocusScope {
                         else
                             root.navigationUp(index)
                     }
-
-                    Keys.priority: Keys.AfterItem
-                    Keys.onPressed: defaultKeyAction(event, 0)
                 }
 
                 PlayerButtonsLayout {
@@ -200,9 +194,6 @@ Widgets.NavigableFocusScope {
                         else
                             root.navigationUp(index)
                     }
-
-                    Keys.priority: Keys.AfterItem
-                    Keys.onPressed: defaultKeyAction(event, 0)
                 }
             }
 
-- 
2.27.0



More information about the vlc-devel mailing list