[vlc-commits] [Git][videolan/vlc][master] qml: add delegate height and remove displaced animations in side navigation view

[Felix Paul Kühne (@fkuehne)]

Felix Paul Kühne pushed to branch master at VideoLAN / VLC


Commits:
433ae175 by Fatih Uzunoglu at 2026-07-21T14:09:14+02:00
qml: add delegate height and remove displaced animations in side navigation view

- - - - -


1 changed file:

- modules/gui/qt/maininterface/qml/SideNavigationPane.qml


Changes:

=====================================
modules/gui/qt/maininterface/qml/SideNavigationPane.qml
=====================================
@@ -113,6 +113,20 @@ T.Pane {
                 fadingEdge.backgroundColor:  (root.background && (root.background.color.a >= 1.0)) ? root.background.color
                                                                                                    : "transparent"
 
+                component DelegateAnimation : NumberAnimation {
+                    easing.type: Easing.InOutSine
+                    duration: VLCStyle.duration_long
+                }
+
+                reuseItems: false // Not relevant here, we disable it because of QTBUG-131106 when transition is involved.
+
+                // As the docs note, `ListView` transitions do not seem to handle height animation. For that reason,
+                // we animate the height directly in the delegate (Qt's recommended workaround). Because of this, we
+                // do not need to have `addDisplaced` transition here, but we can have `removeDisplaced` here:
+                removeDisplaced: Transition {
+                    DelegateAnimation { property: "y" }
+                }
+
                 onCurrentIndexChanged: {
                     const rowIndex = navigationModel.index(currentIndex, 0)
 
@@ -121,13 +135,23 @@ T.Pane {
                         navigationModel.setData(rowIndex, true, NavigationModel.EXPANDED)
                 }
 
+                property bool readyForAnimations: false
+
+                onModelChanged: {
+                    if (!listView.readyForAnimations)
+                        Qt.callLater(() => { listView.readyForAnimations = true })
+                }
+
                 Navigation.parentItem: root
                 Navigation.downItem: preferenceButton
 
                 delegate: SideNavigationDelegate {
+                    id: delegate
 
                     width: ListView.view.contentWidth
-                    height: VLCStyle.buttonHeightNavigationPane
+                    height: preferredHeight
+
+                    property real preferredHeight: VLCStyle.buttonHeightNavigationPane
 
                     leftPadding: root.safeAreaLeftMargin + VLCStyle.margin_xsmall
                     rightPadding: root.safeAreaRightMargin
@@ -146,6 +170,32 @@ T.Pane {
                         listView.currentIndex = index
                         listView.forceActiveFocus(focusReason)
                     }
+
+                    Behavior on height {
+                        id: heightBehavior
+
+                        enabled: false
+
+                        DelegateAnimation {
+                            onRunningChanged: {
+                                if (running) {
+                                    delegate.clip = true
+                                } else {
+                                    delegate.clip = false
+                                }
+                            }
+                        }
+                    }
+
+                    ListView.onAdd: {
+                        if (listView.readyForAnimations) {
+                            heightBehavior.enabled = false
+                            delegate.height = 0.0
+                            heightBehavior.enabled = true
+                            delegate.height = Qt.binding(() => delegate.preferredHeight)
+                            heightBehavior.enabled = false
+                        }
+                    }
                 }
             }
 



View it on GitLab: https://code.videolan.org/videolan/vlc/-/commit/433ae175e1873852d951011db5afdde544efc2b9

-- 
View it on GitLab: https://code.videolan.org/videolan/vlc/-/commit/433ae175e1873852d951011db5afdde544efc2b9
You're receiving this email because of your account on code.videolan.org. Manage all notifications: https://code.videolan.org/-/profile/notifications | Help: https://code.videolan.org/help