Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Listview scroll one item/element at a time



  • Hello Qt devs!

    I have a ListView in qml which contains several rows (holding simple information to the user). I am implementing two buttons, which I would like to have the same functionality as the arrow buttons in the scrollbar.
    On clicking up arrow button, last/previous element in list should be displayed, similarly, on clicking down arrow button , next element in list should be displayed
    Can this be done?

    Thank you for your time!



  • @nikhil30

    Is this what you are looking for.

    import QtQuick 2.15
    import QtQuick.Controls 2.15
    
    ApplicationWindow {
        width: 640
        height: 480
        visible: true
        title: qsTr("Scroll")
    
        ScrollView {
            anchors.fill: parent
    
            ListView {
                id: listView
                width: parent.width
                model: 20
                delegate: ItemDelegate {
                    text: "Item " + (index + 1)
                    width: listView.width
                    onClicked: listView.currentIndex = index
                }
                currentIndex: 0
                highlight: Rectangle {
                    width: listView.width
                    height: 40
                    color: "transparent"
                    border.color: "red"
                }
                snapMode: ListView.SnapToItem
                footerPositioning: ListView.OverlayFooter
                footer: Row {
                    z: 2
                    Button {
                        text: "prev"
                        onClicked: listView.currentIndex = listView.currentIndex - 1
                    }
                    Button {
                        text: "next"
                        onClicked: listView.currentIndex = listView.currentIndex + 1
                    }
                }
            }
        }
    }
    
    

    Also, have a look at how positionViewAtIndex works. It helps to position the view to the specified index
    positionViewAtIndex



  • @Mammamia
    i am using Qt 5.6.3 and also not using itemDelegate as delegate.
    So how to identify the currentIndex position of list view which is displayed...?
    After clicking up/down buttons, i may need to detect the currentItem index of list.


Log in to reply