QML listview Overscrolls

Question

I have a horizontal listview as given in the image

Now when I scroll it the listview gets overscrolled as in the below image

What I actually need is even if the drag is more , the last element should stay at the end as in the below image

How can I do that.

EDIT

ListView Source

ListView{

        id: list
        width: 500
        height: 100
        clip: true
        //anchors.bottom: parent.bottom
        //anchors.bottomMargin: 10
        snapMode: ListView.SnapToItem
        anchors.centerIn: parent
        highlightRangeMode: ListView.StrictlyEnforceRange
        highlightFollowsCurrentItem: true
        highlight: Rectangle { color: "#00000000" ;border.color: "red" ; radius: 5 }
        anchors.horizontalCenter: parent.horizontalCenter
        orientation: ListView.Horizontal
        model: ListModel{
            id: listModel
            ListElement{ name: "File"}
            ListElement{ name: "Edit"}
            ListElement{ name: "Build"}
            ListElement{ name: "Debug"}
            ListElement{ name: "Analyze"}
            ListElement{ name: "Tools"}
            ListElement{ name: "Window"}
            ListElement{ name: "Help"}
        }

        delegate: Button{
            borderColor: buttonBorderColor;buttonColor: buttonFillColor
            width: 100;height: 100 ;labelSize: 18
            label: model.name
            onButtonClick: {
                list.currentIndex = model.index;
                console.log("ListView Button clicked" + model.index)
            }
        }
    }

Answer 1

You need to tell the ListView to stop at the object bounds by setting its boundsBehavior property:

boundsBehavior: Flickable.StopAtBounds

By default, objects that inherit Flickable overshoot the bounds and move back.

See the boundsBehavior property description on the Qt website.