[vlc-devel] [PATCH 16/49] qml: add navigable column layout

Pierre Lamot pierre at videolabs.io
Fri Oct 11 15:17:40 CEST 2019


---
 modules/gui/qt/Makefile.am                |   1 +
 modules/gui/qt/qml/utils/NavigableCol.qml | 117 ++++++++++++++++++++++
 modules/gui/qt/vlc.qrc                    |   1 +
 3 files changed, 119 insertions(+)
 create mode 100644 modules/gui/qt/qml/utils/NavigableCol.qml

diff --git a/modules/gui/qt/Makefile.am b/modules/gui/qt/Makefile.am
index f0cbe210ae..094073774c 100644
--- a/modules/gui/qt/Makefile.am
+++ b/modules/gui/qt/Makefile.am
@@ -589,6 +589,7 @@ libqt_plugin_la_QML = \
 	gui/qt/qml/utils/MultiCoverPreview.qml \
 	gui/qt/qml/utils/ExpandGridView.qml \
 	gui/qt/qml/utils/NavigableFocusScope.qml \
+	gui/qt/qml/utils/NavigableCol.qml \
 	gui/qt/qml/utils/NavigableRow.qml \
 	gui/qt/qml/utils/KeyNavigableGridView.qml \
 	gui/qt/qml/utils/KeyNavigableListView.qml \
diff --git a/modules/gui/qt/qml/utils/NavigableCol.qml b/modules/gui/qt/qml/utils/NavigableCol.qml
new file mode 100644
index 0000000000..08813606e3
--- /dev/null
+++ b/modules/gui/qt/qml/utils/NavigableCol.qml
@@ -0,0 +1,117 @@
+/*****************************************************************************
+ * 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 org.videolan.vlc 0.1
+
+
+NavigableFocusScope {
+    id: navigableCol
+
+    property alias model: colRepeater.model
+    property alias delegate: colRepeater.delegate
+
+    width: col.width
+    height: col.height
+    property alias implicitWidth: col.implicitWidth
+    property alias implicitHeight: col.implicitHeight
+
+    Keys.priority: Keys.AfterItem
+    Keys.onPressed: defaultKeyAction(event, 0)
+
+    navigable: _countEnabled > 0
+    property int _countEnabled: 0
+
+    Component {
+        id: enabledConnection
+        Connections {
+            onEnabledChanged: {
+                navigableCol._countEnabled += ( target.enabled ? 1 : -1)
+            }
+        }
+    }
+
+    Column {
+        id: col
+
+        Repeater{
+            id: colRepeater
+
+            onItemAdded: {
+                if (item.enabled) {
+                    navigableCol._countEnabled += 1
+                }
+                enabledConnection.createObject(item, {target: item})
+
+                item.Keys.pressed.connect(function(event) {
+                    if (event.accepted)
+                        return
+                    var i = index
+                    if (event.key ===  Qt.Key_Up) {
+                        do {
+                            i--;
+                        } while (i >= 0 && (!colRepeater.itemAt(i).enabled || !colRepeater.itemAt(i).visible))
+
+                        if (i === -1) {
+                            navigableCol.navigationUp()
+                        } else {
+                            colRepeater.itemAt(i).forceActiveFocus()
+                        }
+                        event.accepted = true
+
+                    } else if (event.key ===  Qt.Key_Down) {
+                        do {
+                            i++;
+                        } while (i < colRepeater.count && (!colRepeater.itemAt(i).enabled || !colRepeater.itemAt(i).visible))
+
+                        if (i === colRepeater.count) {
+                            navigableCol.navigationDown()
+                        } else {
+                            colRepeater.itemAt(i).forceActiveFocus()
+                        }
+                        event.accepted = true
+                    }
+                })
+            }
+
+            onItemRemoved:  {
+                if (item.enabled) {
+                    navigableCol._countEnabled -= 1
+                }
+            }
+        }
+    }
+
+    onActiveFocusChanged: {
+        if (activeFocus) {
+            var firstWithoutFocus = undefined
+            for (var i = 0 ; i < colRepeater.count; i++) {
+                var item= colRepeater.itemAt(i)
+                if (item.enabled && item.visible) {
+                    //already an item with the focus, keep it this way
+                    if (item.focus )
+                        return
+                    else if (!firstWithoutFocus)
+                        firstWithoutFocus = item
+                }
+            }
+            if (firstWithoutFocus)
+                firstWithoutFocus.focus = true
+            return
+        }
+    }
+}
diff --git a/modules/gui/qt/vlc.qrc b/modules/gui/qt/vlc.qrc
index f7b28be11a..7863aa59cd 100644
--- a/modules/gui/qt/vlc.qrc
+++ b/modules/gui/qt/vlc.qrc
@@ -205,6 +205,7 @@
         <file alias="RoundImage.qml">qml/utils/RoundImage.qml</file>
         <file alias="VideoQualityLabel.qml">qml/utils/VideoQualityLabel.qml</file>
         <file alias="VideoProgressBar.qml">qml/utils/VideoProgressBar.qml</file>
+        <file alias="NavigableCol.qml">qml/utils/NavigableCol.qml</file>
         <file alias="NavigableRow.qml">qml/utils/NavigableRow.qml</file>
         <file alias="TabButtonExt.qml">qml/utils/TabButtonExt.qml</file>
     </qresource>
-- 
2.20.1



More information about the vlc-devel mailing list