[vlc-devel] [PATCH 15/16] qml: factorize network home page

Pierre Lamot pierre at videolabs.io
Wed May 27 17:06:56 CEST 2020


---
 modules/gui/qt/Makefile.am                    |   2 +-
 .../qt/network/qml/NetworkBrowseDisplay.qml   |  32 +++--
 .../network/qml/NetworkHomeDeviceListView.qml | 102 ++++++++++++++++
 .../gui/qt/network/qml/NetworkHomeDisplay.qml | 114 +++---------------
 .../qml/NetworksSectionSelectableDM.qml       |  60 ---------
 .../qt/util/qml/SelectableDelegateModel.qml   |   1 +
 modules/gui/qt/vlc.qrc                        |   2 +-
 7 files changed, 144 insertions(+), 169 deletions(-)
 create mode 100644 modules/gui/qt/network/qml/NetworkHomeDeviceListView.qml
 delete mode 100644 modules/gui/qt/network/qml/NetworksSectionSelectableDM.qml

diff --git a/modules/gui/qt/Makefile.am b/modules/gui/qt/Makefile.am
index 9f0257d50e..88b71246b0 100644
--- a/modules/gui/qt/Makefile.am
+++ b/modules/gui/qt/Makefile.am
@@ -618,8 +618,8 @@ libqt_plugin_la_QML = \
 	gui/qt/network/qml/NetworkDisplay.qml \
 	gui/qt/network/qml/NetworkGridItem.qml \
 	gui/qt/network/qml/NetworkHomeDisplay.qml \
+	gui/qt/network/qml/NetworkHomeDeviceListView.qml \
 	gui/qt/network/qml/NetworkListItem.qml \
-	gui/qt/network/qml/NetworksSectionSelectableDM.qml \
 	gui/qt/player/qml/ControlBar.qml \
 	gui/qt/player/qml/ControlButtons.qml \
 	gui/qt/player/qml/MiniPlayer.qml \
diff --git a/modules/gui/qt/network/qml/NetworkBrowseDisplay.qml b/modules/gui/qt/network/qml/NetworkBrowseDisplay.qml
index 99f4f2f062..ef976c6829 100644
--- a/modules/gui/qt/network/qml/NetworkBrowseDisplay.qml
+++ b/modules/gui/qt/network/qml/NetworkBrowseDisplay.qml
@@ -24,6 +24,7 @@ import QtQml 2.11
 import org.videolan.vlc 0.1
 import org.videolan.medialib 0.1
 
+import "qrc:///util/" as Util
 import "qrc:///widgets/" as Widgets
 import "qrc:///style/"
 
