I am running Qt 5.1 and QtQuick 2.0 on a Mac with OS-X 10.8.4.
I am having trouble setting a variable angle for the Transform: Rotation {} element, like this:
transform: Rotation {
axis { x: 0; y: 1; z: 0 }
angle: PathView.angle
}
where PathView.angle varies for each image element. I followed the code here for a cover-flow style container, but that example doesn't work either.
In summary, the code at the bottom produces (see Case 1 in the comments):
Which gets the angle of the delegate rectangles using the variable PathAttribute angle:
PathAttribute { name: "angle"; value: somevalue }
and then the angle is set using:
rotation: PathView.angle
But this is not what I want because the rotation axis is defined about the z-axis, (I need the rotation angle to be defined about y). So I would like something closer to (Case 2):
Now the rotation axis is correct but the angles for each rectangle are all constant (60 deg, as defined in the code).
Case 3 of my code below is what I am trying to get to work but this gives an error (once for each image container) because a variable angle doesn't seem to work with Transform: Rotation {}: (Why?)
Unable to assign [undefined] to double
Any suggestions on how to make this work?
Thanks!
Below is the simplest QML code that illustrates what I am trying to do:
import QtQuick 2.0
Rectangle {
id: mainRect
width: 1024; height: 300
// Flow View:
Rectangle {
width: parent.width; height: parent.height
color: "gray"
PathView {
id: myPV
delegate: pathdelegate
anchors.fill: parent
model: 11 // provide a range of indices
Keys.onLeftPressed: if (!moving && interactive) incrementCurrentIndex()
Keys.onRightPressed: if (!moving && interactive) decrementCurrentIndex()
preferredHighlightBegin: 0.5
preferredHighlightEnd: 0.5
focus: true
interactive: true
path: Path {
id: pathElement
startX: 0; startY: myPV.height / 2
PathAttribute { name: "z"; value: 0 }
PathAttribute { name: "angle"; value: 60 }
PathAttribute { name: "scale"; value: 0.5 }
PathLine { x: myPV.width / 2; y: myPV.height / 2; }
PathAttribute { name: "z"; value: 100 }
PathAttribute { name: "angle"; value: 0 }
PathAttribute { name: "scale"; value: 1.0 }
PathLine { x: myPV.width; y: myPV.height / 2; }
PathAttribute { name: "z"; value: 0 }
PathAttribute { name: "angle"; value: -60 }
PathAttribute { name: "scale"; value: 0.5 }
}
}
// Delegate Component:
Component {
id: pathdelegate
Rectangle {
id: rect
width: 256; height: 256
z: PathView.z
scale: PathView.scale
color: "black"
border.color: "white"
border.width: 3
// Case 1: This works:
rotation: PathView.angle
//Case 2: This works:
//transform: Rotation {
// axis { x: 0; y: 1; z: 0 }
// angle: 60
//}
// Case 3: This is the case that I need to work:
// This DOES NOT work:
// transform: Rotation {
// axis { x: 0; y: 1; z: 0 }
// angle: PathView.angle
//}
}
} // End: Delegate Component
} // End: Flow View:
} // End: mainRect
Try this http://habrahabr.ru/post/190090/
When referring to attached properties from a child object, you have to refer to the property through the parent. For more information, see the documentation.