[vlc-devel] [PATCH 08/27] qml: make aligned controlbar setup reusable
Fatih Uzunoglu
fuzun54 at outlook.com
Fri Dec 4 00:01:43 CET 2020
Instead of creating separate left, center, and right button layouts in players; use PlayerButtonsLayout.
With this patch PlayerButtonsLayout.qml content is moved to ButtonsLayout.qml. And PlayerButtonsLayout.qml now handles three separate button layouts itself.
---
modules/gui/qt/Makefile.am | 1 +
modules/gui/qt/player/qml/ButtonsLayout.qml | 110 +++++++++++++
modules/gui/qt/player/qml/ControlBar.qml | 91 ++--------
modules/gui/qt/player/qml/MiniPlayer.qml | 104 +-----------
.../gui/qt/player/qml/PlayerButtonsLayout.qml | 155 ++++++++++--------
modules/gui/qt/vlc.qrc | 1 +
6 files changed, 219 insertions(+), 243 deletions(-)
create mode 100644 modules/gui/qt/player/qml/ButtonsLayout.qml
diff --git a/modules/gui/qt/Makefile.am b/modules/gui/qt/Makefile.am
index 35c8e6223d..668af1f625 100644
--- a/modules/gui/qt/Makefile.am
+++ b/modules/gui/qt/Makefile.am
@@ -673,6 +673,7 @@ libqt_plugin_la_QML = \
gui/qt/player/qml/TopBar.qml \
gui/qt/player/qml/TrackInfo.qml \
gui/qt/player/qml/VolumeWidget.qml \
+ gui/qt/player/qml/ButtonsLayout.qml \
gui/qt/playlist/qml/PLItem.qml \
gui/qt/playlist/qml/PlaylistListView.qml \
gui/qt/playlist/qml/PlaylistMenu.qml \
diff --git a/modules/gui/qt/player/qml/ButtonsLayout.qml b/modules/gui/qt/player/qml/ButtonsLayout.qml
new file mode 100644
index 0000000000..b3a596b167
--- /dev/null
+++ b/modules/gui/qt/player/qml/ButtonsLayout.qml
@@ -0,0 +1,110 @@
+/*****************************************************************************
+ * Copyright (C) 2019 VLC authors and VideoLAN
+ *
+ * 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; either version 2 of the License, or
+ * ( at your option ) any later version.
+ *
+ * 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, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston MA 02110-1301, USA.
+ *****************************************************************************/
+import QtQuick 2.11
+import QtQuick.Controls 2.4
+import QtQuick.Layouts 1.3
+import QtQml.Models 2.11
+
+import org.videolan.vlc 0.1
+
+import "qrc:///style/"
+import "qrc:///widgets/" as Widgets
+
+Widgets.NavigableFocusScope {
+ id: buttonsLayout
+
+ property alias model: buttonsRepeater.model
+ property var defaultSize: VLCStyle.icon_normal
+ property bool forceColors: false
+
+ implicitWidth: buttonrow.implicitWidth
+ implicitHeight: buttonrow.implicitHeight
+
+ visible: model.count > 0
+
+ Keys.priority: Keys.AfterItem
+ Keys.onPressed: {
+ if (!event.accepted)
+ defaultKeyAction(event, 0)
+ }
+
+ RowLayout {
+ id: buttonrow
+ property bool _focusGiven: false
+
+ anchors.fill: parent
+
+ spacing: VLCStyle.margin_normal
+
+ VLCColors {
+ id: vlcNightColors
+ state: "night"
+ }
+
+ Repeater {
+ id: buttonsRepeater
+
+ onItemRemoved: {
+ if (item.focus) {
+ buttonrow._focusGiven = false
+ }
+ }
+
+ delegate: Loader {
+ id: buttonloader
+
+ sourceComponent: controlmodelbuttons.returnbuttondelegate(
+ model.id)
+ onLoaded: {
+ if (!buttonrow._focusGiven) {
+ buttonloader.focus = true
+ buttonrow._focusGiven = true
+ }
+ buttonloader.item.focus = true
+
+ if (buttonloader.item instanceof Widgets.IconToolButton)
+ buttonloader.item.size = buttonsLayout.defaultSize
+
+ //force buttons color
+ if (buttonsLayout.forceColors) {
+ if (buttonloader.item._colors) {
+ buttonloader.item._colors = vlcNightColors
+ } else {
+ if (buttonloader.item.color)
+ buttonloader.item.color = VLCStyle.colors.playerFg
+ if (buttonloader.item.bgColor)
+ buttonloader.item.bgColor = VLCStyle.colors.setColorAlpha(
+ VLCStyle.colors.playerBg, 0.8)
+ if (buttonloader.item.borderColor)
+ buttonloader.item.borderColor = VLCStyle.colors.playerBorder
+ }
+ }
+
+ if (index > 0)
+ buttonloader.item.KeyNavigation.left = buttonrow.children[index].item
+
+ if (buttonloader.item.navigationRight !== undefined)
+ buttonloader.item.navigationRight = buttonsLayout.navigationRight
+
+ if (buttonloader.item.navigationLeft !== undefined)
+ buttonloader.item.navigationLeft = buttonsLayout.navigationLeft
+ }
+ }
+ }
+ }
+}
diff --git a/modules/gui/qt/player/qml/ControlBar.qml b/modules/gui/qt/player/qml/ControlBar.qml
index d02503b3af..47506f5afc 100644
--- a/modules/gui/qt/player/qml/ControlBar.qml
+++ b/modules/gui/qt/player/qml/ControlBar.qml
@@ -84,7 +84,7 @@ Widgets.NavigableFocusScope {
Layout.alignment: Qt.AlignLeft | Qt.AlignTop
Layout.fillWidth: true
enabled: player.playingState == PlayerController.PLAYING_STATE_PLAYING || player.playingState == PlayerController.PLAYING_STATE_PAUSED
- Keys.onDownPressed: buttons_left.focus = true
+ Keys.onDownPressed: playerButtonsLayout.focus = true
parentWindow: mainInterfaceRect
}
@@ -92,91 +92,27 @@ Widgets.NavigableFocusScope {
Item {
Layout.fillWidth: true
Layout.bottomMargin: VLCStyle.margin_xsmall
- Layout.preferredHeight: Math.max(buttons_left.implicitHeight, buttons_center.implicitHeight, buttons_right.implicitHeight)
+ Layout.preferredHeight: playerButtonsLayout.implicitHeight
PlayerButtonsLayout {
- id: buttons_left
+ id: playerButtonsLayout
- model: playerControlBarModel_left
- forceColors: true
-
- focus: true
-
- anchors.left: parent.left
-
- visible: model.count > 0 && (playerControlBarModel_center.count > 0 ? ((x+width) < buttons_center.x) : true)
-
- navigationParent: root
- navigationUp: function(index) {
- if (trackPositionSlider.enabled)
- trackPositionSlider.focus = true
- else
- root.navigationUp(index)
- }
-
- navigationRightItem: buttons_center
-
- Keys.priority: Keys.AfterItem
- Keys.onPressed: defaultKeyAction(event, 0)
- }
-
- PlayerButtonsLayout {
- id: buttons_center
-
- model: playerControlBarModel_center
- forceColors: true
-
- focus: true
-
- anchors.horizontalCenter: parent.horizontalCenter
+ anchors {
+ fill: parent
- navigationParent: root
- navigationUp: function(index) {
- if (trackPositionSlider.enabled)
- trackPositionSlider.focus = true
- else
- root.navigationUp(index)
+ leftMargin: VLCStyle.applicationHorizontalMargin
+ rightMargin: VLCStyle.applicationHorizontalMargin
+ bottomMargin: VLCStyle.applicationVerticalMargin
}
- navigationLeftItem: buttons_left
- navigationRightItem: buttons_right
+ models: [playerControlBarModel_left, playerControlBarModel_center, playerControlBarModel_right]
- Keys.priority: Keys.AfterItem
- Keys.onPressed: defaultKeyAction(event, 0)
- }
-
- PlayerButtonsLayout {
- id: buttons_right
+ navigationUpItem: trackPositionSlider.enabled ? trackPositionSlider : root.navigationUpItem
- model: playerControlBarModel_right
forceColors: true
-
- focus: true
-
- anchors.right: parent.right
-
- visible: model.count > 0 && (playerControlBarModel_center.count > 0 ? ((buttons_center.x + buttons_center.width) < x)
- : !(((buttons_left.x + buttons_left.width) > x) && playerControlBarModel_left.count > 0))
-
- navigationParent: root
- navigationUp: function(index) {
- if (trackPositionSlider.enabled)
- trackPositionSlider.focus = true
- else
- root.navigationUp(index)
- }
-
- navigationLeftItem: buttons_center
-
- Keys.priority: Keys.AfterItem
- Keys.onPressed: defaultKeyAction(event, 0)
}
}
}
- Connections{
- target: mainInterface
- onToolBarConfUpdated: playerControlBarModel.reloadModel()
- }
PlayerControlBarModel{
id:playerControlBarModel_left
@@ -195,11 +131,4 @@ Widgets.NavigableFocusScope {
mainCtx: mainctx
configName: "MainPlayerToolbar-right"
}
-
- ControlButtons{
- id:controlmodelbuttons
-
- parentWindow: mainInterfaceRect
- }
-
}
diff --git a/modules/gui/qt/player/qml/MiniPlayer.qml b/modules/gui/qt/player/qml/MiniPlayer.qml
index 482c17aaac..977e7ef96a 100644
--- a/modules/gui/qt/player/qml/MiniPlayer.qml
+++ b/modules/gui/qt/player/qml/MiniPlayer.qml
@@ -82,7 +82,7 @@ Widgets.NavigableFocusScope {
right: parent.right
}
- Keys.onDownPressed: buttonrow_left.focus = true
+ Keys.onDownPressed: buttonsLayout.focus = true
Keys.onUpPressed: root.navigationUpItem.focus = true
}
@@ -106,104 +106,21 @@ Widgets.NavigableFocusScope {
tint: VLCStyle.colors.blendColors(VLCStyle.colors.bg, VLCStyle.colors.banner, 0.85)
}
- Item {
+ PlayerButtonsLayout {
+ id: buttonsLayout
+
anchors {
fill: parent
-
leftMargin: VLCStyle.applicationHorizontalMargin
rightMargin: VLCStyle.applicationHorizontalMargin
bottomMargin: VLCStyle.applicationVerticalMargin
}
- PlayerButtonsLayout {
- id: buttonrow_left
-
- model: miniPlayerModel_left
- defaultSize: VLCStyle.icon_normal
-
- implicitHeight: buttonrow.implicitHeight
-
- anchors {
- left: parent.left
- top: parent.top
- bottom: parent.bottom
-
- leftMargin: VLCStyle.margin_normal
- }
-
- visible: model.count > 0 && (miniPlayerModel_center.count > 0 ? ((x+width) < buttonrow_center.x) : true)
-
- navigationParent: root
- navigationRightItem: buttonrow_center
-
- focus: true
-
- navigationUp: function(index) {
- if (progressBar.enabled)
- progressBar.focus = true
- else
- root.navigationUp(index)
- }
- }
-
- PlayerButtonsLayout {
- id: buttonrow_center
+ models: [miniPlayerModel_left, miniPlayerModel_center, miniPlayerModel_right]
- model: miniPlayerModel_center
- defaultSize: VLCStyle.icon_normal
-
- anchors {
- centerIn: parent
- }
-
- navigationParent: root
- navigationLeftItem: buttonrow_left
- navigationRightItem: buttonrow_right
-
- navigationUp: function(index) {
- if (progressBar.enabled)
- progressBar.focus = true
- else
- root.navigationUp(index)
- }
- }
+ navigationUpItem: progressBar.enabled ? progressBar : root.navigationUpItem
- PlayerButtonsLayout {
- id: buttonrow_right
-
- model: miniPlayerModel_right
- defaultSize: VLCStyle.icon_normal
-
- anchors {
- right: parent.right
- top: parent.top
- bottom: parent.bottom
-
- rightMargin: VLCStyle.margin_normal
- }
-
- visible: model.count > 0 && (miniPlayerModel_center.count > 0 ? ((buttonrow_center.x + buttonrow_center.width) < x)
- : !(((buttonrow_left.x + buttonrow_left.width) > x) && miniPlayerModel_left.count > 0))
-
- navigationParent: root
- navigationLeftItem: buttonrow_center
-
- navigationUp: function(index) {
- if (progressBar.enabled)
- progressBar.focus = true
- else
- root.navigationUp(index)
- }
- }
- }
-
- Connections{
- target: mainInterface
- onToolBarConfUpdated: {
- miniPlayerModel_left.reloadModel()
- miniPlayerModel_center.reloadModel()
- miniPlayerModel_right.reloadModel()
- }
+ isMiniplayer: true
}
PlayerControlBarModel {
@@ -224,13 +141,6 @@ Widgets.NavigableFocusScope {
configName: "MiniPlayerToolbar-right"
}
- ControlButtons {
- id: controlmodelbuttons
-
- isMiniplayer: true
- parentWindow: mainInterfaceRect
- }
-
Keys.onPressed: {
if (!event.accepted)
defaultKeyAction(event, 0)
diff --git a/modules/gui/qt/player/qml/PlayerButtonsLayout.qml b/modules/gui/qt/player/qml/PlayerButtonsLayout.qml
index 62bc5eda46..1ec7c20a14 100644
--- a/modules/gui/qt/player/qml/PlayerButtonsLayout.qml
+++ b/modules/gui/qt/player/qml/PlayerButtonsLayout.qml
@@ -1,5 +1,5 @@
/*****************************************************************************
- * Copyright (C) 2019 VLC authors and VideoLAN
+ * Copyright (C) 2020 VLC authors and VideoLAN
*
* 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
@@ -15,93 +15,118 @@
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston MA 02110-1301, USA.
*****************************************************************************/
-
import QtQuick 2.11
-import QtQuick.Controls 2.4
-import QtQuick.Layouts 1.3
-import QtQml.Models 2.11
import org.videolan.vlc 0.1
import "qrc:///style/"
import "qrc:///widgets/" as Widgets
+
Widgets.NavigableFocusScope {
id: playerButtonsLayout
- property alias model: buttonsRepeater.model
- property var defaultSize: VLCStyle.icon_medium
+
+ implicitHeight: childrenRect.height
+ implicitWidth: childrenRect.width
+
+ property alias isMiniplayer: controlmodelbuttons.isMiniplayer
+ property alias parentWindow: controlmodelbuttons.parentWindow
+
+ property real marginLeft: VLCStyle.margin_normal
+ property real marginRight: VLCStyle.margin_normal
+ property real marginTop: 0
+ property real marginBottom: 0
+
property bool forceColors: false
+
+ property var models: [] // 0: left, 1: center, 2: right
+
+ Connections {
+ target: mainInterface
- implicitWidth: buttonrow.implicitWidth
- implicitHeight: buttonrow.implicitHeight
+ onToolBarConfUpdated: {
+ models[0].reloadModel()
+ models[1].reloadModel()
+ models[2].reloadModel()
+ }
+ }
- visible: model.count > 0
+ ControlButtons {
+ id: controlmodelbuttons
- Keys.priority: Keys.AfterItem
- Keys.onPressed: {
- if (!event.accepted)
- defaultKeyAction(event, 0)
+ isMiniplayer: false
+ parentWindow: mainInterfaceRect
}
-RowLayout{
- id: buttonrow
- property bool _focusGiven: false
+ ButtonsLayout {
+ id: buttonrow_left
- anchors.fill: parent
+ model: models[0]
- spacing: VLCStyle.margin_normal
+ implicitHeight: buttonrow.implicitHeight
- VLCColors {id: vlcNightColors; state: "night"}
+ anchors {
+ left: parent.left
+ top: parent.top
+ bottom: parent.bottom
- Repeater{
- id: buttonsRepeater
+ leftMargin: playerButtonsLayout.marginLeft
- onItemRemoved: {
- if (item.focus) {
- buttonrow._focusGiven = false
- }
+ topMargin: playerButtonsLayout.marginTop
+ bottomMargin: playerButtonsLayout.marginBottom
}
- delegate: Loader{
- id: buttonloader
-
- sourceComponent: controlmodelbuttons.returnbuttondelegate(model.id)
- onLoaded: {
- if (!buttonrow._focusGiven) {
- buttonloader.focus = true
- buttonrow._focusGiven = true
- }
- buttonloader.item.focus = true
-
- if(buttonloader.item instanceof Widgets.IconToolButton)
- buttonloader.item.size = playerButtonsLayout.defaultSize
-
- //force buttons color
- if (playerButtonsLayout.forceColors) {
- if ( buttonloader.item._colors ) {
- buttonloader.item._colors = vlcNightColors
- }
- else {
- if ( buttonloader.item.color )
- buttonloader.item.color = VLCStyle.colors.playerFg
- if ( buttonloader.item.bgColor )
- buttonloader.item.bgColor = VLCStyle.colors.setColorAlpha(VLCStyle.colors.playerBg, 0.8)
- if ( buttonloader.item.borderColor )
- buttonloader.item.borderColor = VLCStyle.colors.playerBorder
- }
- }
-
- if (index > 0)
- buttonloader.item.KeyNavigation.left = buttonrow.children[index].item
-
- if (buttonloader.item.navigationRight !== undefined)
- buttonloader.item.navigationRight = playerButtonsLayout.navigationRight
-
- if (buttonloader.item.navigationLeft !== undefined)
- buttonloader.item.navigationLeft = playerButtonsLayout.navigationLeft
- }
+ forceColors: playerButtonsLayout.forceColors
+
+ visible: model.count > 0 && (buttonrow_center.model.count > 0 ? ((x+width) < buttonrow_center.x) : true)
+
+ navigationParent: playerButtonsLayout
+ navigationRightItem: buttonrow_center
+
+ focus: true
+ }
+
+ ButtonsLayout {
+ id: buttonrow_center
+
+ model: models[1]
+
+ anchors {
+ centerIn: parent
+
+ topMargin: playerButtonsLayout.marginTop
+ bottomMargin: playerButtonsLayout.marginBottom
}
+
+ forceColors: playerButtonsLayout.forceColors
+
+ navigationParent: playerButtonsLayout
+ navigationLeftItem: buttonrow_left
+ navigationRightItem: buttonrow_right
}
-}
+ ButtonsLayout {
+ id: buttonrow_right
+
+ model: models[2]
+
+ anchors {
+ right: parent.right
+ top: parent.top
+ bottom: parent.bottom
+
+ rightMargin: playerButtonsLayout.marginRight
+
+ topMargin: playerButtonsLayout.marginTop
+ bottomMargin: playerButtonsLayout.marginBottom
+ }
+
+ forceColors: playerButtonsLayout.forceColors
+
+ visible: model.count > 0 && (buttonrow_center.model.count > 0 ? ((buttonrow_center.x + buttonrow_center.width) < x)
+ : !(((buttonrow_left.x + buttonrow_left.width) > x) && buttonrow_center.left.count > 0))
+
+ navigationParent: playerButtonsLayout
+ navigationLeftItem: buttonrow_center
+ }
}
diff --git a/modules/gui/qt/vlc.qrc b/modules/gui/qt/vlc.qrc
index fb470a9afa..6a1a413f34 100644
--- a/modules/gui/qt/vlc.qrc
+++ b/modules/gui/qt/vlc.qrc
@@ -308,6 +308,7 @@
<file alias="PlayerMenu.qml">player/qml/PlayerMenu.qml</file>
<file alias="PlayerMenuItem.qml">player/qml/PlayerMenuItem.qml</file>
<file alias="LanguageMenu.qml">player/qml/LanguageMenu.qml</file>
+ <file alias="ButtonsLayout.qml">player/qml/ButtonsLayout.qml</file>
</qresource>
<qresource prefix="/about">
<file alias="About.qml">dialogs/help/qml/About.qml</file>
--
2.27.0
More information about the vlc-devel
mailing list