Tableview row should change on pressed in QML

Question

My delegate is image in tableview, How to change image of row which is selected onPressed and onReleased it should go back in it's original state.

itemDelegate: Image
            {
                id:item_id
                height: (tableView.height/(listmodel.count < 4 ? listmodel.count : 4))
                source:
                {
                    var activeRow = tableView.currentRow === styleData.row
                    (activeRow ? Image 1 : styleData.row % 2 ? (image 2): (image 3))
                }

                MouseArea
                {
                    id:table_mouse_id
                    anchors.fill: parent

                    onPressed:
                    {
                       source = image 4
                    }

                    onReleased:
                    {
                        tableView.currentRow = styleData.row
                    }
                }

Answer 1

You can use the pressed property of the MouseArea :

source: {
            var activeRow = tableView.currentRow === styleData.row;
            (activeRow ? table_mouse_id.pressed ? image4 //pressed
                                                : Image1 //active
                       : styleData.row % 2 ? (image2)  //odd
                                           : (image3)) //even
        }

Important note: you should remove the onPressed handler, as this will override the binding (which is probably also the reason it's not working in your current setup)