[vlc-commits] [Git][videolan/vlc][master] 5 commits: qml: move frontpage out of TracksPage

Jean-Baptiste Kempf (@jbk) gitlab at videolan.org
Tue Jun 13 06:06:42 UTC 2023



Jean-Baptiste Kempf pushed to branch master at VideoLAN / VLC


Commits:
8e968b2c by Prince Gupta at 2023-06-13T05:41:48+00:00
qml: move frontpage out of TracksPage

- - - - -
40071c92 by Prince Gupta at 2023-06-13T05:41:48+00:00
qml: decouple TracksListPage from TracksMenu

- - - - -
05db02b5 by Prince Gupta at 2023-06-13T05:41:48+00:00
qml: improve keyboard navigation in TracksListPage

- - - - -
36c7977c by Prince Gupta at 2023-06-13T05:41:48+00:00
qml: improve currentIndex handling in TracksListPage

- - - - -
df6ab081 by Prince Gupta at 2023-06-13T05:41:48+00:00
qml: improve width handling of TracksMenu

- - - - -


7 changed files:

- modules/gui/qt/Makefile.am
- + modules/gui/qt/player/qml/TracksListPage.qml
- modules/gui/qt/player/qml/TracksMenu.qml
- modules/gui/qt/player/qml/TracksPage.qml
- modules/gui/qt/player/qml/controlbarcontrols/LangButton.qml
- modules/gui/qt/vlc.qrc
- po/POTFILES.in


Changes:

=====================================
modules/gui/qt/Makefile.am
=====================================
@@ -919,6 +919,7 @@ libqt_plugin_la_QML = \
 	gui/qt/player/qml/TracksPageAudio.qml \
 	gui/qt/player/qml/TracksPageSpeed.qml \
 	gui/qt/player/qml/TracksPageSubtitle.qml \
+	gui/qt/player/qml/TracksListPage.qml \
 	gui/qt/player/qml/ControlLayout.qml \
 	gui/qt/player/qml/controlbarcontrols/HighResolutionTimeWidget.qml \
 	gui/qt/player/qml/controlbarcontrols/ArtworkInfoWidget.qml \