@@ -31,6 +32,9 @@ Widgets.NavigableFocusScope {
     id: root
 
     property alias tree: providerModel.tree
+    readonly property var currentIndex: delegateModelId.currentIndex
+    //the index to "go to" when the view is loaded
+    property var initialIndex: 0
 
     NetworkMediaModel {
         id: providerModel
@@ -38,19 +42,33 @@ Widgets.NavigableFocusScope {
         tree: undefined
     }
 
-    NetworksSectionSelectableDM{
+    Util.SelectableDelegateModel{
         id: delegateModelId
         model: providerModel
         onCountChanged: resetFocus()
     }
 
     function resetFocus() {
-        if (providerModel.count > 0 && !delegateModelId.hasSelection) {
-            var initialIndex = 0
-            if (delegateModelId.currentIndex !== -1)
-                initialIndex = delegateModelId.currentIndex
-            delegateModelId.select(initialIndex, ItemSelectionModel.ClearAndSelect)
-            delegateModelId.currentIndex = initialIndex
+        var initialIndex = root.initialIndex
+        if (initialIndex >= providerModel.count)
+            initialIndex = 0
+        delegateModelId.select(initialIndex, ItemSelectionModel.ClearAndSelect)
+        view.currentItem.currentIndex = initialIndex
+        view.currentItem.positionViewAtIndex(initialIndex, ItemView.Contain)
+    }
+
+
+    function _actionAtIndex(index) {
+        if ( delegateModelId.selectedIndexes().length > 1 ) {
+            providerModel.addAndPlay( delegateModelId.selectedIndexes() )
+        } else {
+            var data = providerModel.getDataAt(index)
+            if (data.type === NetworkMediaModel.TYPE_DIRECTORY
+                    || data.type === NetworkMediaModel.TYPE_NODE)  {
+                history.push(["mc", "network", { tree: data.tree }]);
+            } else {
+                providerModel.addAndPlay( delegateModelId.selectedIndexes() )
+            }
         }
     }
 
diff --git a/modules/gui/qt/network/qml/NetworkHomeDeviceListView.qml b/modules/gui/qt/network/qml/NetworkHomeDeviceListView.qml
new file mode 100644
index 0000000000..6a21a05963
--- /dev/null
+++ b/modules/gui/qt/network/qml/NetworkHomeDeviceListView.qml
@@ -0,0 +1,102 @@
+/*****************************************************************************
+ * 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
+ * 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 QtQml.Models 2.2
+
+import org.videolan.medialib 0.1
+
+import "qrc:///widgets/" as Widgets
+import "qrc:///util/" as Util
+import "qrc:///style/"
+
+Widgets.NavigableFocusScope {
+    id: root
+
+    height: deviceListView.implicitHeight
+
+    property alias ctx: deviceModel.ctx
+    property alias sd_source: deviceModel.sd_source
+    property alias model: deviceModel
+
+    property int _currentIndex: -1
+    on_CurrentIndexChanged: {
+        deviceListView.currentIndex = _currentIndex
+    }
+
+    function _actionAtIndex(index, model, selectionModel) {
+        var data = model.getDataAt(index)
+        if (data.type === NetworkMediaModel.TYPE_DIRECTORY
+                || data.type === NetworkMediaModel.TYPE_NODE)  {
+            history.push(["mc", "network", { tree: data.tree }]);
+        } else {
+            model.addAndPlay( selectionModel.selectedIndexes )
+        }
+    }
+
+    onFocusChanged: {
+        if (activeFocus && root._currentIndex === -1 && deviceModel.count > 0)
+            root._currentIndex = 0
+    }
+
+    NetworkDeviceModel {
+        id: deviceModel
+    }
+
+    Util.SelectableDelegateModel {
+        id: deviceSelection
+        model: deviceModel
+    }
+
+    Widgets.KeyNavigableListView {
+        id: deviceListView
+
+        focus: true
+
+        currentIndex: root._currentIndex
+
+        implicitHeight: VLCStyle.gridItem_network_height
+        orientation: ListView.Horizontal
+        anchors.fill: parent
+
+        model: deviceModel
+        delegate: NetworkGridItem {
+            focus: true
+
+            onItemClicked : {
+                deviceSelection.updateSelection( modifier ,  deviceSelection.currentIndex, index)
+                root._currentIndex = index
+                forceActiveFocus()
+            }
+
+            onItemDoubleClicked: {
+                if (model.type === NetworkMediaModel.TYPE_NODE || model.type === NetworkMediaModel.TYPE_DIRECTORY)
+                    history.push( ["mc", "network", { tree: model.tree } ])
+                else
+                    model.addAndPlay( index )
+            }
+        }
+
+        onSelectAll: deviceSelection.selectAll()
+        onSelectionUpdated:  deviceSelection.updateSelection( keyModifiers, oldIndex, newIndex )
+        onActionAtIndex: {
+            _actionAtIndex(index, deviceModel, deviceSelection)
+        }
+        navigationParent: root
+    }
+}
diff --git a/modules/gui/qt/network/qml/NetworkHomeDisplay.qml b/modules/gui/qt/network/qml/NetworkHomeDisplay.qml
index 1800d1cd6c..0b42aeefed 100644
--- a/modules/gui/qt/network/qml/NetworkHomeDisplay.qml
+++ b/modules/gui/qt/network/qml/NetworkHomeDisplay.qml
@@ -39,38 +39,12 @@ Widgets.NavigableFocusScope {
 
     Label {
         anchors.centerIn: parent
-        visible: (machineModel.count === 0 && lanModel.count === 0 )
+        visible: (deviceSection.model.count === 0 && lanSection.model.count === 0 )
         font.pixelSize: VLCStyle.fontHeight_xxlarge
         color: topFocusScope.activeFocus ? VLCStyle.colors.accent : VLCStyle.colors.text
         text: i18n.qtr("No network shares found")
     }
 
-    NetworksSectionSelectableDM{
-        id: machineDM
-        model: NetworkDeviceModel {
-            id: machineModel
-            ctx: mainctx
-            sd_source: NetworkDeviceModel.CAT_DEVICES
-        }
-
-        onCurrentIndexChanged: {
-            deviceSection.currentIndex = currentIndex
-        }
-    }
-
-    NetworksSectionSelectableDM{
-        id: lanDM
-        model: NetworkDeviceModel {
-            id: lanModel
-            ctx: mainctx
-            sd_source: NetworkDeviceModel.CAT_LAN
-        }
-
-        onCurrentIndexChanged: {
-            lanSection.currentIndex = currentIndex
-        }
-    }
-
     ScrollView {
         id: flickable
         anchors.fill: parent
@@ -87,47 +61,17 @@ Widgets.NavigableFocusScope {
                 id: deviceLabel
                 text: i18n.qtr("Devices")
                 width: flickable.width
-                visible: machineModel.count !== 0
+                visible: deviceSection.model.count !== 0
             }
 
-            Widgets.KeyNavigableListView {
+            NetworkHomeDeviceListView {
                 id: deviceSection
-
-                focus: false
-                visible: machineModel.count !== 0
-                onVisibleChanged: topFocusScope.resetFocus()
-
-                currentIndex: machineDM.currentIndex
-                onFocusChanged: {
-                    if (activeFocus && machineDM.currentIndex === -1 && machineModel.count > 0)
-                        machineDM.currentIndex = 0
-                }
+                ctx: mainctx
+                sd_source: NetworkDeviceModel.CAT_DEVICES
 
                 width: flickable.width
-                height: VLCStyle.gridItem_network_height
-                orientation: ListView.Horizontal
-
-                model: machineModel
-                delegate: NetworkGridItem {
-                    focus: true
-
-                    onItemClicked : {
-                        machineDM.updateSelection( modifier ,  machineDM.currentIndex, index)
-                        machineDM.currentIndex = index
-                        forceActiveFocus()
-                    }
-
-                    onItemDoubleClicked: {
-                        if (model.type === NetworkMediaModel.TYPE_NODE || model.type === NetworkMediaModel.TYPE_DIRECTORY)
-                            history.push( ["mc", "network", { tree: model.tree } ])
-                        else
-                            model.addAndPlay( index )
-                    }
-                }
-
-                onSelectAll: machineDM.selectAll()
-                onSelectionUpdated:  machineDM.updateSelection( keyModifiers, oldIndex, newIndex )
-                onActionAtIndex: machineDM.actionAtIndex(index)
+                visible: deviceSection.model.count !== 0
+                onVisibleChanged: topFocusScope.resetFocus()
 
                 navigationParent: topFocusScope
                 navigationDownItem: lanSection.visible ?  lanSection : undefined
@@ -142,50 +86,20 @@ Widgets.NavigableFocusScope {
                 id: lanLabel
                 text: i18n.qtr("LAN")
                 width: flickable.width
-                visible: lanModel.count !== 0
+                visible: lanSection.model.count !== 0
             }
 
-            Widgets.KeyNavigableListView {
+            NetworkHomeDeviceListView {
                 id: lanSection
-
-                visible: lanModel.count !== 0
-                onVisibleChanged: topFocusScope.resetFocus()
-                focus: false
-
-                currentIndex: lanDM.currentIndex
-                onFocusChanged: {
-                    if (activeFocus && lanDM.currentIndex === -1 && lanModel.count > 0)
-                        lanDM.currentIndex = 0
-                }
+                ctx: mainctx
+                sd_source: NetworkDeviceModel.CAT_LAN
 
                 width: flickable.width
-                height: VLCStyle.gridItem_network_height
-                orientation: ListView.Horizontal
-
-                model: lanModel
-                delegate: NetworkGridItem {
-                    focus: true
-
-                    onItemClicked : {
-                        lanDM.updateSelection( modifier ,  lanDM.currentIndex, index)
-                        lanDM.currentIndex = index
-                        forceActiveFocus()
-                    }
-
-                    onItemDoubleClicked: {
-                        if (model.type === NetworkMediaModel.TYPE_NODE || model.type === NetworkMediaModel.TYPE_DIRECTORY)
-                            history.push( ["mc", "network", { tree: model.tree } ])
-                        else
-                            model.addAndPlay( index )
-                    }
-                }
-
-                onSelectAll: lanDM.selectAll()
-                onSelectionUpdated:  lanDM.updateSelection( keyModifiers, oldIndex, newIndex )
-                onActionAtIndex: lanDM.actionAtIndex(index)
+                visible: lanSection.model.count !== 0
+                onVisibleChanged: topFocusScope.resetFocus()
 
                 navigationParent: topFocusScope
-                navigationUpItem: deviceSection.visible ? deviceSection : undefined
+                navigationUpItem: deviceSection.visible ?  deviceSection : undefined
 
                 onActiveFocusChanged: {
                     if (activeFocus)
diff --git a/modules/gui/qt/network/qml/NetworksSectionSelectableDM.qml b/modules/gui/qt/network/qml/NetworksSectionSelectableDM.qml
deleted file mode 100644
index 3b9fab306f..0000000000
--- a/modules/gui/qt/network/qml/NetworksSectionSelectableDM.qml
+++ /dev/null
@@ -1,60 +0,0 @@
-/*****************************************************************************
- * 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 QtQml.Models 2.2
-import QtQml 2.11
-
-import org.videolan.vlc 0.1
-import org.videolan.medialib 0.1
-
-import "qrc:///util/" as Util
-import "qrc:///widgets/" as Widgets
-import "qrc:///style/"
-
-Util.SelectableDelegateModel {
-    id: delegateModel
-    property int currentIndex: -1
-
-    property string viewIndexPropertyName: "currentIndex"
-    delegate: Item {
-    }
-
-    function switchIndex() {
-        var list = []
-        for (var i = 0; i < delegateModel.selectedGroup.count; i++) {
-            var obj = delegateModel.selectedGroup.get(i)
-            if (obj.model.can_index) {
-                obj.model.indexed = !obj.model.indexed
-            }
-        }
-    }
-
-    function actionAtIndex(index) {
-        if ( delegateModel.selectedGroup.count > 1 ) {
-            model.addAndPlay( delegateModel.selectedIndexes() )
-        } else {
-            if (delegateModel.items.get(index).model.type === NetworkMediaModel.TYPE_DIRECTORY
-                    || delegateModel.items.get(index).model.type === NetworkMediaModel.TYPE_NODE)  {
-                history.push(["mc", "network", { tree: delegateModel.items.get(index).model.tree }]);
-            } else {
-                model.addAndPlay( delegateModel.selectedIndexes() )
-            }
-        }
-    }
-}
diff --git a/modules/gui/qt/util/qml/SelectableDelegateModel.qml b/modules/gui/qt/util/qml/SelectableDelegateModel.qml
index f07ea867a4..f5abbfcace 100644
--- a/modules/gui/qt/util/qml/SelectableDelegateModel.qml
+++ b/modules/gui/qt/util/qml/SelectableDelegateModel.qml
@@ -21,6 +21,7 @@ import QtQml.Models 2.2
 DelegateModel {
     id: delegateModel
 
+    property int currentIndex: -1
     property int shiftIndex: -1
     property alias selectedGroup: selectedGroup
     readonly property bool hasSelection: selectedGroup.count > 0
diff --git a/modules/gui/qt/vlc.qrc b/modules/gui/qt/vlc.qrc
index 9bff19c1b3..08b8d403da 100644
--- a/modules/gui/qt/vlc.qrc
+++ b/modules/gui/qt/vlc.qrc
@@ -216,7 +216,7 @@
     </qresource>
     <qresource prefix="/network">
         <file alias="NetworkDisplay.qml">network/qml/NetworkDisplay.qml</file>
-        <file alias="NetworksSectionSelectableDM.qml">network/qml/NetworksSectionSelectableDM.qml</file>
+        <file alias="NetworkHomeDeviceListView.qml">network/qml/NetworkHomeDeviceListView.qml</file>
         <file alias="NetworkHomeDisplay.qml">network/qml/NetworkHomeDisplay.qml</file>
         <file alias="NetworkBrowseDisplay.qml">network/qml/NetworkBrowseDisplay.qml</file>
         <file alias="NetworkGridItem.qml">network/qml/NetworkGridItem.qml</file>
-- 
2.25.1



More information about the vlc-devel mailing list