QML ScrollBar/ListView sensitivity for mouse wheel. How to adjust

4.5k views Asked by At

There is QML control ScrollBar , and mouse wheel scrolls the list fast, I need to perform this slower. Which properties can be used for that?

Qt 5.9

this is from an examples (rssnews sample project from Qt kit):

...
ListView {
    id: categories
    property int itemWidth: 190


    width: isPortrait ? parent.width : itemWidth
    height: isPortrait ? itemWidth : parent.height
    orientation: isPortrait ? ListView.Horizontal : ListView.Vertical
    anchors.top: parent.top
    model: rssFeeds
    delegate: CategoryDelegate { itemSize: categories.itemWidth }
    spacing: 3
}

ScrollBar {
    id: listScrollBar

    orientation: isPortrait ? Qt.Horizontal : Qt.Vertical
    height: isPortrait ? 8 : categories.height;
    width: isPortrait ? categories.width : 8
    scrollArea: categories;

    anchors.right: categories.right
}
...

I see this for ScrollView:

/*! \internal */
property alias __wheelAreaScrollSpeed: wheelArea.scrollSpeed

But can't find scrollSpeed property for my case...

2

There are 2 answers

0
derM - not here for BOT dreams On BEST ANSWER

I don't think the ScrollBar is what makes the things go wild. It is the Flickable that is the base class of the ListView.

There you have the property: maximumFlickVelocity which is in pixel / second.

Try to set this to an appropriate value.

This will also affect the flicking behavior!

If it is the ScrollBar you might try the property: stepSize - set it to something smaller than 0.1. I don't have Qt5.9 so I can't try it. I don't belive this is the reason though.

In the worst case, layer a MouseArea ontop of the whole thing, that does not accept any buttons, but handles onWheel:

MouseArea {
    anchors.fill: parent
    acceptedButtons: Qt.NoButton
    //onWheel: manage the scrolling yourself, here.
}
0
mvollmer On

Wrapping a MouseArea (like derM mentioned) on top of the ListView was the solution for me. Now the ListView reacts on the mouse wheel.

MouseArea {
    anchors.fill: parent
    ListView {
        id: lv
        anchors.fill: parent
        delegate: ...
        ScrollBar.vertical: ScrollBar {
            parent: lv.parent
            anchors.top: lv.top
            anchors.left: lv.right
            anchors.bottom: lv.bottom
        }
    }
}