=====================================
modules/gui/qt/player/qml/TracksListPage.qml
=====================================
@@ -0,0 +1,297 @@
+
+/*****************************************************************************
+ * Copyright (C) 2023 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.12
+import QtQuick.Controls 2.12
+import QtQuick.Templates 2.12 as T
+import QtQuick.Layouts 1.12
+import QtQml.Models 2.12
+
+import org.videolan.vlc 0.1
+
+import "qrc:///style/"
+import "qrc:///widgets/" as Widgets
+import "qrc:///util/" as Util
+
+
+RowLayout {
+    id: root
+
+    readonly property ColorContext colorContext: ColorContext {
+        id: theme
+
+        colorSet: ColorContext.Window // copied from TracksPage, maybe use Pane?
+    }
+
+    /* required */ property var trackMenuController: null
+
+    spacing: 0
+
+    focus: true
+
+    onActiveFocusChanged: if (activeFocus) column.forceActiveFocus()
+
+    Widgets.NavigableCol {
+        id: column
+
+        focus: true
+
+        Layout.preferredWidth: VLCStyle.dp(72, VLCStyle.scale)
+        Layout.alignment: Qt.AlignTop | Qt.AlignLeft
+        Layout.topMargin: VLCStyle.margin_large
+
+        Navigation.rightItem: row
+
+        //we store the model in a different property as functions can't be passed in modelData
+        property var modelDefination: [{
+            "tooltip": I18n.qtr("Playback Speed"),
+            "action": function () {
+                trackMenuController.requestPlaybackSpeedPage()
+            }
+        }]
+
+        model: modelDefination
+
+        delegate: Widgets.IconTrackButton {
+            size: (index === 0) ? VLCStyle.fontSize_large
+                                : VLCStyle.dp(40, VLCStyle.scale)
+
+            x: (column.width - width) / 2
+
+            text: I18n.qtr("Playback Speed")
+            iconText: (index === 0) ? I18n.qtr("%1x").arg(+Player.rate.toFixed(2))
+                                    : modelData.icon
+
+            T.ToolTip.visible: (hovered || visualFocus)
+            T.ToolTip.text: modelData.tooltip
+            T.ToolTip.delay: VLCStyle.delayToolTipAppear
+
+            Navigation.parentItem: column
+
+            onClicked: column.modelDefination[index].action()
+        }
+    }
+
+    Widgets.NavigableRow {
+        id: row
+
+        Layout.fillHeight: true
+        Layout.fillWidth: true
+
+        Navigation.leftItem: column
+
+        //we store the model in a different property as functions can't be passed in modelData
+        property var modelDefinition: [{
+                "title": I18n.qtr("Subtitle"),
+                "tracksModel": Player.subtitleTracks,
+                "menuIcon": VLCIcons.expand,
+                "menuText": I18n.qtr("Menu"),
+                "menuAction": function(menuPos) {
+                    menuSubtitle.popup(menuPos)
+                },
+
+            }, {
+                "title": I18n.qtr("Audio"),
+                "tracksModel": Player.audioTracks,
+                "menuIcon": VLCIcons.expand,
+                "menuText": I18n.qtr("Menu"),
+                "menuAction": function(menuPos) {
+                    menuAudio.popup(menuPos)
+                }
+            }, {
+                "title": I18n.qtr("Video Tracks"),
+                "tracksModel": Player.videoTracks,
+                "menuIcon": VLCIcons.add,
+                "menuText": I18n.qtr("Add"),
+                "menuAction": function(menuPos) {
+                    DialogsProvider.loadVideoFile()
+                },
+            }]
+
+        //note that parenthesis around functions are *mandatory*
+        model: modelDefinition
+
+        delegate: Container {
+            // wrap the contentItem i.e Column into Container
+            // so that we can get focusReason, also Container
+            // is a FocusScope
+
+            id: tracksListContainer
+
+            property var tracksModel: modelData.tracksModel
+
+            focus: true
+
+            width: row.width / 3
+            height: row.height
+
+            onActiveFocusChanged: if (activeFocus) tracksList.forceActiveFocus(focusReason)
+
+            // this is required to initialize attached Navigation property
+            Navigation.parentItem: row
+
+            contentItem: Column {
+                anchors.fill: parent
+
+                focus: true
+
+                Accessible.role: Accessible.Pane
+                Accessible.name: modelData.title
+
+                Item {
+                    // keep it inside so "Column" doesn't mess with it
+                   Rectangle {
+                       id: separator
+
+                       x: 0
+                       y: 0
+                       width: VLCStyle.margin_xxxsmall
+
+                       height: tracksListContainer.height
+                       color: theme.border
+                   }
+                }
+
+                Row {
+                    id: titleHeader
+
+                    width: tracksListContainer.width
+                    height: implicitHeight
+
+                    padding: VLCStyle.margin_xsmall
+
+                    topPadding: VLCStyle.margin_large
+                    leftPadding: VLCStyle.margin_xxlarge + separator.width
+
+                    focus: true
+
+                    clip: true
+
+                    Widgets.SubtitleLabel {
+                        id: titleText
+
+                        width: parent.width - button.width - parent.leftPadding
+                               - parent.rightPadding
+
+                        text: modelData.title
+                        color: theme.fg.primary
+                    }
+
+                    Widgets.IconTrackButton {
+                        id: button
+
+                        size: VLCStyle.icon_track
+
+                        focus: true
+
+                        text: modelData.menuText
+                        iconText: modelData.menuIcon
+
+                        Navigation.parentItem: tracksListContainer
+                        Navigation.downItem: tracksList
+
+                        onClicked: {
+                            //functions aren't passed to modelData
+                            row.modelDefinition[index].menuAction(mapToGlobal(0, height))
+                        }
+                    }
+                }
+
+                Widgets.KeyNavigableListView {
+                    id: tracksList
+
+                    model: tracksListContainer.tracksModel
+                    width: tracksListContainer.width
+                    height: tracksListContainer.height - titleHeader.height
+                    leftMargin: separator.width
+                    focus: true
+                    clip: true
+
+                    Accessible.role: Accessible.List
+                    Accessible.name: I18n.qtr("Track list")
+
+                    Navigation.parentItem: tracksListContainer
+                    Navigation.upItem: button
+                    Keys.priority: Keys.AfterItem
+                    Keys.onPressed: Navigation.defaultKeyAction(event)
+
+                    delegate: Widgets.CheckedDelegate {
+                        readonly property bool isModelChecked: model.checked
+                        clip: true
+
+                        focus: true
+                        text: model.display
+                        width: tracksListContainer.width - VLCStyle.margin_xxxsmall
+                        height: VLCStyle.dp(40, VLCStyle.scale)
+                        opacity: hovered || activeFocus || checked ? 1 : .6
+                        font.weight: hovered
+                                     || activeFocus ? Font.DemiBold : Font.Normal
+
+                        onIsModelCheckedChanged: {
+                            if (model.checked !== checked)
+                                checked = model.checked
+                        }
+
+                        onCheckedChanged: {
+                            if (model.checked !== checked)
+                                model.checked = checked
+                        }
+
+                        onClicked: {
+                            tracksList.currentIndex = index
+                            tracksList.setCurrentItemFocus(Qt.MouseFocusReason)
+                        }
+
+                        Navigation.parentItem: tracksList
+                    }
+                }
+            }
+        }
+    }
+
+    QmlSubtitleMenu {
+        id: menuSubtitle
+
+        player: Player
+
+        onTriggered: {
+            if (action === QmlSubtitleMenu.Open) {
+                DialogsProvider.loadSubtitlesFile()
+            }
+            else if (action === QmlSubtitleMenu.Synchronize) {
+                trackMenuController.requestSubtitlePage()
+            }
+            else if (action === QmlSubtitleMenu.Download) {
+                Player.openVLsub()
+            }
+        }
+    }
+
+    QmlAudioMenu {
+        id: menuAudio
+
+        onTriggered: {
+            if (action === QmlSubtitleMenu.Open) {
+                DialogsProvider.loadAudioFile()
+            }
+            else if (action === QmlSubtitleMenu.Synchronize) {
+                trackMenuController.requestAudioPage()
+            }
+        }
+    }
+}


