Focus is not shifting to the clicked delegate in Listview

Question

I have a ListModel called AddressModel and a Listview to display the model contents, Delegate contains two rectangle components (act as Up and Down buttons) and a Text component, My requirement is to shift the focus to clicked delegate i have added the line list.currentIndex = index in delegate, but it's not working. Pls help me resolve the issue.

This is my ListView.Qml file

import QtQuick 2.0

Rectangle {
    id: idRect

    width: 600 ; height: 300

    Component {
        id: idCompDelegate
        Item {
            id: idItmRow
            width: 600
            height: 50
            Row {
                id: idRow

                spacing: 100

                Rectangle {
                    id: idRectUp

                    width: 150
                    height: 50
                    color: "lightsteelblue"
                    radius: 8
                    Text {
                        anchors.centerIn: parent
                        text: "Up"
                    }

                    MouseArea {
                        id: idMouseAreaUp
                        anchors.fill:  parent
                        propagateComposedEvents: true
                        onClicked: {

                            list.currentIndex = index   //it's not working
                                    ((list.currentIndex)===0) ? console.log("Cannot Move towards Up"):list.model.move(list.currentIndex,list.currentIndex-1,1)


                        }
                    }
                }

                Text {
                    id: idCenterText
                    width: 100
                    text: firstName+" "+lastName
                }
                Rectangle {
                    id: idRectDown

                    width: 150
                    height: 50
                    color: "lightsteelblue"
                    radius: 8
                    Text {
                        anchors.centerIn: parent
                        text: "Down"
                    }
                    MouseArea {
                        id: idMouseAreaDown
                        anchors.fill:  parent
                        onClicked: {
                              list.currentIndex = index //it's not working
                            (list.count === (list.currentIndex)+1)? console.log("Cannot Move towards Down"):list.model.move(list.currentIndex,list.currentIndex+1,1)
                        }
                    }
                }
            }


        }


    }


    ListView {
        id: list
        width: parent.width
        height: parent.height

        model: AddressModel {}

        delegate:  idCompDelegate
        highlight: Rectangle { color: "lightgrey" ; radius : 8 }
        highlightFollowsCurrentItem: true
        focus: true

        spacing: 5


    }
}

koopajah koopajah · Accepted Answer · 2013-08-21T09:47:51

The issue is that your line list.currentIndex = index does not end with a ; then when you look at your next line it starts with ( so the parser thinks that you are trying to do this :

list.currentIndex = index((list.count === (list.currentIndex)+1)

So it assumes that you are calling the function index() which does not exist.

Just replace both your lines

list.currentIndex = index //it's not working

By these

list.currentIndex = index;

I think it is a good practice to always put ; at the end of your statements in QML functions like in click handlers for example. Other people even put ; at the end of each property declaration to avoid these issues!

Focus is not shifting to the clicked delegate in Listview

1 Answers