X doubles when z > 0

[ixSci]

Hi folks, please see the code below:

@import QtQuick 1.1

Item{
id: container

width: 500
height: 500

Flow{
    id: flow

    property int currentItem: -1
    width: 300
    height: 300

    spacing: 5
    Repeater{
        id: repeater

        model: 3
        Rectangle{
            id: rect

            width: 60
            height: 60
            color: "red"
            states: State{
                name: "active"
                when: flow.currentItem === index
                PropertyChanges{target: rect; height: 80; width: 80; color: "green"; z: 1}
            }
        }

    }
}
MouseArea{
    anchors.fill: flow

    onClicked: flow.currentItem = container.getIndex(mouseX, mouseY)
}

function getIndex(x, y){
    for(var i = 0; i < repeater.count; i++)
        console.log("index=" + i + ", x=" + flow.children[i].x + ", y=" + flow.children[i].y);

    for(var i = 0; i < repeater.count; i++)
    {
        if(x > flow.children[i].x && x < flow.children[i].x + flow.children[i].width)
            if(y > flow.children[i].y && y < flow.children[i].y + flow.children[i].height)
                return i;

    }
    return -1;
}

}
@

and it outputs when you click on some rect first time:
index=0, x=0, y=0
index=1, x=65, y=0
index=2, x=130, y=0

and after the second time(after z was set):
index=0, x=0, y=0
index=1, x=150, y=0
index=2, x=0, y=0

you can see that x has doubled its value after z was set and something strange has happened with the last item coordinates.
While I'm not actually bothering about the last item coordinates I want to know what happened with item's x after its z was set to non negative value.

Thanks!

[favoritas37]

I don't know if it will correct your problem but either way it would be better to add an extra inactive state to make z equal to zero when not active:

@
states: [
State{
name: "active"
when: flow.currentItem === index
PropertyChanges{target: rect; height: 80; width: 80; color: "green"; z: 1}
},
State{
name: "inactive"
when: flow.currentItem !== index
PropertyChanges{target: rect; height: 60; width: 60; color: "green"; z: 0}
}
]
@

[ixSci]

favoritas37, z is zero by default so there is no need to add an extra state since it is already in the default one.

[favoritas37]

Yeah but after making something active, how is it going to get inactive once again if you select something else? That is why i said that. Not for initialization.

[ixSci]

it will be inactive when flow.currentItem changes. And it will be changed when click on other item. It would work quite good if there was no issue with the coordinates change.

[favoritas37]

Ok i see, indeed it is a weird problem...

Would you be interested in the following implementation?

@
import QtQuick 1.1

Item{
id: container

width: 500
height: 500

MouseArea{
    anchors.fill: parent
    onClicked: flow.currentItem = -1;
}

Flow{
    id: flow
    property int currentItem: -1

    width: 500
    height: 500

    spacing: 5

    Repeater{
        id: repeater
        width: 500
        height: 500

        model: 4
        Rectangle{
            id: rect

            width: 60
            height: 60
            color: "red"
            states: [
                State{
                    name: "active"
                    when: flow.currentItem === index
                    PropertyChanges{target: rect; height: 80; width: 80; color: "green"; z: 1}
                },
                State{
                    name: "inactive"
                    when: flow.currentItem !== index
                    PropertyChanges{target: rect; height: 60; width: 60; color: "red"; z: 0}
                }
            ]
            MouseArea{
                anchors.fill: parent
                onClicked: flow.currentItem = index
            }
        }
    }
}

}
@

[ixSci]

It is actually only the part of the bigger problem. So I just want to understand what happens with coordinates.