Important: Please read the Qt Code of Conduct -

[SOLVED] How to make a Vertical scrollbar inactive when Horizontal Scrollbar is in used and vice versa?

  • I have these vertical and horizontal scrollbars and i want when one of the scrollbars is in used, another become inactive so that i can have smooth scrolling. is it possible with these codes?


    import QtQuick 1.1
    import 1.1
    import QtWebKit 1.0
    import "../delegates"
    import "../js/Util.js" as Util

        Page {
            id: tab1
            orientationLock: PageOrientation.LockPortrait
            Flickable {
                id: flicker1
                width: parent.width
                anchors{left:parent.left; leftMargin:5; right:parent.right; rightMargin:5}
                contentWidth: web.width * web.scale;
                contentHeight: web.height * web.scale;
                clip: true
                WebView {
                    transformOrigin: WebView.TopLeft
                    preferredWidth: window.width - 10
                    scale: window.height > 640 ? 1 : 0.8
            ScrollBar {
                flickableItem: flicker1
            ScrollBar {
                    flickableItem: flicker1
                    orientation: Qt.Horizontal
                    width:web.width * web.scale
                    anchors{left:parent.left; leftMargin:5; right:parent.right; rightMargin:10;
                        bottom:parent.bottom; bottomMargin:5}


  • Got it figured out myself. All I have to do is set the condition like this :

    @ flickableDirection:Flickable.Horizontal || Flickable.VerticalFlick @

    instead of
    @ flickableDirection:Flickable.HorizontalAndVerticalFlick @

    So, either horizontal or vertical scrollbar will work when scroll.
    The flickable item can now be scrolled in a more organized manner rather than moving around.


Log in to reply