From 5d93b442afacd94ec13e63dfb58b1435ce5d72cd Mon Sep 17 00:00:00 2001
From: Fatih Uzunoglu <fuzun54@outlook.com>
Date: Thu, 28 Jul 2022 00:28:32 +0300
Subject: [PATCH] qml: use FadingEdgeListView in KeyNavigableListView
---
.../qml/VideoDisplayRecentVideos.qml | 2 -
.../gui/qt/playlist/qml/PlaylistListView.qml | 3 -
.../qt/widgets/qml/KeyNavigableListView.qml | 213 +-----------------
.../qt/widgets/qml/KeyNavigableTableView.qml | 3 -
4 files changed, 4 insertions(+), 217 deletions(-)
diff --git a/modules/gui/qt/medialibrary/qml/VideoDisplayRecentVideos.qml b/modules/gui/qt/medialibrary/qml/VideoDisplayRecentVideos.qml
index 220f9a63711c..e8de110f3cf9 100644
--- a/modules/gui/qt/medialibrary/qml/VideoDisplayRecentVideos.qml
+++ b/modules/gui/qt/medialibrary/qml/VideoDisplayRecentVideos.qml
@@ -95,8 +95,6 @@ FocusScope {
focus: true
- fadeColor: VLCStyle.colors.bg
-
Navigation.parentItem: root
visible: listView.count > 0
diff --git a/modules/gui/qt/playlist/qml/PlaylistListView.qml b/modules/gui/qt/playlist/qml/PlaylistListView.qml
index 9315c5f1312e..6690cb6b1890 100644
--- a/modules/gui/qt/playlist/qml/PlaylistListView.qml
+++ b/modules/gui/qt/playlist/qml/PlaylistListView.qml
@@ -300,9 +300,6 @@ Control {
dragAutoScrollDragItem: dragItem
- fadeColor: background.usingAcrylic ? undefined
- : background.alternativeColor
-
property int shiftIndex: -1
property Item itemContainsDrag: null
diff --git a/modules/gui/qt/widgets/qml/KeyNavigableListView.qml b/modules/gui/qt/widgets/qml/KeyNavigableListView.qml
index d99d19047ecf..134928281f4c 100644
--- a/modules/gui/qt/widgets/qml/KeyNavigableListView.qml
+++ b/modules/gui/qt/widgets/qml/KeyNavigableListView.qml
@@ -25,18 +25,11 @@ import "qrc:///style/"
import "qrc:///util/" as Util
import "qrc:///util/Helpers.js" as Helpers
-ListView {
+FadingEdgeListView {
id: root
// Properties
- property int fadeSize: root.delegateItem
- ? (orientation === Qt.Vertical ? root.delegateItem.height
- : root.delegateItem.width) / 2
- : (VLCStyle.margin_large * 2)
-
- property var fadeColor: undefined // fading will only work when fade color is defined
-
// NOTE: We want buttons to be centered vertically but configurable.
property int buttonMargin: height / 2 - buttonLeft.height / 2
@@ -44,54 +37,6 @@ ListView {
property bool keyNavigationWraps : false
- // TODO: Use itemAtIndex(0) Qt >= 5.13
- // FIXME: Delegate with variable size
- readonly property Item delegateItem: root.contentItem.children.length > 0
- ? root.contentItem.children[root.contentItem.children.length - 1]
- : null
-
- readonly property bool transitionsRunning: ((root.add ? root.add.running : false) ||
- (root.addDisplaced ? root.addDisplaced.running : false) ||
- (root.populate ? root.populate.running : false) ||
- (root.remove ? root.remove.running : false) ||
- (root.removeDisplaced ? root.removeDisplaced.running : false))
-
- readonly property Item firstVisibleItem: {
- if (transitionsRunning || !delegateItem)
- return null
-
- var margin = -root.displayMarginBeginning
- if (orientation === Qt.Vertical) {
- if (headerItem && headerItem.visible && headerPositioning === ListView.OverlayHeader)
- margin += headerItem.height
-
- return itemAt(contentX + (delegateItem.x + delegateItem.width / 2), contentY + margin)
- } else {
- if (headerItem && headerItem.visible && headerPositioning === ListView.OverlayHeader)
- margin += headerItem.width
-
- return itemAt(contentX + margin, contentY + (delegateItem.y + delegateItem.height / 2))
- }
- }
-
- readonly property Item lastVisibleItem: {
- if (transitionsRunning || !delegateItem)
- return null
-
- var margin = -root.displayMarginEnd
- if (orientation === Qt.Vertical) {
- if (footerItem && footerItem.visible && footerPositioning === ListView.OverlayFooter)
- margin += footerItem.height
-
- return itemAt(contentX + (delegateItem.x + delegateItem.width / 2), contentY + height - margin - 1)
- } else {
- if (footerItem && footerItem.visible && footerPositioning === ListView.OverlayFooter)
- margin += footerItem.width
-
- return itemAt(contentX + width - margin - 1, contentY + (delegateItem.y + delegateItem.height / 2))
- }
- }
-
// Private
property bool _keyPressed: false
@@ -124,9 +69,6 @@ ListView {
property int _currentFocusReason: Qt.OtherFocusReason
- readonly property bool _fadeRectEnoughSize: (root.orientation === Qt.Vertical
- ? root.height
- : root.width) > (fadeSize * 2 + VLCStyle.dp(25))
// Settings
@@ -192,6 +134,9 @@ ListView {
// NOTE: We always want a valid 'currentIndex' by default.
onCountChanged: if (count && currentIndex === -1) currentIndex = 0
+ disableBeginningFade: (dragAutoScrollHandler.scrollingDirection === Util.ViewDragAutoScrollHandler.Backward)
+ disableEndFade: (dragAutoScrollHandler.scrollingDirection === Util.ViewDragAutoScrollHandler.Forward)
+
Keys.onPressed: {
var newIndex = -1
@@ -335,156 +280,6 @@ ListView {
}
}
- // TODO: Make fade rectangle inline component when Qt >= 5.15
- LinearGradient {
- id: fadeRectStart
-
- anchors {
- top: parent.top
- left: parent.left
- right: root.orientation === Qt.Vertical ? parent.right : undefined
- bottom: root.orientation === Qt.Horizontal ? root.bottom : undefined
- topMargin: root.orientation === Qt.Vertical ? ((root.headerItem &&
- root.headerItem.visible &&
- (root.headerPositioning === ListView.OverlayHeader)) ? root.headerItem.height
- : 0) - root.displayMarginBeginning
- : 0
- leftMargin: root.orientation === Qt.Horizontal ? ((root.headerItem &&
- root.headerItem.visible &&
- (root.headerPositioning === ListView.OverlayHeader)) ? root.headerItem.width
- : 0) - root.displayMarginBeginning
- : 0
- }
-
- implicitHeight: fadeSize
- implicitWidth: fadeSize
-
- visible: (opacity !== 0.0)
- opacity: 0.0
-
- readonly property bool requestShow: !root.firstVisibleItem ||
- (!root.firstVisibleItem.activeFocus &&
- // TODO: Qt >5.12 use HoverHandler within the fade:
- !Helpers.get(root.firstVisibleItem, "hovered", false)) &&
- (dragAutoScrollHandler.scrollingDirection !== Util.ViewDragAutoScrollHandler.Backward)
-
- state: (!!root.fadeColor &&
- root._fadeRectEnoughSize &&
- requestShow &&
- (orientation === ListView.Vertical ? !root.atYBeginning
- : !root.atXBeginning)) ? "shown"
- : ""
-
- states: State {
- name: "shown"
- PropertyChanges {
- target: fadeRectStart
- opacity: 1.0
- }
- }
-
- transitions: Transition {
- from: ""; to: "shown"
- reversible: true
-
- NumberAnimation {
- property: "opacity"
- duration: VLCStyle.duration_short
- easing.type: Easing.InOutSine
- }
- }
-
- start: Qt.point(0, 0)
-
- end: {
- if (root.orientation === ListView.Vertical) {
- return Qt.point(0, fadeRectStart.height)
- } else {
- return Qt.point(fadeRectStart.width, 0)
- }
- }
-
- gradient: Gradient {
- GradientStop { position: 0.0; color: !!fadeColor ? fadeColor : "transparent" }
- GradientStop { position: 1.0; color: "transparent" }
- }
- }
-
- LinearGradient {
- id: fadeRectEnd
-
- anchors {
- top: root.orientation === Qt.Horizontal ? parent.top : undefined
- left: root.orientation === Qt.Vertical ? parent.left : undefined
- right: parent.right
- bottom: parent.bottom
-
- bottomMargin: root.orientation === Qt.Vertical ? ((root.footerItem &&
- root.footerItem.visible &&
- (root.footerPositioning === ListView.OverlayFooter)) ? root.footerItem.height
- : 0) - root.displayMarginEnd
- : 0
- rightMargin: root.orientation === Qt.Horizontal ? ((root.footerItem &&
- root.footerItem.visible &&
- (root.headerPositioning === ListView.OverlayFooter)) ? root.footerItem.width
- : 0) - root.displayMarginEnd
- : 0
- }
-
- implicitHeight: fadeSize
- implicitWidth: fadeSize
-
- visible: opacity !== 0.0
- opacity: 0.0
-
- readonly property bool requestShow: !root.lastVisibleItem ||
- (!root.lastVisibleItem.activeFocus &&
- // TODO: Qt >5.12 use HoverHandler within the fade:
- !Helpers.get(root.lastVisibleItem, "hovered", false)) &&
- (dragAutoScrollHandler.scrollingDirection !== Util.ViewDragAutoScrollHandler.Forward)
-
- state: (!!root.fadeColor &&
- root._fadeRectEnoughSize &&
- requestShow &&
- (orientation === ListView.Vertical ? !root.atYEnd
- : !root.atXEnd)) ? "shown"
- : ""
-
- states: State {
- name: "shown"
- PropertyChanges {
- target: fadeRectEnd
- opacity: 1.0
- }
- }
-
- transitions: Transition {
- from: ""; to: "shown"
- reversible: true
-
- NumberAnimation {
- property: "opacity"
- duration: VLCStyle.duration_short
- easing.type: Easing.InOutSine
- }
- }
-
- start: Qt.point(0, 0)
-
- end: {
- if (root.orientation === ListView.Vertical) {
- return Qt.point(0, fadeRectEnd.height)
- } else {
- return Qt.point(fadeRectEnd.width, 0)
- }
- }
-
- gradient: Gradient {
- GradientStop { position: 0.0; color: "transparent" }
- GradientStop { position: 1.0; color: !!fadeColor ? fadeColor : "transparent" }
- }
- }
-
// FIXME: We probably need to upgrade these RoundButton(s) eventually. And we probably need
// to have some kind of animation when switching pages.
diff --git a/modules/gui/qt/widgets/qml/KeyNavigableTableView.qml b/modules/gui/qt/widgets/qml/KeyNavigableTableView.qml
index 485a1cbd7dc2..e0e8667a8582 100644
--- a/modules/gui/qt/widgets/qml/KeyNavigableTableView.qml
+++ b/modules/gui/qt/widgets/qml/KeyNavigableTableView.qml
@@ -97,7 +97,6 @@ FocusScope {
property alias footerItem: view.footerItem
property alias footer: view.footer
- property alias fadeColor: view.fadeColor
property alias fadeSize: view.fadeSize
property alias add: view.add
@@ -212,8 +211,6 @@ FocusScope {
headerPositioning: ListView.OverlayHeader
- fadeColor: VLCStyle.colors.bg
-
onDeselectAll: {
if (selectionDelegateModel) {
selectionDelegateModel.clear()
--
GitLab