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.1
Rectangle {
width: 360
height: 360
Row {
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);
});
}
}
}
↧
