[vlc-commits] qml: add recents section

Abel Tesfaye git at videolan.org
Tue Jul 30 17:57:16 CEST 2019


vlc | branch: master | Abel Tesfaye <Abeltesfaye45 at gmail.com> | Mon Jul 22 16:26:55 2019 +0300| [7bd13a56dee55358faf24781cf4d1c895344d014] | committer: Jean-Baptiste Kempf

qml: add recents section

> http://git.videolan.org/gitweb.cgi/vlc.git/?a=commit;h=7bd13a56dee55358faf24781cf4d1c895344d014
---

 modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml | 150 +++++++++++++++++++++-
 modules/gui/qt/qml/style/VLCStyle.qml             |   2 +
 modules/gui/qt/qml/utils/KeyNavigableListView.qml |  48 +++++--
 3 files changed, 186 insertions(+), 14 deletions(-)

diff --git a/modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml b/modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml
index 6a2d0a799c..6b1f3e5742 100644
--- a/modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml
+++ b/modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml
@@ -62,10 +62,11 @@ Utils.NavigableFocusScope {
                onTriggered: medialib.addToPlaylist( contextMenu.model.id )
            }
            Utils.MenuItemExt {
+               enabled:root.currentGridView.switchExpandItem !== undefined
                text: "Information"
                onTriggered: {
                    root.currentGridView.switchExpandItem(contextMenu.model.index,root.currentGridView.currentItem)
-                }
+               }
            }
            Utils.MenuItemExt {
                text: "Download subtitles"
@@ -135,6 +136,7 @@ Utils.NavigableFocusScope {
             }
 
 
+            property int currentIndexRecents: -1
             property int currentIndexVideos: -1
 
             Rectangle {
@@ -148,10 +150,149 @@ Utils.NavigableFocusScope {
                 }
 
             Rectangle {
+                id: recentsSection
+                anchors {
+                    left: parent.left
+                    right: parent.right
+                }
+                implicitHeight: visible ? childrenRect.height: 0
+                color: "transparent"
+                enabled: visible
+                visible: recentsDelegate.items.count > 0
+
+                Utils.LabelSeparator {
+                    id: recentsSeparator
+                    text: qsTr("Recents")
+                }
+
+                Rectangle {
+                    color: "transparent"
+                    anchors.top: recentsSeparator.bottom
+                    anchors.left: parent.left
+                    anchors.right: parent.right
+                    height: recentsGV.contentHeight
+
+                    Utils.SelectableDelegateModel {
+                        id: recentsDelegate
+                       model: MLRecentsVideoModel {
+                           ml: medialib
+                       }
+
+                        delegate: Package {
+                            id: recentsElement
+                            Utils.GridItem {
+                                Package.name: "grid"
+                                image: model.thumbnail || VLCStyle.noArtCover
+                                title: model.title || qsTr("Unknown title")
+                                selected: recentsGV.activeFocus && recentsElement.DelegateModel.inSelected
+                                infoLeft: model.duration
+                                resolution: model.resolution_name
+                                channel: model.channel
+                                isVideo: true
+                                isNew: model.playcount < 1
+                                progress: model.saved_position > 0 ? model.saved_position : 0
+                                pictureWidth: VLCStyle.video_large_width
+                                pictureHeight: VLCStyle.video_large_height
+                                onItemClicked : {
+                                    if (key == Qt.RightButton){
+                                        contextMenu.model = model
+                                        contextMenu.popup(menuParent)
+                                    }
+                                    recentsDelegate.updateSelection( modifier , view.currentItem.currentIndexRecents, index)
+                                    view.currentItem.currentIndexRecents = index
+                                    root.currentGridView = recentsGV
+                                    root.currentGridView.currentIndex = index
+                                    root.currentGridView.forceActiveFocus()
+                                }
+                                onPlayClicked: medialib.addAndPlay( model.id )
+                                onAddToPlaylistClicked : medialib.addToPlaylist( model.id )
+                                onContextMenuButtonClicked:{
+                                    contextMenu.model = model;
+                                    contextMenu.popup(menuParent,contextMenu.width,0,playMenuItem)
+                                }
+                                onSelectedChanged:{
+                                    if(selected)
+                                        root.currentGridView = recentsGV
+                                }
+
+                            }
+
+                        }
+                        function actionAtIndex(index) {
+                            var list = []
+                            for (var i = 0; i < recentsDelegate.selectedGroup.count; i++)
+                                list.push(recentsDelegate.selectedGroup.get(i).model.id)
+                            medialib.addAndPlay( list )
+                        }
+                    }
+
+                    Utils.KeyNavigableListView {
+                        id: recentsGV
+                        anchors.fill:parent
+                        anchors.leftMargin: leftBtn.width/2
+                        anchors.rightMargin: rightBtn.width/2
+
+                        model: recentsDelegate.parts.grid
+                        modelCount: recentsDelegate.items.count
+                        orientation: ListView.Horizontal
+
+                        onSelectAll: recentsDelegate.selectAll()
+                        onSelectionUpdated: recentsDelegate.updateSelection( keyModifiers, oldIndex, newIndex )
+                        onActionAtIndex: recentsDelegate.actionAtIndex(index)
+
+                        onActionLeft: root.actionLeft(index)
+                        onActionRight: root.actionRight(index)
+                        onActionDown: videosGV.forceActiveFocus()
+                        onActionUp: root.actionUp(index)
+                        onActionCancel: root.actionCancel(index)
+
+                        /*
+                         *define the intial position/selection
+                         * This is done on activeFocus rather than Component.onCompleted because recentsDelegate.
+                         * selectedGroup update itself after this event
+                         */
+                        onActiveFocusChanged: {
+                            if (activeFocus && recentsDelegate.items.count > 0 && recentsDelegate.selectedGroup.count === 0) {
+                                var initialIndex = 0
+                                if (view.currentItem.currentIndexRecents !== -1)
+                                    initialIndex = view.currentItem.currentIndexRecents
+                                recentsDelegate.items.get(initialIndex).inSelected = true
+                                view.currentItem.currentIndexRecents = initialIndex
+                            }
+                            if (activeFocus)
+                                flickable.ScrollBar.vertical.position = 0
+
+                        }
+
+                    }
+
+
+                    Utils.RoundButton{
+                        id: leftBtn
+                        anchors.verticalCenter: parent.verticalCenter
+                        anchors.left: parent.left
+                        text:"<"
+                        onClicked: recentsGV.prevPage()
+                    }
+
+
+                    Utils.RoundButton{
+                        id: rightBtn
+                        anchors.verticalCenter: parent.verticalCenter
+                        anchors.right: parent.right
+                        text:">"
+                        onClicked: recentsGV.nextPage()
+                    }
+               }
+            }
+
+
+            Rectangle {
                 id: videosSection
                 anchors {
                     left: parent.left
                     right: parent.right
+                    top: recentsSection.bottom
                 }
                 implicitHeight: childrenRect.height
                 color: "transparent"
@@ -186,7 +327,7 @@ Utils.NavigableFocusScope {
                             if (key == Qt.RightButton){
                                 contextMenu.model = delegateModelItem.model
                                 contextMenu.popup()
-                }
+                            }
                             videosDelegate.updateSelection( modifier , view.currentItem.currentIndexVideos, delegateModelItem.itemsIndex)
                             view.currentItem.currentIndexVideos = delegateModelItem.itemsIndex
                             root.currentGridView = videosGV
@@ -210,11 +351,12 @@ Utils.NavigableFocusScope {
                                     flickable.contentY = ((view.height + videosGV.currentItem.y) > flickable.contentHeight) ?
                                                 flickable.contentHeight-view.height : videosSection.y + videosGV.currentItem.y
                             }
-                }
+                    }
 
                         onActionLeft: root.actionLeft(index)
                         onActionRight: root.actionRight(index)
                         onActionDown: root.actionDown(index)
+                        onActionUp: recentsGV.forceActiveFocus()
                         onActionCancel: root.actionCancel(index)
 
                         /*
@@ -234,10 +376,10 @@ Utils.NavigableFocusScope {
 
                     }
 
-                    }
                 }
             }
         }
+        }
     }
 
     Component {
diff --git a/modules/gui/qt/qml/style/VLCStyle.qml b/modules/gui/qt/qml/style/VLCStyle.qml
index 144d401470..0a33aa89dc 100644
--- a/modules/gui/qt/qml/style/VLCStyle.qml
+++ b/modules/gui/qt/qml/style/VLCStyle.qml
@@ -103,7 +103,9 @@ Item {
 
     property int selectedBorder: 2
     property real video_normal_height: 160 * scale;
+    property real video_large_height: 200 * scale;
     property real video_normal_width: video_normal_height * (16/10);
+    property real video_large_width: video_large_height * (16/10);
 
     property int miniPlayerHeight: 60 * scale;
 
diff --git a/modules/gui/qt/qml/utils/KeyNavigableListView.qml b/modules/gui/qt/qml/utils/KeyNavigableListView.qml
index 618d50b7c9..c0f8ec3324 100644
--- a/modules/gui/qt/qml/utils/KeyNavigableListView.qml
+++ b/modules/gui/qt/qml/utils/KeyNavigableListView.qml
@@ -57,6 +57,14 @@ NavigableFocusScope {
     property alias highlightMoveVelocity: view.highlightMoveVelocity
 
     property alias section: view.section
+    property alias orientation: view.orientation
+
+    function nextPage() {
+        view.contentX += (Math.min(view.width, (view.contentWidth - view.width - view.contentX ) ))
+    }
+    function prevPage() {
+        view.contentX -= Math.min(view.width,view.contentX )
+    }
 
     Component {
         id: sectionHeading
@@ -83,11 +91,14 @@ NavigableFocusScope {
         anchors.fill: parent
         //key navigation is reimplemented for item selection
         keyNavigationEnabled: false
+        contentWidth: contentItem.childrenRect.width
+        contentHeight: contentItem.childrenRect.height
 
         focus: true
 
         clip: true
         ScrollBar.vertical: ScrollBar { id: scroll_id }
+        ScrollBar.horizontal: ScrollBar { }
 
         highlightMoveDuration: 300 //ms
         highlightMoveVelocity: 1000 //px/s
@@ -125,16 +136,33 @@ NavigableFocusScope {
 
         Keys.onPressed: {
             var newIndex = -1
-            if ( event.key === Qt.Key_Down || event.matches(StandardKey.MoveToNextLine) ||event.matches(StandardKey.SelectNextLine) ) {
-                if (currentIndex !== modelCount - 1 )
-                    newIndex = currentIndex + 1
-            } else if ( event.key === Qt.Key_PageDown || event.matches(StandardKey.MoveToNextPage) ||event.matches(StandardKey.SelectNextPage)) {
-                newIndex = Math.min(modelCount - 1, currentIndex + 10)
-            } else if ( event.key === Qt.Key_Up || event.matches(StandardKey.MoveToPreviousLine) ||event.matches(StandardKey.SelectPreviousLine) ) {
-                if ( currentIndex !== 0 )
-                    newIndex = currentIndex - 1
-            } else if ( event.key === Qt.Key_PageUp || event.matches(StandardKey.MoveToPreviousPage) ||event.matches(StandardKey.SelectPreviousPage)) {
-                newIndex = Math.max(0, currentIndex - 10)
+
+            if (orientation === ListView.Vertical)
+            {
+                if ( event.key === Qt.Key_Down || event.matches(StandardKey.MoveToNextLine) ||event.matches(StandardKey.SelectNextLine) ) {
+                    if (currentIndex !== modelCount - 1 )
+                        newIndex = currentIndex + 1
+                } else if ( event.key === Qt.Key_PageDown || event.matches(StandardKey.MoveToNextPage) ||event.matches(StandardKey.SelectNextPage)) {
+                    newIndex = Math.min(modelCount - 1, currentIndex + 10)
+                } else if ( event.key === Qt.Key_Up || event.matches(StandardKey.MoveToPreviousLine) ||event.matches(StandardKey.SelectPreviousLine) ) {
+                    if ( currentIndex !== 0 )
+                        newIndex = currentIndex - 1
+                } else if ( event.key === Qt.Key_PageUp || event.matches(StandardKey.MoveToPreviousPage) ||event.matches(StandardKey.SelectPreviousPage)) {
+                    newIndex = Math.max(0, currentIndex - 10)
+                }
+            }else{
+                if ( event.key === Qt.Key_Right || event.matches(StandardKey.SelectNextLine) ) {
+                    if (currentIndex !== modelCount - 1 )
+                        newIndex = currentIndex + 1
+                }
+                else if ( event.key === Qt.Key_PageDown || event.matches(StandardKey.MoveToNextPage) ||event.matches(StandardKey.SelectNextPage)) {
+                    newIndex = Math.min(modelCount - 1, currentIndex + 10)
+                } else if ( event.key === Qt.Key_Left || event.matches(StandardKey.SelectPreviousLine) ) {
+                    if ( currentIndex !== 0 )
+                        newIndex = currentIndex - 1
+                } else if ( event.key === Qt.Key_PageUp || event.matches(StandardKey.MoveToPreviousPage) ||event.matches(StandardKey.SelectPreviousPage)) {
+                    newIndex = Math.max(0, currentIndex - 10)
+                }
             }
 
             if (newIndex >= 0 && newIndex < modelCount) {



More information about the vlc-commits mailing list