P2: Important Description
Using the indicators example with following modification:
Rectangle {
id: root
width: 1000
height: 1000
color: "black"
...
SafeImage {
id: logo1
objectName: "logo1"
x: 0
y: 0
opacity: 1.0
width: 308
height: 154
//source: "tonnixtonni_testpic.png"
source: "Qt_linkedin_1000x750_cropped.png"
states: [
State { name: "A";PropertyChanges {target: logo1;x: 50; y: 50; opacity: 0.8;width:10;height: 10}},
State { name: "B";PropertyChanges {target: logo1;x: 100;y: 100;opacity: 0.8;width:20;height: 30}},
State { name: "C";PropertyChanges {target: logo1;x: 150;y: 150;opacity: 0.8;width:40;height: 50}},
State { name: "D";PropertyChanges {target: logo1;x: 200;y: 200;opacity: 0.8;width:60;height: 60}},
State { name: "E";PropertyChanges {target: logo1;x: 250;y: 250;opacity: 0.8;width:80;height: 90}},
State { name: "F";PropertyChanges {target: logo1;x: 300;y: 300;opacity: 0.8;width:150;height: 150}},
State { name: "G";PropertyChanges {target: logo1;x: 0;y: 0;opacity: 0.8;width:1000;height: 1000}}
]
transitions: [
Transition {
from: "*"
to: "*"
NumberAnimation {
properties: "x, y, opacity, width, height"
duration: 10
easing.type: Easing.InOutQuad
}
}
]
}
When using the QSR Test Harness, the transitions are done from A...G. And then when trying to change from G...A, there is an exception.
After discussion with the developer, the reason is that the position is changed first, and only then the width and height. So the G-F state transition has coordinates for the G size picture that is too large.
The better approach would be to first change the size and then the position.