diff --git a/modules/gui/qt/maininterface/qml/BannerSources.qml b/modules/gui/qt/maininterface/qml/BannerSources.qml
index 03549a70b07119b9359e50847582ec6a1dc96ae4..22052b445e17fb8ff9e894099ae3102b5defebbb 100644
--- a/modules/gui/qt/maininterface/qml/BannerSources.qml
+++ b/modules/gui/qt/maininterface/qml/BannerSources.qml
@@ -348,10 +348,20 @@ T.ToolBar {
                             contentWidth: localMenuGroup.width
                             contentHeight: VLCStyle.localToolbar_height // don't allow vertical flickering
 
-                            ScrollBar.horizontal: Widgets.ScrollBarExt {
-                                y: localMenuView.height - height
-                                width: localMenuView.availableWidth
-                                policy: ScrollBar.AsNeeded
+                            ScrollBar.horizontal: {
+                                // The content and viewport sizes are not available in here as soon as the
+                                // scroll bar is attached. This causes the scroll bar `size` to be briefly
+                                // set to 0.0, making its handle be displayed only to be hidden afterwards.
+                                if (localMenuGroup.status === Loader.Ready)
+                                    return scrollBarComponent.createObject() // rely on JS/QML engine's garbage collection
+                                else
+                                    return null
+                            }
+
+                            Component {
+                                id: scrollBarComponent
+
+                                Widgets.ScrollBarExt { orientation: Qt.Horizontal }
                             }
 
                             Loader {
diff --git a/modules/gui/qt/network/qml/BrowseHomeDisplay.qml b/modules/gui/qt/network/qml/BrowseHomeDisplay.qml
index 14f0e41a7ed83800ca128616a8c7efde66186735..37a2f3bfa261473295de7c68c8b5394333a2d4a3 100644
--- a/modules/gui/qt/network/qml/BrowseHomeDisplay.qml
+++ b/modules/gui/qt/network/qml/BrowseHomeDisplay.qml
@@ -50,6 +50,10 @@ FocusScope {
         { text: qsTr("Url"),        criteria: "mrl" }
     ]
 
+    property Component defaultScrollBar: Component {
+        Widgets.ScrollBarExt { }
+    }
+
     readonly property bool hasGridListMode: true
     readonly property bool isSearchable: true
 
@@ -135,7 +139,11 @@ FocusScope {
         anchors.leftMargin: root.leftPadding
         anchors.rightMargin: root.rightPadding
 
-        ScrollBar.vertical: Widgets.ScrollBarExt { }
+        ScrollBar.vertical: {
+            if (root.defaultScrollBar)
+                return root.defaultScrollBar.createObject() // rely on JS/QML engine's garbage collector
+            return null
+        }
 
         flickableDirection: Flickable.AutoFlickIfNeeded
         boundsBehavior: Flickable.StopAtBounds
diff --git a/modules/gui/qt/widgets/qml/ExpandGridView.qml b/modules/gui/qt/widgets/qml/ExpandGridView.qml
index 61fc52f56e6506692f920c79a8f70c77666e8e43..9b34345f0bd93d4f046de74855c0693869929648 100644
--- a/modules/gui/qt/widgets/qml/ExpandGridView.qml
+++ b/modules/gui/qt/widgets/qml/ExpandGridView.qml
@@ -19,6 +19,7 @@
 import QtQuick
 import QtQuick.Window
 import QtQuick.Controls
+import QtQuick.Templates as T
 
 import QtQml.Models
 
@@ -115,6 +116,10 @@ FocusScope {
         property bool selected: false
     }
 
+    property Component defaultScrollBar: Component {
+        ScrollBarExt { }
+    }
+
     // extra margin taken in account for positionViewAtIndex
     //
     // this is required since delegates selection rect may occupy area outside of
@@ -135,7 +140,7 @@ FocusScope {
     property alias contentHeight: flickable.contentHeight
     property alias contentWidth: flickable.contentWidth
     property alias contentX: flickable.contentX
-    property alias gridScrollBar: flickableScrollBar
+    readonly property T.ScrollBar gridScrollBar: flickable.ScrollBar.vertical
 
     property alias expandDelegate: expandItemLoader.sourceComponent
     property alias expandItem: expandItemLoader.item
@@ -784,8 +789,10 @@ FocusScope {
 
         boundsBehavior: Flickable.StopAtBounds
 
-        ScrollBar.vertical: ScrollBarExt {
-            id: flickableScrollBar
+        ScrollBar.vertical: {
+            if (root.defaultScrollBar)
+                return root.defaultScrollBar.createObject() // rely on JS/QML engine's garbage collector
+            return null
         }
 
         Component.onCompleted: {
diff --git a/modules/gui/qt/widgets/qml/ListViewExt.qml b/modules/gui/qt/widgets/qml/ListViewExt.qml
index ab4bbce99d61f10925d9fcd7e168857d8e7fd724..26760c1c37350b069f10299d8aa779a673d087fa 100644
--- a/modules/gui/qt/widgets/qml/ListViewExt.qml
+++ b/modules/gui/qt/widgets/qml/ListViewExt.qml
@@ -44,6 +44,10 @@ ListView {
     property var isDropAcceptableFunc
     property var acceptDropFunc
 
+    property Component defaultScrollBar: Component {
+        ScrollBarExt { }
+    }
+
     // Private
 
     property bool _keyPressed: false
@@ -81,8 +85,18 @@ ListView {
     keyNavigationEnabled: false
     keyNavigationWraps: false
 
-    ScrollBar.vertical: ScrollBarExt { }
-    ScrollBar.horizontal: ScrollBarExt { }
+    ScrollBar.vertical: {
+        // By default vertical scroll bar is only used when the orientation is vertical.
+        if (root.defaultScrollBar && (root.orientation === ListView.Vertical))
+            return root.defaultScrollBar.createObject() // rely on JS/QML engine's garbage collection
+        return null
+    }
+    ScrollBar.horizontal: {
+        // By default horizontal scroll bar is only used when the orientation is horizontal.
+        if (root.defaultScrollBar && (root.orientation === ListView.Horizontal))
+            return root.defaultScrollBar.createObject() // rely on JS/QML engine's garbage collection
+        return null
+    }
 
     flickableDirection: Flickable.AutoFlickIfNeeded
 
diff --git a/modules/gui/qt/widgets/qml/ScrollBarExt.qml b/modules/gui/qt/widgets/qml/ScrollBarExt.qml
index 92fd86c1a1ae7c0b73c3a258a81e31ae88752a1b..d30db00d903db5ab7998546f4138e1f7f0559441 100644
--- a/modules/gui/qt/widgets/qml/ScrollBarExt.qml
+++ b/modules/gui/qt/widgets/qml/ScrollBarExt.qml
@@ -53,6 +53,13 @@ T.ScrollBar {
         hovered: true
     }
 
+    // NOTE: Before the scroll bar size is set when it is attached to a flickable,
+    //       there is an indeterminate period where the size remains 0.0. QQuickScrollBar
+    //       using 0.0 for the size by default does not help with this situation.
+    //       We can set the size to 1.0 by default, so that we don't show the handle
+    //       (content item) before the size is determined:
+    size: 1.0
+
     component DefaultBehavior : Behavior {
         // WARNING: Qt bug: OpacityAnimator is bugged
         NumberAnimation {