=====================================
modules/gui/qt/player/qml/TracksMenu.qml
=====================================
@@ -33,6 +33,11 @@ T.Popup {
     id: root
 
     // Settings
+    property var preferredWidth : stackView.currentItem.preferredWidth
+
+    width: Math.min((typeof preferredWidth !== "undefined")
+                          ? preferredWidth : Number.MAX_VALUE
+                    , root.parent.width)
 
     height: VLCStyle.dp(296, VLCStyle.scale)
 
@@ -75,11 +80,11 @@ T.Popup {
     }
 
     contentItem: StackView {
+        id: stackView
+
         focus: true
         clip: true
 
-        initialItem: frontPage
-
         //erf, popup are weird, content is not parented to the root
         //so, duplicate the context here for the childrens
         readonly property ColorContext colorContext: ColorContext {
@@ -88,7 +93,9 @@ T.Popup {
             palette: popupTheme.palette
         }
 
-        onCurrentItemChanged: currentItem.forceActiveFocus()
+        initialItem: TracksListPage {
+            trackMenuController: trackMenuController
+        }
 
         pushEnter: Transition {
             PropertyAnimation {
@@ -124,262 +131,28 @@ T.Popup {
         }
     }
 
-    Component {
-        id: frontPage
-
-        RowLayout {
-            id: frontRoot
-
-            property var currentItem: StackView.view.currentItem
-
-            spacing: 0
-
-            focus: true
-
-            onActiveFocusChanged: if (activeFocus) column.forceActiveFocus()
-
-            Connections {
-                target: frontRoot.StackView.view
-
-                onCurrentItemChanged: {
-                    if (currentItem instanceof TracksPage)
-                        root.width = Qt.binding(function () {
-                            return Math.min(currentItem.preferredWidth, root.parent.width)
-                        })
-                    else
-                        root.width = Qt.binding(function () { return root.parent.width })
-                }
-            }
-
-            Connections {
-                target: (currentItem && currentItem instanceof TracksPage) ? currentItem : null
-
-                onBackRequested: frontRoot.StackView.view.pop()
-            }
-
-            Widgets.NavigableCol {
-                id: column
-
-                focus: true
-
-                Layout.preferredWidth: VLCStyle.dp(72, VLCStyle.scale)
-                Layout.alignment: Qt.AlignTop | Qt.AlignLeft
-                Layout.topMargin: VLCStyle.margin_large
-
-                Navigation.rightItem: row
-
-                model: [{
-                    "tooltip": I18n.qtr("Playback Speed"),
-                    "source": "qrc:///player/TracksPageSpeed.qml"
-                }]
-
-                delegate: Widgets.IconTrackButton {
-                    size: (index === 0) ? VLCStyle.fontSize_large
-                                        : VLCStyle.dp(40, VLCStyle.scale)
-
-                    x: (column.width - width) / 2
-
-                    text: I18n.qtr("Playback Speed")
-                    iconText: (index === 0) ? I18n.qtr("%1x").arg(+Player.rate.toFixed(2))
-                                            : modelData.icon
-
-                    T.ToolTip.visible: (hovered || visualFocus)
-                    T.ToolTip.text: modelData.tooltip
-                    T.ToolTip.delay: VLCStyle.delayToolTipAppear
-
-                    Navigation.parentItem: column
-
-                    onClicked: frontRoot.StackView.view.push(modelData.source)
-                }
-            }
-
-            Widgets.NavigableRow {
-                id: row
-
-                Layout.fillHeight: true
-                Layout.fillWidth: true
-
-                Navigation.leftItem: column
-
-                //we store the model in a different property as functions can't be passed in modelData
-                property var modelDefinition: [{
-                        "title": I18n.qtr("Subtitle"),
-                        "tracksModel": Player.subtitleTracks,
-                        "menuIcon": VLCIcons.expand,
-                        "menuText": I18n.qtr("Menu"),
-                        "menuAction": function(menuPos) {
-                            menuSubtitle.popup(menuPos)
-                        },
-
-                    }, {
-                        "title": I18n.qtr("Audio"),
-                        "tracksModel": Player.audioTracks,
-                        "menuIcon": VLCIcons.expand,
-                        "menuText": I18n.qtr("Menu"),
-                        "menuAction": function(menuPos) {
-                            menuAudio.popup(menuPos)
-                        }
-                    }, {
-                        "title": I18n.qtr("Video Tracks"),
-                        "tracksModel": Player.videoTracks,
-                        "menuIcon": VLCIcons.add,
-                        "menuText": I18n.qtr("Add"),
-                        "menuAction": function(menuPos) {
-                            DialogsProvider.loadVideoFile()
-                        },
-                    }]
-
-                //note that parenthesis around functions are *mandatory*
-                model: modelDefinition
-
-                delegate: Column {
-                    id: tracksListContainer
-
-                    property var tracksModel: modelData.tracksModel
-
-                    width: row.width / 3
-                    height: row.height
-
-                    focus: true
-
-                    Accessible.role: Accessible.Pane
-                    Accessible.name: modelData.title
+    QtObject {
+      id: trackMenuController
 
-                    onActiveFocusChanged: if (activeFocus) tracksList.forceActiveFocus(focusReason)
+      signal requestAudioPage()
+      signal requestSubtitlePage()
+      signal requestPlaybackSpeedPage()
+      signal requestBack()
 
-                    Item {
-                        // keep it inside so "Column" doesn't mess with it
-                       Rectangle {
-                           id: separator
+      onRequestBack: {
+          stackView.pop()
+      }
 
-                           x: 0
-                           y: 0
-                           width: VLCStyle.margin_xxxsmall
+      onRequestAudioPage: {
+          stackView.push("qrc:///player/TracksPageAudio.qml", {"trackMenuController": trackMenuController})
+      }
 
-                           height: tracksListContainer.height
-                           color: theme.border
-                       }
-                    }
+      onRequestSubtitlePage: {
+          stackView.push("qrc:///player/TracksPageSubtitle.qml", {"trackMenuController": trackMenuController})
+      }
 
-                    Row {
-                        id: titleHeader
-
-                        width: tracksListContainer.width
-                        height: implicitHeight
-
-                        padding: VLCStyle.margin_xsmall
-
-                        topPadding: VLCStyle.margin_large
-                        leftPadding: VLCStyle.margin_xxlarge + separator.width
-
-                        focus: true
-
-                        clip: true
-
-                        Widgets.SubtitleLabel {
-                            id: titleText
-
-                            width: parent.width - button.width - parent.leftPadding
-                                   - parent.rightPadding
-
-                            text: modelData.title
-                            color: theme.fg.primary
-                        }
-
-                        Widgets.IconTrackButton {
-                            id: button
-
-                            size: VLCStyle.icon_track
-
-                            focus: true
-
-                            text: modelData.menuText
-                            iconText: modelData.menuIcon
-
-                            Navigation.parentItem: tracksListContainer
-                            Navigation.downItem: tracksList
-
-                            onClicked: {
-                                //functions aren't passed to modelData
-                                row.modelDefinition[index].menuAction(mapToGlobal(0, height))
-                            }
-                        }
-                    }
-
-                    ListView {
-                        id: tracksList
-
-                        model: tracksListContainer.tracksModel
-                        width: tracksListContainer.width
-                        height: tracksListContainer.height - titleHeader.height
-                        leftMargin: separator.width
-                        focus: true
-                        clip: true
-
-                        Accessible.role: Accessible.List
-                        Accessible.name: I18n.qtr("Track list")
-
-                        Navigation.parentItem: tracksListContainer
-                        Navigation.upItem: button
-                        Keys.priority: Keys.AfterItem
-                        Keys.onPressed: Navigation.defaultKeyAction(event)
-
-                        delegate: Widgets.CheckedDelegate {
-                            readonly property bool isModelChecked: model.checked
-                            clip: true
-
-                            focus: true
-                            text: model.display
-                            width: tracksListContainer.width - VLCStyle.margin_xxxsmall
-                            height: VLCStyle.dp(40, VLCStyle.scale)
-                            opacity: hovered || activeFocus || checked ? 1 : .6
-                            font.weight: hovered
-                                         || activeFocus ? Font.DemiBold : Font.Normal
-
-                            onIsModelCheckedChanged: {
-                                if (model.checked !== checked)
-                                    checked = model.checked
-                            }
-
-                            onCheckedChanged: {
-                                if (model.checked !== checked)
-                                    model.checked = checked
-                            }
-                        }
-                    }
-                }
-            }
-        }
-    }
-
-    QmlSubtitleMenu {
-        id: menuSubtitle
-
-        player: Player
-
-        onTriggered: {
-            if (action === QmlSubtitleMenu.Open) {
-                DialogsProvider.loadSubtitlesFile()
-            }
-            else if (action === QmlSubtitleMenu.Synchronize) {
-                contentItem.currentItem.StackView.view.push("qrc:///player/TracksPageSubtitle.qml")
-            }
-            else if (action === QmlSubtitleMenu.Download) {
-                Player.openVLsub()
-            }
-        }
-    }
-
-    QmlAudioMenu {
-        id: menuAudio
-
-        onTriggered: {
-            if (action === QmlSubtitleMenu.Open) {
-                DialogsProvider.loadAudioFile()
-            }
-            else if (action === QmlSubtitleMenu.Synchronize) {
-                contentItem.currentItem.StackView.view.push("qrc:///player/TracksPageAudio.qml")
-            }
-        }
+      onRequestPlaybackSpeedPage: {
+          stackView.push("qrc:///player/TracksPageSpeed.qml", {"trackMenuController": trackMenuController})
+      }
     }
 }


=====================================
modules/gui/qt/player/qml/TracksPage.qml
=====================================
@@ -35,6 +35,8 @@ RowLayout {
 
     property int preferredWidth: VLCStyle.dp(512, VLCStyle.scale)
 
+    /* required */ property var trackMenuController: null
+
     // Settings
 
     spacing: 0
@@ -43,10 +45,6 @@ RowLayout {
 
     Navigation.leftItem: button
 
-    // Signals
-
-    signal backRequested
-
     // Children
 
     readonly property ColorContext colorContext: ColorContext {
@@ -73,7 +71,7 @@ RowLayout {
             Navigation.parentItem: root
             Navigation.rightItem: content
 
-            onClicked: root.backRequested()
+            onClicked: trackMenuController.requestBack()
         }
     }
 


=====================================
modules/gui/qt/player/qml/controlbarcontrols/LangButton.qml
=====================================
@@ -64,8 +64,6 @@ Widgets.IconControlButton {
 
             parent: root._parentItem
 
-            width: parent.width
-
             x: 0
             y: (parent.positionSliderY - height)
             z: 1


=====================================
modules/gui/qt/vlc.qrc
=====================================
@@ -308,6 +308,7 @@
         <file alias="TracksPageSpeed.qml">player/qml/TracksPageSpeed.qml</file>
         <file alias="TracksPageAudio.qml">player/qml/TracksPageAudio.qml</file>
         <file alias="TracksPageSubtitle.qml">player/qml/TracksPageSubtitle.qml</file>
+        <file alias="TracksListPage.qml">player/qml/TracksListPage.qml</file>
         <file alias="ControlbarControls.qml">player/qml/ControlbarControls.qml</file>
         <file alias="MiniPlayer.qml">player/qml/MiniPlayer.qml</file>
         <file alias="TopBar.qml">player/qml/TopBar.qml</file>


=====================================
po/POTFILES.in
=====================================
@@ -848,6 +848,7 @@ modules/gui/qt/player/qml/TopBar.qml
 modules/gui/qt/player/qml/TracksMenu.qml
 modules/gui/qt/player/qml/TracksPageAudio.qml
 modules/gui/qt/player/qml/TracksPageSubtitle.qml
+modules/gui/qt/player/qml/TracksListPage.qml
 modules/gui/qt/player/qml/controlbarcontrols/ArtworkInfoWidget.qml
 modules/gui/qt/player/qml/controlbarcontrols/AspectRatioWidget.qml
 modules/gui/qt/player/qml/controlbarcontrols/AtoBButton.qml



View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/4860f72cde4e189a99c92787bb5ae27d906562a4...df6ab0815338f6fbfda971e95cd6e3a9c626f91c

-- 
View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/4860f72cde4e189a99c92787bb5ae27d906562a4...df6ab0815338f6fbfda971e95cd6e3a9c626f91c
You're receiving this email because of your account on code.videolan.org.


VideoLAN code repository instance


More information about the vlc-commits mailing list