[SOLVED] Find all mouse areas and assign click event
-
I have a row with several mouse areas, see the QML-code below. When the page has been loaded I want to assign what will happen on each click via javascript. I have two questions:
Now I put all mouse areas in an array with the id of the mouse area. Could I do something more clever and find all mouse areas in the row (via childrenAt or similar)?
Now when I click on an area it seems that always the last mouse area has been click (the last value of outputString is always used). How do I solve this?
@
import QtQuick 1.1Rectangle {
width: 360
height: 360Row { id: masterRow x: 0 y: 0 Rectangle { width: 100 height: 100 color: "red" MouseArea { id: mouseAreaRed anchors.fill: parent } } Rectangle { width: 100 height: 100 color: "yellow" MouseArea { id: mouseAreaYellow anchors.fill: parent } } Rectangle { width: 100 height: 100 color: "green" MouseArea { id: mouseAreaGreen anchors.fill: parent } } } Component.onCompleted: { var areas = []; //I don't like this. areas.push(mouseAreaRed); areas.push(mouseAreaYellow); areas.push(mouseAreaGreen); for(var i=0; i<areas.length; i++) { var area = areas[i]; var outputString = "Mouse area " + i + " was clicked."; area.clicked.connect( function() { //Bug: outputString is only correct for the last item. console.log(outputString); }); } }
}
@